|
8 | 8 | --form-color: #f5fff0; |
9 | 9 | --button-color: white; |
10 | 10 | --red: rgb(192 15 15); |
| 11 | + --back-color: white; |
11 | 12 |
|
12 | 13 | /* Основные размеры */ |
13 | 14 | --font-size: 16px; |
|
69 | 70 | background-color: var(--back-color); |
70 | 71 | } |
71 | 72 |
|
72 | | -.visited{ |
| 73 | +.visited { |
73 | 74 | width: 100%; |
74 | 75 | height: 100%; |
75 | 76 | font-size: var(--table-font); |
|
79 | 80 | opacity: 0.9 !important; |
80 | 81 | } |
81 | 82 |
|
82 | | -.hover{ |
| 83 | +.hover { |
83 | 84 | background-color: var(--form-color); |
84 | 85 | } |
85 | 86 |
|
@@ -111,25 +112,6 @@ button[type="button"]:hover { |
111 | 112 | transition: var(--transit); |
112 | 113 | } |
113 | 114 |
|
114 | | -.back-button { |
115 | | - position: absolute; |
116 | | - top: 20px; |
117 | | - left: 20px; |
118 | | - background: var(--primary-color); |
119 | | - color: var(--button-color); |
120 | | - padding: 10px 20px; |
121 | | - border: none; |
122 | | - border-radius: var(--border-radius); |
123 | | - cursor: pointer; |
124 | | - text-decoration: none; |
125 | | - transition: background-color 0.3s ease-in-out; |
126 | | -} |
127 | | - |
128 | | -.back-button:hover { |
129 | | - background: var(--secondary-color); |
130 | | - border: 2px solid var(--text-color); |
131 | | -} |
132 | | - |
133 | 115 | form { |
134 | 116 | text-align: center; |
135 | 117 | width: 50%; |
@@ -287,3 +269,52 @@ input[type="submit"]:hover { |
287 | 269 | font-size: var(--table-font); |
288 | 270 | color: var(--red); |
289 | 271 | } |
| 272 | + |
| 273 | +.header-buttons { |
| 274 | + display: flex; |
| 275 | + flex-direction: row; |
| 276 | + justify-content: space-between; |
| 277 | + align-items: center; |
| 278 | + position: fixed; |
| 279 | + top: 0; |
| 280 | + left: 0; |
| 281 | + right: 0; |
| 282 | + padding: 0 20px; |
| 283 | + height: 60px; |
| 284 | + background: var(--back-color); |
| 285 | + border-bottom: var(--border); |
| 286 | + z-index: 1000; |
| 287 | +} |
| 288 | + |
| 289 | +.back-button, |
| 290 | +#theme { |
| 291 | + display: flex; |
| 292 | + justify-content: center; |
| 293 | + align-items: center; |
| 294 | + min-width: 120px; |
| 295 | + background: var(--primary-color); |
| 296 | + color: var(--button-color); |
| 297 | + width: max-content; |
| 298 | + height: 80%; |
| 299 | + border: none; |
| 300 | + border-radius: var(--border-radius); |
| 301 | + cursor: pointer; |
| 302 | + text-decoration: none; |
| 303 | + transition: background-color 0.3s ease-in-out; |
| 304 | + font-size: var(--font-size); |
| 305 | + transition: var(--transit); |
| 306 | +} |
| 307 | + |
| 308 | +.back-button:hover, |
| 309 | +#theme:hover { |
| 310 | + background: var(--secondary-color); |
| 311 | + border: 2px solid var(--text-color); |
| 312 | +} |
| 313 | + |
| 314 | +.back-button { |
| 315 | + margin-right: auto; /* Прижимает к левому краю */ |
| 316 | +} |
| 317 | + |
| 318 | +#theme { |
| 319 | + margin-left: auto; /* Прижимает к правому краю */ |
| 320 | +} |
0 commit comments