Шаблон:NavBar/styles.css: различия между версиями
Admin (обсуждение | вклад) import TemplateStyles CSS |
Admin (обсуждение | вклад) NavBar: тема отдела через --tmp-* (как SS220) |
||
| Строка 6: | Строка 6: | ||
border: 1px solid var(--tmp-25); | border: 1px solid var(--tmp-25); | ||
border-radius: 8px; | border-radius: 8px; | ||
box-shadow: 0 2px 0 rgba(0,0,0,.12 | box-shadow: 0 2px 0 rgba(0, 0, 0, 0.12); | ||
} | } | ||
.navbar-header { | .navbar-header { | ||
display: flex; | display: flex; | ||
align-items: stretch; | |||
justify-content: space-between; | |||
min-height: 2.5rem; | min-height: 2.5rem; | ||
background-color: var(--tmp-75); | background-color: var(--tmp-75); | ||
border-bottom: 2px solid | border-bottom: 2px solid var(--tmp-100); | ||
} | } | ||
.navbar-title { | .navbar-title { | ||
display: flex; | display: flex; | ||
align-items: center; | align-items: center; | ||
justify-content: center; | justify-content: center; | ||
flex: 1; | |||
font-weight: bold; | |||
line-height: 1em; | line-height: 1em; | ||
margin: 2px 0.75rem 0; | margin: 2px 0.75rem 0; | ||
color: # | color: #ffffff; | ||
text-align: center; | |||
} | } | ||
| Строка 40: | Строка 33: | ||
position: relative; | position: relative; | ||
display: flex; | display: flex; | ||
align-items: center; | |||
justify-content: center; | |||
width: 5rem; | width: 5rem; | ||
background-color: var(--tmp-100); | background-color: var(--tmp-100); | ||
| Строка 48: | Строка 43: | ||
.navbar-button:hover { | .navbar-button:hover { | ||
background-color: | background-color: var(--tmp-75); | ||
} | } | ||
.navbar-button:active { | .navbar-button:active { | ||
background-color: | background-color: var(--tmp-50); | ||
transition-duration: 0s; | transition-duration: 0s; | ||
} | } | ||
| Строка 62: | Строка 57: | ||
justify-content: center; | justify-content: center; | ||
font-size: 1.5rem; | font-size: 1.5rem; | ||
top:0;right:0;bottom:0;left:0; | top: 0; | ||
color: # | right: 0; | ||
bottom: 0; | |||
left: 0; | |||
color: #ffffff !important; | |||
} | } | ||
.navbar-content { | .navbar-content { | ||
padding: 0. | padding: 0.75rem; | ||
color: var(--color-text); | |||
background-color: var(--tmp-10); | |||
} | } | ||
.navbar-tabs { | .navbar-tabs { | ||
padding: 0.5rem; | |||
border-top: 1px solid var(--tmp-25); | |||
background-color: var(--tmp-10); | |||
} | } | ||
Версия от 19:25, 6 августа 2026
.navbar {
overflow: hidden;
display: flex;
flex-direction: column;
background-color: var(--tmp-10);
border: 1px solid var(--tmp-25);
border-radius: 8px;
box-shadow: 0 2px 0 rgba(0, 0, 0, 0.12);
}
.navbar-header {
display: flex;
align-items: stretch;
justify-content: space-between;
min-height: 2.5rem;
background-color: var(--tmp-75);
border-bottom: 2px solid var(--tmp-100);
}
.navbar-title {
display: flex;
align-items: center;
justify-content: center;
flex: 1;
font-weight: bold;
line-height: 1em;
margin: 2px 0.75rem 0;
color: #ffffff;
text-align: center;
}
.navbar-button {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 5rem;
background-color: var(--tmp-100);
box-shadow: 0 3px 0 hsla(0, 0%, 0%, 0.33);
transition-property: background-color;
transition-duration: 0.15s;
}
.navbar-button:hover {
background-color: var(--tmp-75);
}
.navbar-button:active {
background-color: var(--tmp-50);
transition-duration: 0s;
}
.navbar-button a {
position: absolute;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.5rem;
top: 0;
right: 0;
bottom: 0;
left: 0;
color: #ffffff !important;
}
.navbar-content {
padding: 0.75rem;
color: var(--color-text);
background-color: var(--tmp-10);
}
.navbar-tabs {
padding: 0.5rem;
border-top: 1px solid var(--tmp-25);
background-color: var(--tmp-10);
}