| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 1 | @media screen and (min-width: 801px) { |
| 2 | #main { | ||||
| 3 | width: 600px; | ||||
| 4 | } | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 5 | } |
| 6 | |||||
| 7 | article { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 8 | margin: 0.3em; |
| 9 | margin-bottom: 0.3em; | ||||
| 10 | display: flex; | ||||
| 11 | padding: 6px !important; | ||||
| 12 | position: relative; | ||||
| 13 | align-items: flex-start; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 14 | } |
| 15 | |||||
| 16 | .icon { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 17 | margin-right: 10px; |
| 18 | flex-shrink: 0; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 19 | } |
| 20 | |||||
| 21 | .app-details { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 22 | display: flex; |
| 23 | flex-direction: column; | ||||
| 24 | flex-grow: 1; | ||||
| 25 | position: relative; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 26 | } |
| 27 | |||||
| 28 | .app-name-container { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 29 | display: flex; |
| 30 | align-items: center; | ||||
| 31 | justify-content: space-between; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 32 | } |
| 33 | |||||
| 34 | .app { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 35 | margin-bottom: 2px; |
| 36 | margin-top: 0px; | ||||
| 37 | margin-left: 5px; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 38 | } |
| 39 | |||||
| 40 | .description { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 41 | --pico-color: var(--pico-secondary); |
| 42 | font-size: medium; | ||||
| 43 | margin-bottom: 3px; | ||||
| 44 | margin-left: 5px; | ||||
| 45 | text-decoration: none !important; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 46 | } |
| 47 | |||||
| 48 | .app-link:hover .app { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 49 | text-decoration: underline; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 50 | } |
| 51 | |||||
| 52 | .instance-count { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 53 | display: flex; |
| 54 | justify-content: center; | ||||
| 55 | align-items: center; | ||||
| 56 | width: 24px; | ||||
| 57 | height: 24px; | ||||
| 58 | border-radius: 50%; | ||||
| 59 | background-color: white; | ||||
| 60 | color: var(--pico-color); | ||||
| 61 | font-size: 16px; | ||||
| 62 | font-weight: bold; | ||||
| Davit Tabidze | e25ce1c | 2024-06-10 14:36:21 +0400 | [diff] [blame] | 63 | border: 2px solid var(--pico-color) !important; |
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 64 | position: absolute; |
| 65 | top: 14px; | ||||
| 66 | right: 11px; | ||||
| 67 | transform: translate(50%, -50%); | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 68 | } |
| 69 | |||||
| 70 | pre { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 71 | white-space: pre-wrap; |
| 72 | /* Since CSS 2.1 */ | ||||
| 73 | white-space: -moz-pre-wrap; | ||||
| 74 | /* Mozilla, since 1999 */ | ||||
| 75 | white-space: -pre-wrap; | ||||
| 76 | /* Opera 4-6 */ | ||||
| 77 | white-space: -o-pre-wrap; | ||||
| 78 | /* Opera 7 */ | ||||
| 79 | word-wrap: break-word; | ||||
| 80 | /* Internet Explorer 5.5+ */ | ||||
| 81 | background-color: transparent; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 82 | } |
| 83 | |||||
| 84 | .hidden { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 85 | visibility: hidden; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 86 | } |
| 87 | |||||
| 88 | .toast { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 89 | position: fixed; |
| 90 | z-index: 999; | ||||
| 91 | bottom: 10px; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 92 | } |
| 93 | |||||
| 94 | .app-link { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 95 | padding-top: 0px; |
| 96 | padding-bottom: 2px; | ||||
| 97 | text-decoration: none; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 98 | } |
| 99 | |||||
| 100 | nav li { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 101 | padding-top: 0; |
| 102 | padding-bottom: 0; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 103 | } |
| 104 | |||||
| 105 | input[type="search"] { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 106 | margin-bottom: 0; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 107 | } |
| 108 | |||||
| 109 | .page { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 110 | display: flex; |
| 111 | align-items: center; | ||||
| 112 | flex-direction: column; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 113 | } |
| 114 | |||||
| 115 | .search-bar { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 116 | max-width: 616px; |
| 117 | min-width: 500px; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 118 | } |
| 119 | |||||
| 120 | .card-content { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 121 | width: 100%; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 122 | } |
| 123 | |||||
| 124 | .app-card { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 125 | margin-bottom: 6px; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 126 | } |
| 127 | |||||
| 128 | header { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 129 | height: 80px !important; |
| 130 | display: flex; | ||||
| 131 | align-items: center; | ||||
| 132 | justify-content: center; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 133 | } |
| 134 | |||||
| 135 | header > h1 { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 136 | margin-bottom: 0px; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 137 | } |
| 138 | |||||
| 139 | nav { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 140 | height: 100%; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 141 | } |
| 142 | |||||
| 143 | #config-form label { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 144 | width: auto !important; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 145 | } |
| 146 | |||||
| 147 | html { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 148 | scroll-behavior: smooth; |
| 149 | --pico-header-height: 80px; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 150 | } |
| 151 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 152 | body > header.is-fixed-above-lg + main { |
| 153 | --pico-main-top-offset: var(--pico-header-height); | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 154 | } |
| 155 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 156 | body > header.is-fixed-above-lg { |
| 157 | z-index: 2; | ||||
| 158 | position: sticky; | ||||
| 159 | top: 0; | ||||
| 160 | -webkit-backdrop-filter: blur(1rem); | ||||
| 161 | backdrop-filter: blur(1rem); | ||||
| 162 | background-color: var(--pico-header-background); | ||||
| 163 | transition: border-top-color 0.4s ease-in-out, box-shadow 0.4s ease-in-out; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 164 | } |
| 165 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 166 | body > header.is-fixed-above-lg.is-fixed { |
| 167 | border-bottom-color: var(--pico-header-border-color); | ||||
| 168 | box-shadow: var(--pico-card-box-shadow); | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 169 | } |
| 170 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 171 | body > header { |
| 172 | z-index: 4; | ||||
| 173 | position: relative; | ||||
| 174 | padding: 0.5rem 0; | ||||
| 175 | border-bottom: var(--pico-border-width) solid transparent; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 176 | } |
| 177 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 178 | body > main { |
| 179 | display: grid; | ||||
| 180 | grid-template-rows: auto auto 1fr; | ||||
| 181 | grid-template-columns: 11rem 1fr; | ||||
| 182 | grid-template-areas: "menu content"; | ||||
| 183 | column-gap: 2rem; | ||||
| 184 | margin-top: 1rem; | ||||
| 185 | padding: 0; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 186 | } |
| 187 | |||||
| 188 | #menu-nav { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 189 | grid-area: menu; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 190 | } |
| 191 | |||||
| 192 | #content { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 193 | grid-area: content; |
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 194 | } |
| 195 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 196 | main > aside { |
| 197 | --pico-font-size: 16px; | ||||
| 198 | font-size: var(--pico-font-size); | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 199 | } |
| 200 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 201 | body > main > aside > nav.is-sticky-above-lg { |
| 202 | position: sticky; | ||||
| 203 | top: calc( | ||||
| 204 | var(--pico-main-top-offset) + var(--pico-block-spacing-vertical) / 2 | ||||
| 205 | ); | ||||
| 206 | max-height: calc(var(--max-height) - var(--pico-spacing)); | ||||
| 207 | overflow: auto; | ||||
| 208 | transition: top var(--pico-transition); | ||||
| 209 | transition-delay: 50ms; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 210 | } |
| 211 | |||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 212 | main > aside#menu-nav nav { |
| 213 | margin-bottom: var(--pico-spacing); | ||||
| 214 | margin-block: calc(var(--pico-outline-width) * -1); | ||||
| 215 | padding-block: var(--pico-outline-width); | ||||
| 216 | overflow: auto; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 217 | } |
| 218 | |||||
| 219 | #menu-nav nav ul:first-of-type { | ||||
| Davit Tabidze | 014c696 | 2024-06-07 18:37:04 +0400 | [diff] [blame] | 220 | margin: 0; |
| 221 | padding: 0; | ||||
| Davit Tabidze | 3ec24cf | 2024-05-22 14:06:02 +0400 | [diff] [blame] | 222 | } |
| gio | f9f0bee | 2024-06-11 20:10:05 +0400 | [diff] [blame^] | 223 | |
| 224 | .progress { | ||||
| 225 | padding-left: 0; | ||||
| 226 | } | ||||
| 227 | |||||
| 228 | .progress ul { | ||||
| 229 | padding-left: 15px; | ||||
| 230 | } | ||||
| 231 | |||||
| 232 | .progress li { | ||||
| 233 | list-style-type: none; | ||||
| 234 | } | ||||