Шаблон:Схема годоса/hodoscheme.css: различия между версиями
добавил границы для элементов группы, отступы для групп (возможно, большие) |
определил точнее стили групп и уточнил правила рисовки всех границ |
||
| Строка 36: | Строка 36: | ||
height: 50%; | height: 50%; | ||
} | } | ||
.hsGroupLeft{ | ol.hsGroupLeft{ | ||
margin-bottom: 10%; | margin-bottom: 10%; | ||
border-bottom: 2px solid; | border-bottom: 2px solid; | ||
border-color: black; | |||
} | } | ||
.hsGroupLeft li{ | .hsGroupLeft li{ | ||
border-width: 0 1px 1px; | border-width: 0 1px 1px; | ||
} | } | ||
.hsGroupRight{ | ol.hsGroupRight{ | ||
margin-top: 10%; | margin-top: 10%; | ||
border-top: 2px solid; | border-top: 2px solid; | ||
border-color: black; | |||
} | } | ||
.hsGroupRight li{ | .hsGroupRight li{ | ||
| Строка 59: | Строка 61: | ||
text-align: center; | text-align: center; | ||
flex: 1 0 auto; | flex: 1 0 auto; | ||
border-style: solid; | |||
border-color: black; | |||
} | } | ||
#hsStartTop{ | #hsStartTop{ | ||
Версия от 20:11, 1 декабря 2024
.hsBody li,
.hsBody ol{
list-style-type: none;
margin: 0;
}
/* структура схемы */
.hsBody,
#hsCaption,
#hsTitle{
width: 100%;
}
.hsElements{
display: flex;
flex-wrap: wrap;
row-gap: 0.5em;
background: lightgray;
font-size: small;
}
.hsElements > li{
display: inline-block;
height: 9em;
flex-grow: 1;
}
li#hsBeforeStart,
li#hsStart,
li.hsCross,
li#hsEnd,
li#hsAfterEnd{
display: inline flex;
align-items: center;
width: 6em;
text-align: center;
}
.hsGroup > ol{
display: flex;
height: 50%;
}
ol.hsGroupLeft{
margin-bottom: 10%;
border-bottom: 2px solid;
border-color: black;
}
.hsGroupLeft li{
border-width: 0 1px 1px;
}
ol.hsGroupRight{
margin-top: 10%;
border-top: 2px solid;
border-color: black;
}
.hsGroupRight li{
border-width: 1px 1px 0;
}
.hsGroupLeft > li,
.hsGroupRight > li{
display: flex;
align-items: center;
margin: 0 auto;
height: 100%;
max-width: 11em;
text-align: center;
flex: 1 0 auto;
border-style: solid;
border-color: black;
}
#hsStartTop{
}
#hsStartBottom{
}
.budynek{
background-color: yellow;
}
.park{
background-color: green;
}
.hydro{
background-color: blue;
}
.terytorium{
background-color: gray;
}
.hsElements a{
color: black;
text-decoration: none;
display: inline-block;
margin: 0 auto;
}
#hsEnd{
}
#hsEndTop{
}
#hsEndBottom{
}
#hsAfterEnd{
}