From cfdddac43f10d06a8b0e9bcf69dc0ce77ce16649 Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Wed, 8 Jun 2022 19:06:27 +0200 Subject: fix(settings): avoid cropped tooltip on small devices I changed the settings disposition to make tooltip positioning easier. Jest complains about ref passed but everything seems to work as expected so I'm not sure it is relevant. Maybe a bug with cloneElement. --- .../organisms/forms/settings-form.module.scss | 81 ---------------------- 1 file changed, 81 deletions(-) delete mode 100644 src/components/organisms/forms/settings-form.module.scss (limited to 'src/components/organisms/forms/settings-form.module.scss') diff --git a/src/components/organisms/forms/settings-form.module.scss b/src/components/organisms/forms/settings-form.module.scss deleted file mode 100644 index 647f1b5..0000000 --- a/src/components/organisms/forms/settings-form.module.scss +++ /dev/null @@ -1,81 +0,0 @@ -@use "@styles/abstracts/mixins" as mix; - -.wrapper { - display: flex; - flex-flow: row wrap; - align-items: flex-start; - align-content: flex-start; - - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - column-gap: var(--spacing-lg); - row-gap: var(--spacing-xs); - font-size: var(--font-size-sm); - } - } - - .label { - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - margin: 0 auto; - float: none; - font-size: var(--font-size-sm); - } - - @include mix.dimensions(null, "2xs") { - //font-size: var(--font-size-sm); - } - } - } - - .tooltip { - top: unset; - bottom: calc(100% + var(--spacing-2xs)); - font-size: var(--font-size-sm); - transform-origin: bottom center; - - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - width: 250%; - transform-origin: bottom left; - } - - @include mix.dimensions("sm") { - font-size: var(--font-size-md); - } - } - } -} - -.items { - margin: var(--spacing-2xs) 0; - - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - display: flex; - flex-flow: column wrap; - max-width: fit-content; - margin: 0; - } - } -} - -.group { - margin-left: auto; - - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - margin: auto; - } - } -} - -.fieldset__body { - margin-left: auto; - - @include mix.media("screen") { - @include mix.dimensions(null, "2xs", "height") { - margin: 0 auto; - } - } -} -- cgit v1.2.3