Вилучено вміст Додано вміст
Немає опису редагування |
Немає опису редагування |
||
| (Не показано 13 проміжних версій цього користувача) | |||
| Рядок 2: | Рядок 2: | ||
display: flex; |
display: flex; |
||
justify-content: right; |
justify-content: right; |
||
align-items: center; |
|||
gap: 8px; |
gap: 8px; |
||
flex-wrap: wrap; |
flex-wrap: wrap; |
||
| Рядок 12: | Рядок 13: | ||
} |
} |
||
.char-ver-nav-link { |
|||
position: relative; |
|||
| ⚫ | |||
display: inline-block; |
display: inline-block; |
||
box-sizing: border-box; |
|||
width: 80px; |
|||
height: 45px; |
|||
padding: 0; |
|||
border-radius: 10px; |
border-radius: 10px; |
||
font-weight: 600; |
font-weight: 600; |
||
text-decoration: none; |
|||
text-align: center; |
text-align: center; |
||
transition: all 0.2s ease; |
transition: all 0.2s ease; |
||
| ⚫ | |||
| ⚫ | |||
background-repeat: no-repeat; |
|||
| ⚫ | |||
flex-shrink: 0; |
|||
} |
|||
.char-ver-nav-ranobe { |
|||
| ⚫ | |||
background-image: url("https://wiki.shield-team.site/images/thumb/7/7a/07.webp/512px-07.webp.png"); |
|||
} |
|||
.char-ver-nav-spinoff { |
|||
| ⚫ | |||
background-image: url("https://wiki.shield-team.site/images/f/fb/512-spinoff.jpg"); |
|||
} |
|||
.char-ver-nav-webnovel { |
|||
border-color: #0073aa; |
|||
background-image: url("https://wiki.shield-team.site/images/5/58/512-webnovel.jpg"); |
|||
} |
|||
.char-ver-nav-link:hover { |
|||
filter: brightness(1.2); |
|||
} |
} |
||
.char-ver-nav- |
.char-ver-nav-current { |
||
box-shadow: 0 0 8px 2px #0073aa; |
|||
| ⚫ | |||
| ⚫ | |||
} |
} |
||
.char-ver-nav- |
.char-ver-nav-text { |
||
position: absolute; |
|||
background: rgba(46, 204, 113, 0.15); |
|||
width: 1px; |
|||
height: 1px; |
|||
overflow: hidden; |
|||
clip-path: inset(50%); |
|||
} |
} |
||
/* Мобільні пристрої — центрування */ |
|||
.char-ver-nav-wrap .char-ver-nav-current { |
|||
@media (max-width: 720px) { |
|||
| ⚫ | |||
| ⚫ | |||
| ⚫ | |||
justify-content: center; |
|||
| ⚫ | |||
} |
|||
} |
} |
||
Поточна версія на 20:23, 2 липня 2026
.char-ver-nav-wrap {
display: flex;
justify-content: right;
align-items: center;
gap: 8px;
flex-wrap: wrap;
margin-bottom: 12px;
}
.char-ver-nav-wrap a {
text-decoration: none;
color: inherit;
}
.char-ver-nav-link {
position: relative;
display: inline-block;
box-sizing: border-box;
width: 80px;
height: 45px;
padding: 0;
border-radius: 10px;
font-weight: 600;
text-align: center;
transition: all 0.2s ease;
background-size: cover;
background-position: center 20%;
background-repeat: no-repeat;
border: 2px solid transparent;
flex-shrink: 0;
}
.char-ver-nav-ranobe {
border-color: #0073aa;
background-image: url("https://wiki.shield-team.site/images/thumb/7/7a/07.webp/512px-07.webp.png");
}
.char-ver-nav-spinoff {
border-color: #0073aa;
background-image: url("https://wiki.shield-team.site/images/f/fb/512-spinoff.jpg");
}
.char-ver-nav-webnovel {
border-color: #0073aa;
background-image: url("https://wiki.shield-team.site/images/5/58/512-webnovel.jpg");
}
.char-ver-nav-link:hover {
filter: brightness(1.2);
}
.char-ver-nav-current {
box-shadow: 0 0 8px 2px #0073aa;
}
.char-ver-nav-text {
position: absolute;
width: 1px;
height: 1px;
overflow: hidden;
clip-path: inset(50%);
}
/* Мобільні пристрої — центрування */
@media (max-width: 720px) {
.char-ver-nav-wrap {
justify-content: center;
}
}