Files
uni-web-site/src/styles/index.styl
2025-12-11 19:59:17 +10:00

168 lines
3.7 KiB
Stylus
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// БЭМ блок: Меню навигации
.menu
border-top double thick silver
border-bottom double thick silver
font-size 0
display grid
grid-template-columns repeat(7, min-content)
grid-template-rows 1fr
justify-items start
&__link
color black
text-decoration none
&__item
display inline-block
width max-content
height 3em
line-height 3em
text-align center
vertical-align middle
padding 0 10px
margin 0 10px
overflow hidden
text-overflow ellipsis
font-size medium
&_selected
color green
font-weight bold
border-left double thin silver
border-right double thin silver
// БЭМ блок: Hero изображения
.hero-images
display flex
flex-direction row
width 90%
margin auto
&__item
margin auto
width 100%
border thin solid black
&:nth-child(2n+1)
margin-top 10px
// БЭМ блок: Основной контейнер
.main
display grid
grid-template-columns 3fr 1fr
grid-template-rows 1fr
&__content
// Стили для основного контента
// БЭМ блок: Информационный блок
.info-block
border solid thin black
padding 2vw
margin 1vw 0
&__header
display block
font-weight bold
text-align center
&__container
&_layout_a
display grid
grid-template-columns 3fr 3fr 2fr
grid-template-rows 1fr
&_layout_b
display grid
grid-template-columns 4fr 7fr 4fr
grid-template-rows 1fr
& > *
margin 2vw
&__text, &__description
text-align justify
&__image
margin auto
width 100%
&__link
// Стили для ссылок
color inherit
&__details
// Стили для деталей
// БЭМ блок: Боковая панель
.sidebar
border-left thin solid black
margin 30px 0 0 50px
// БЭМ блок: Маленькая карточка
.small-card
margin 20px 10px 0
display grid
grid-template-columns 1fr 1fr
grid-template-rows auto
&__content
text-align justify
&__header
display block
font-weight bold
text-align right
&__text
// Базовые стили для текста
&__link
display block
text-align right
color inherit
&__image
& img
width 100%
margin-left:10px
// Медиа-запросы
@media screen and (max-width: 1000px)
.small-card
display flex
flex-direction column
@media screen and (max-width: 800px)
.menu
grid-template-columns 1fr 1fr
grid-template-rows 1fr 1fr 1fr
justify-items center
&__item
&_selected
border-bottom double thick silver
border-left none
border-right none
.hero-images
display inline-flex
flex-direction column
width 100%
&__item
width 100%
height 100%
&:nth-child(2n+1)
margin-top 0px
.main
display flex
flex-direction column
.info-block
&__container
&_layout_a, &_layout_b
display flex
flex-direction column