| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 1 | .icon { |
| 2 | height: 32px; | ||||
| 3 | margin: 0; | ||||
| 4 | padding: 0; | ||||
| 5 | width: 32px; | ||||
| pineafan | 802daca | 2022-10-24 21:57:29 +0100 | [diff] [blame^] | 6 | user-select: none; |
| 7 | } | ||||
| 8 | |||||
| 9 | .themeChangeIcon { | ||||
| 10 | margin-bottom: 10px; | ||||
| 11 | transform: translateY(var(--theme-ui-colors-offset)); | ||||
| 12 | transition: transform 0.3s ease-in-out; | ||||
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 13 | } |
| pineafan | 15b813d | 2022-02-13 10:06:09 +0000 | [diff] [blame] | 14 | |
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 15 | .container { |
| pineafan | 15b813d | 2022-02-13 10:06:09 +0000 | [diff] [blame] | 16 | position: fixed; |
| 17 | top: 0; | ||||
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 18 | display: flex; |
| 19 | justify-content: left; | ||||
| 20 | align-items: center; | ||||
| 21 | flex-direction: row; | ||||
| pineafan | 802daca | 2022-10-24 21:57:29 +0100 | [diff] [blame^] | 22 | overflow-y: hidden; |
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 23 | gap: 10px; |
| 24 | |||||
| 25 | height: 42px; | ||||
| 26 | padding: 5px; | ||||
| 27 | padding-left: 25px; | ||||
| 28 | |||||
| 29 | z-index: 69; | ||||
| 30 | } | ||||
| 31 | |||||
| 32 | .divider { | ||||
| 33 | height: 100%; | ||||
| 34 | width: 3px; | ||||
| 35 | border-radius: 100vh; | ||||
| 36 | background-color: #424242; | ||||
| 37 | } | ||||
| 38 | |||||
| 39 | .skipNav { | ||||
| 40 | width: 0%; | ||||
| pineafan | 15b813d | 2022-02-13 10:06:09 +0000 | [diff] [blame] | 41 | overflow: hidden; |
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 42 | color: white; |
| 43 | max-lines: 1; | ||||
| 44 | text-overflow: clip; | ||||
| 45 | -webkit-line-clamp: 1; | ||||
| 46 | height: 20px; | ||||
| 47 | transition: width 0.3s ease-in-out; | ||||
| pineafan | 15b813d | 2022-02-13 10:06:09 +0000 | [diff] [blame] | 48 | } |
| 49 | |||||
| pineafan | ff3d452 | 2022-05-06 19:51:02 +0100 | [diff] [blame] | 50 | .skipNav:focus { |
| 51 | width: 100%; | ||||
| 52 | overflow: auto; | ||||
| 53 | } | ||||