|
|
|
/*=== Feed articles */
|
|
|
|
.flux {
|
|
|
|
// border-left: 2px solid #ecf0f1;
|
|
|
|
background: $white;
|
|
|
|
|
|
|
|
@include transition(all, 0.15s, ease-in-out);
|
|
|
|
|
|
|
|
&:hover {
|
|
|
|
background: $grey-lighter;
|
|
|
|
|
|
|
|
&:not(.current):hover .item.title {
|
|
|
|
background: $grey-lighter;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
&.current {
|
|
|
|
background: $grey-lighter;
|
|
|
|
border-left-color: $main-first;
|
|
|
|
}
|
|
|
|
|
|
|
|
&.not_read:not(.current) {
|
|
|
|
background: $unread-bg; //--------------------
|
|
|
|
|
|
|
|
&:hover .item.title {
|
|
|
|
background: $unread-bg;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
&.not_read {
|
|
|
|
.item.title {
|
|
|
|
a {
|
|
|
|
color: $unread-font-color; //--------------------
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
.item.website {
|
|
|
|
a {
|
|
|
|
color: $unread-font-color; //--------------------
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.item.date {
|
|
|
|
color: scale-color($unread-font-color, $alpha: -50%);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
&.favorite {
|
|
|
|
border-left-color: $fav-bg;
|
|
|
|
|
|
|
|
@include transition(all, 0.15s, ease-in-out);
|
|
|
|
}
|
|
|
|
|
|
|
|
&.favorite:not(.current) {
|
|
|
|
background: $fav-light;
|
|
|
|
|
|
|
|
&:hover .item.title {
|
|
|
|
background: $fav-light;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.website {
|
|
|
|
a {
|
|
|
|
color: $main-font-color;
|
|
|
|
opacity: 0.75;
|
|
|
|
}
|
|
|
|
|
|
|
|
.favicon {
|
|
|
|
padding: 5px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.date {
|
|
|
|
color: scale-color($main-font-color, $alpha: -50%);
|
|
|
|
font-size: 0.85rem;
|
|
|
|
}
|
|
|
|
|
|
|
|
.bottom {
|
|
|
|
font-size: 1rem;
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.flux_header {
|
|
|
|
font-size: 1rem;
|
|
|
|
cursor: pointer;
|
|
|
|
border-top: 1px solid $grey-light;
|
|
|
|
|
|
|
|
.title {
|
|
|
|
font-size: 1rem;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|