From 02c2d4a90847e23c779866e149c3cf181b574c13 Mon Sep 17 00:00:00 2001 From: lonkaars Date: Sun, 18 Jul 2021 14:11:28 +0200 Subject: slide settings beginnings --- styles/editor.css | 18 +++++++++++------- styles/globals.css | 13 +++++++++++++ 2 files changed, 24 insertions(+), 7 deletions(-) (limited to 'styles') diff --git a/styles/editor.css b/styles/editor.css index 4483c51..d1e5e00 100644 --- a/styles/editor.css +++ b/styles/editor.css @@ -224,10 +224,12 @@ opacity: .6; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root { +.appGrid .settings .MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root { border-color: var(--c700); } +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root { border-width: 2px; padding: 8px; color: var(--c800); + background-color: transparent; border-color: var(--c400); margin-right: -1px; transition-property: opacity, background-color, color, border-color; @@ -246,22 +248,24 @@ border-bottom-color: var(--c600) !important; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root.Mui-selected { +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root.Mui-selected { color: var(--gruble); background-color: rgba(93, 233, 174, 0.12); +} +.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root.Mui-selected { border-top-color: #334A5A; border-bottom-color: #334A5A; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root:first-child { +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root:first-child { border-radius: 6px 0 0 6px; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root:last-child { +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root:last-child { border-radius: 0 6px 6px 0; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd { +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root .loopStartEnd { display: inline-block; white-space: nowrap; line-height: 0; @@ -270,8 +274,8 @@ width: 36px; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd .start { left: -3px; } -.appGrid .tools .MuiToggleButtonGroup-root .MuiToggleButton-root .loopStartEnd .end { right: -3px; } +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root .loopStartEnd .start { left: -3px; } +.MuiToggleButtonGroup-root.toolsSelection .MuiToggleButton-root .loopStartEnd .end { right: -3px; } .appGrid .timeline { grid-column: 2; diff --git a/styles/globals.css b/styles/globals.css index 471cc80..3cefd6a 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -41,3 +41,16 @@ h1, h2, h3 { height: 8px; } +.MuiInputLabel-root { + transition-property: width; + transition-duration: 100ms; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + width: calc(100% - 48px); +} + +.MuiInputLabel-root.MuiInputLabel-shrink { + width: calc(100% - 0px); +} -- cgit v1.2.3