114 lines
1.5 KiB
SCSS
114 lines
1.5 KiB
SCSS
///////////////////
|
||
// //
|
||
// LISTS //
|
||
// //
|
||
///////////////////
|
||
|
||
@use "@picocss/pico/scss/colors/index" as *;
|
||
|
||
/* Lists of posts (like in categories page) */
|
||
.posts-list {
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-bottom: .5em;
|
||
|
||
> article {
|
||
padding-bottom: .5rem;
|
||
}
|
||
}
|
||
|
||
/* Lists of the main page, for contact */
|
||
.home-lists {
|
||
|
||
margin: 0;
|
||
|
||
@media (min-width: 768px) {
|
||
display: inline-flex;
|
||
flex-flow: row;
|
||
flex-wrap: wrap;
|
||
overflow: visible;
|
||
width: 100%; // set the container width
|
||
|
||
dt {
|
||
flex: 0 0 24%;
|
||
word-wrap: anywhere;
|
||
}
|
||
|
||
dd {
|
||
flex: 0 0 74%;
|
||
margin-left: auto;
|
||
text-align: left;
|
||
}
|
||
}
|
||
|
||
dd {
|
||
margin-left: .5rem;
|
||
}
|
||
|
||
dt::after {
|
||
content: ' :';
|
||
}
|
||
|
||
}
|
||
|
||
/* List under the post information summary */
|
||
.post-info {
|
||
|
||
summary,
|
||
ol,
|
||
ul,
|
||
li {
|
||
margin: 0;
|
||
}
|
||
|
||
ul {
|
||
padding: 0 0 calc(var(--pico-spacing)/1) 0;
|
||
|
||
}
|
||
|
||
li {
|
||
display: flex;
|
||
|
||
> ul {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
padding: 0;
|
||
white-space: pre;
|
||
}
|
||
|
||
> ul::before {
|
||
content: ' ';
|
||
white-space: pre;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
details[open] > ul {
|
||
border-bottom: var(--pico-border-width) solid $purple-200;
|
||
}
|
||
|
||
@media (min-width: 576px) {
|
||
.post-info > ul {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
|
||
> li:not(:last-child) {
|
||
&::after {
|
||
content: ' / ';
|
||
white-space: pre;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.post-taxonomies:not(:last-child) {
|
||
&::after {
|
||
content: ', ';
|
||
}
|
||
}
|
||
|
||
.list-footer {
|
||
padding-left: .5em;
|
||
}
|