diff --git a/web/apps/labelstudio/src/components/SidebarMenu/SidebarMenu.scss b/web/apps/labelstudio/src/components/SidebarMenu/SidebarMenu.scss index 1053ab24e4c6..39e82e296732 100644 --- a/web/apps/labelstudio/src/components/SidebarMenu/SidebarMenu.scss +++ b/web/apps/labelstudio/src/components/SidebarMenu/SidebarMenu.scss @@ -27,4 +27,4 @@ overflow: auto; padding: 2rem; } -} +} \ No newline at end of file diff --git a/web/apps/labelstudio/src/pages/CreateProject/Config/Config.scss b/web/apps/labelstudio/src/pages/CreateProject/Config/Config.scss index 4149625268ad..6568bf471962 100644 --- a/web/apps/labelstudio/src/pages/CreateProject/Config/Config.scss +++ b/web/apps/labelstudio/src/pages/CreateProject/Config/Config.scss @@ -1,17 +1,5 @@ $scroll-width: 5px; -@mixin styled-scroll() { - &::-webkit-scrollbar { - width: 6px; - height: 6px; - background-color: var(--color-neutral-border-bolder); - } - - &::-webkit-scrollbar-thumb { - background-color: var(--color-neutral-surface); - } -} - .panel { display: none; } @@ -24,18 +12,18 @@ $scroll-width: 5px; flex-direction: column; } -.sidebar-menu__content > .wizard { +.sidebar-menu__content>.wizard { height: calc(100% + 64px); - margin: -32px -40px; + margin: -32px; } -.wizard > .configure { +.wizard>.configure { flex: 1; min-height: 0; display: flex; align-items: stretch; - > * { + >* { flex: 50%; } } @@ -254,8 +242,6 @@ $scroll-width: 5px; display: flex; flex: 1; overflow-y: auto; - - @include styled-scroll; } .configure__tags-link { @@ -284,7 +270,7 @@ $scroll-width: 5px; } .wizard .configure__visual { - > * { + >* { border-top: 1px solid var(--color-neutral-border); padding-top: 16px; margin-bottom: 16px; @@ -301,7 +287,8 @@ $scroll-width: 5px; } } - input, select { + input, + select { padding: 4px 8px; font: inherit; color: inherit; @@ -316,12 +303,12 @@ $scroll-width: 5px; color: var(--color-neutral-content); } - > p { + >p { line-height: 32px; color: var(--color-neutral-content-subtler); } - > p.configure__object-error { + >p.configure__object-error { line-height: 22px; margin-top: 8px; color: var(--color-negative-content); @@ -399,8 +386,6 @@ $scroll-width: 5px; align-items: stretch; flex: 1; - @include styled-scroll; - .configure__label { display: flex; align-items: stretch; @@ -545,8 +530,6 @@ $scroll-width: 5px; flex-direction: column; color: var(--color-neutral-content); - @include styled-scroll; - h3 { margin: 8px 0 16px; font-size: 16px; @@ -585,7 +568,7 @@ $scroll-width: 5px; .main-view { - &__annotation{ + &__annotation { padding: 0; } } @@ -605,4 +588,4 @@ div[class^="App_menu"]>div { :global(input.lsf-configure__add:hover) { color: var(--color-neutral-content); background: var(--color-primary-emphasis-subtle); -} +} \ No newline at end of file diff --git a/web/libs/editor/src/assets/styles/_mixins.scss b/web/libs/editor/src/assets/styles/_mixins.scss index ce6245c12465..6ead273d7ea8 100644 --- a/web/libs/editor/src/assets/styles/_mixins.scss +++ b/web/libs/editor/src/assets/styles/_mixins.scss @@ -10,21 +10,6 @@ } } -@mixin styled-scrollbars(){ - scrollbar-color: var(--color-neutral-border) var(--color-neutral-background); - scrollbar-width: thin; - - &::-webkit-scrollbar{ - width: 4px; - height: 4px; - background-color: var(--color-neutral-surface); - } - - &::-webkit-scrollbar-thumb{ - background: var(--color-neutral-border-boldest); - } -} - @mixin waiting($c1: #efefef, $c2: #fff) { $base-color: rgba($c2, 0.2); $accent-color: $c1; @@ -46,4 +31,4 @@ 100% { background-position: 37px 0; } -} +} \ No newline at end of file diff --git a/web/libs/editor/src/components/SidePanels/PanelBase.scss b/web/libs/editor/src/components/SidePanels/PanelBase.scss index e1d63904ab36..a2ce2d132a99 100644 --- a/web/libs/editor/src/components/SidePanels/PanelBase.scss +++ b/web/libs/editor/src/components/SidePanels/PanelBase.scss @@ -243,8 +243,6 @@ overflow: hidden auto; height: calc(100% - var(--header-height)); position: relative; - - @include styled-scrollbars; } &__resizer { @@ -377,4 +375,4 @@ display: block; } } -} +} \ No newline at end of file diff --git a/web/libs/editor/src/components/SidePanels/SidePanels.scss b/web/libs/editor/src/components/SidePanels/SidePanels.scss index 58a5dce0f3f2..2d94f28ee7a9 100644 --- a/web/libs/editor/src/components/SidePanels/SidePanels.scss +++ b/web/libs/editor/src/components/SidePanels/SidePanels.scss @@ -26,8 +26,6 @@ position: relative; z-index: 1; - @include styled-scrollbars; - & .main-content { overflow: auto; padding-bottom: calc(var(--bottombar-height) + 8px); @@ -134,4 +132,4 @@ flex: 1; } } -} +} \ No newline at end of file diff --git a/web/libs/editor/src/components/SidePanels/TabPanels/PanelTabsBase.scss b/web/libs/editor/src/components/SidePanels/TabPanels/PanelTabsBase.scss index 2664c6ba87e0..d569df2b8aea 100644 --- a/web/libs/editor/src/components/SidePanels/TabPanels/PanelTabsBase.scss +++ b/web/libs/editor/src/components/SidePanels/TabPanels/PanelTabsBase.scss @@ -200,9 +200,6 @@ overflow: hidden; height: calc(100% - var(--header-height)); position: relative; - - @include styled-scrollbars; - pointer-events: all; } diff --git a/web/libs/editor/src/components/SidePanels/TabPanels/Tabs.scss b/web/libs/editor/src/components/SidePanels/TabPanels/Tabs.scss index 6775bd874096..2e6f9b38f723 100644 --- a/web/libs/editor/src/components/SidePanels/TabPanels/Tabs.scss +++ b/web/libs/editor/src/components/SidePanels/TabPanels/Tabs.scss @@ -29,8 +29,6 @@ z-index: 1; overflow: hidden auto; - @include styled-scrollbars; - & .main-content { overflow: auto; padding-bottom: calc(var(--bottombar-height) + 8px); @@ -171,4 +169,4 @@ width: 4px; height: 30px; } -} +} \ No newline at end of file diff --git a/web/libs/editor/tests/e2e/tests/conditional-serialization.test.js b/web/libs/editor/tests/e2e/tests/conditional-serialization.test.js index af8a554ea610..6952d7188ae4 100644 --- a/web/libs/editor/tests/e2e/tests/conditional-serialization.test.js +++ b/web/libs/editor/tests/e2e/tests/conditional-serialization.test.js @@ -55,6 +55,7 @@ Scenario("TextArea should not be serialized when parent View is not visible", as I.dontSee("Y"); I.dontSee("details"); + I.wait(1); I.say("Check serialization - details should not be included"); const result = await LabelStudio.serialize(); diff --git a/web/libs/ui/src/tailwind.css b/web/libs/ui/src/tailwind.css index a2da45efbe71..ef4e226b478a 100644 --- a/web/libs/ui/src/tailwind.css +++ b/web/libs/ui/src/tailwind.css @@ -6,18 +6,40 @@ body { @apply !text-neutral-content !bg-neutral-background; } -h1, h2, h3, h4, h5, h6 { +h1, +h2, +h3, +h4, +h5, +h6 { font-weight: 500; margin: 0; color: inherit !important; } -h1 { font-size: 2em; } -h2 { font-size: 1.5em; } -h3 { font-size: 1.17em; } -h4 { font-size: 1em; } -h5 { font-size: 0.83em; } -h6 { font-size: 0.67em; } +h1 { + font-size: 2em; +} + +h2 { + font-size: 1.5em; +} + +h3 { + font-size: 1.17em; +} + +h4 { + font-size: 1em; +} + +h5 { + font-size: 0.83em; +} + +h6 { + font-size: 0.67em; +} a { @apply text-primary-content; @@ -94,3 +116,18 @@ a:hover { pointer-events: all; } } + +* { + scrollbar-color: var(--color-neutral-border) var(--color-neutral-background); + scrollbar-width: thin; +} + +*::-webkit-scrollbar { + width: 4px; + height: 4px; + background-color: var(--color-neutral-surface); +} + +*::-webkit-scrollbar-thumb { + background: var(--color-neutral-border-boldest); +} \ No newline at end of file