diff options
| author | Sam Nystrom <sam@samnystrom.dev> | 2024-03-13 05:14:56 +0000 |
|---|---|---|
| committer | Sam Nystrom <sam@samnystrom.dev> | 2024-03-13 20:17:07 -0400 |
| commit | 2e39671e683f2fdf5a94dafe8d49c4c5befa38c8 (patch) | |
| tree | e1bb7448c1105834b2f59c816b3240c98f869399 /src/Toolbar.css | |
| parent | 5374566f2c3fd345ee25ee7896dfbb3156bd2cfd (diff) | |
refactor: finish removing CSS modules
Diffstat (limited to 'src/Toolbar.css')
| -rw-r--r-- | src/Toolbar.css | 78 |
1 files changed, 78 insertions, 0 deletions
diff --git a/src/Toolbar.css b/src/Toolbar.css new file mode 100644 index 0000000..b96e40c --- /dev/null +++ b/src/Toolbar.css @@ -0,0 +1,78 @@ +@scope (.__Toolbar) { + .toolbar { + background-color: var(--surface); + border-bottom: 1px solid var(--overlay); + width: 100%; + margin: 0; + padding: 0; + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + + > * { + flex-grow: 1; + display: flex; + justify-content: center; + } + :first-child, :last-child { flex-basis: 0 } + :first-child { justify-content: flex-start } + :last-child { justify-content: flex-end } + + > menu { + margin: 0; + padding: 0; + list-style: none; + display: flex; + flex-direction: row; + } + + h1 { + font-size: 1.5rem; + font-weight: normal; + margin: 0; + } + + button { + background-color: transparent; + border: none; + outline: none; + padding: 1rem; + color: var(--text); + font-size: 1em; + :hover { background-color: var(--overlay) } + } + + path { + fill: var(--text); + } + } + + .addMenu:popover-open { + background-color: var(--surface); + list-style: none; + border: none; + position: absolute; + inset: unset; + width: auto; + height: auto; + left: 140px; + top: 52px; + margin: 0; + padding: 0; + display: flex; + flex-direction: column; + --shadow-color: 0deg 0% 0%; + box-shadow: + 0.1px 0.4px 0.6px hsl(var(--shadow-color) / 0.04), + 0.5px 3.3px 4.8px -0.2px hsl(var(--shadow-color) / 0.15), + 1.4px 10.2px 14.7px -0.5px hsl(var(--shadow-color) / 0.27); + + button { + padding: 4px; + width: 100%; + text-align: left; + &:hover { background-color: var(--overlay) } + } + } +}
\ No newline at end of file |