krata/_sass/layout/category-tag.scss

67 lines
1.1 KiB
SCSS
Raw Normal View History

2021-01-23 06:20:58 +01:00
/*
Style for page Category and Tag
*/
2019-11-15 17:01:33 +01:00
2020-02-25 10:56:03 +01:00
#page-category, #page-tag {
2020-10-27 15:08:04 +01:00
ul > li {
2020-02-25 10:56:03 +01:00
line-height: 1.5rem;
2020-10-27 15:08:04 +01:00
padding: 0.6rem 0;
2020-02-25 10:56:03 +01:00
&::before { // dot
background: #999;
width: 5px;
height: 5px;
border-radius: 50%;
display: block;
content: "";
position: relative;
2020-10-27 15:08:04 +01:00
top: 0.6rem;
margin-right: 0.5rem;
2020-02-25 10:56:03 +01:00
}
2020-10-27 15:08:04 +01:00
> a { /* post's title */
2020-02-25 10:56:03 +01:00
font-size: 1.1rem;
2020-02-28 17:16:47 +01:00
@extend %no-bottom-border;
2020-02-25 10:56:03 +01:00
}
2020-10-27 15:08:04 +01:00
> span:last-child {
2020-02-25 10:56:03 +01:00
white-space: nowrap;
}
/* post's date */
}
2019-11-15 17:01:33 +01:00
}
2020-10-27 15:08:04 +01:00
#page-tag h1 > i { // tag icon
2019-11-15 17:01:33 +01:00
font-size: 1.2rem;
}
2020-10-27 15:08:04 +01:00
#page-category h1 > i {
2019-11-15 17:01:33 +01:00
font-size: 1.25rem;
}
2020-02-25 10:56:03 +01:00
a:hover {
#page-category &,
#page-tag &,
#access-lastmod & {
@extend %link-hover;
2020-02-25 10:56:03 +01:00
margin-bottom: -1px; // Avoid jumping
}
2019-11-15 17:01:33 +01:00
}
.dash {
margin: 0 .5rem .6rem .5rem;
border-bottom: 2px dotted var(--dash-color);
2019-11-15 17:01:33 +01:00
}
@media all and (max-width: 576px) {
2020-02-25 10:56:03 +01:00
#page-category, #page-tag {
2020-10-27 15:08:04 +01:00
ul > li {
2020-02-25 10:56:03 +01:00
&::before {
margin: 0 .5rem;
}
2020-10-27 15:08:04 +01:00
> a {
2020-02-25 10:56:03 +01:00
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
2020-10-27 15:08:04 +01:00
}