rss2html/rss2html.css

186 lines
2.8 KiB
CSS

.item {
border-style: solid;
border-width: 1px;
border-color: #88F;
border-radius: 0.2em 0.2em 0.2em 1.5em;
padding: 0.5em;
background-color: #F6F6FF;
margin: 1em;
hyphens: auto;
-moz-hyphens: auto;
max-width: 40em;
}
@media screen and (min-width: 45em) {
.item {
width: 40em;
}
}
// .item:after {
// display: block;
// clear: both;
// content: "";
// background-color: #00F;
// height: 6px;
// background: linear-gradient(#F6F6FF, #EEEEFF);
// }
.op {
float: right;
padding: 6px;
}
.op a {
border-style: none;
border-radius: 3px;
padding: 3px;
background: linear-gradient(#88F, #008);
color: #FFF;
}
h2 a {
text-decoration: none;
}
h2 {
font-family: "Quercus", sans-serif;
font-variant: small-caps;
}
.itemno {
font-size: 0.5em;
}
.itemno:before {
content: " (";
color: #F00;
}
.itemno:after {
content: ") ";
color: #F00;
}
.feed_info {
display: table-row;
border-style: solid;
border-width: 1px;
margin: .1em;
}
.feed_id {
font-size: 0.7em;
display: table-cell;
text-align: right;
padding-right: 0.5em;
}
.feed_title {
padding-right: 0.2em;
}
.feed_items {
background-color: #CCF;
color: #888;
display: table-cell;
text-align: right;
padding-left: 0.2em;
padding-right: 0.2em;
}
.feed_unread {
background-color: #DDF;
color: #080;
display: table-cell;
text-align: right;
padding-left: 0.2em;
padding-right: 0.2em;
}
.feed_lastissued {
background-color: #CCF;
color: #000;
display: table-cell;
padding-left: 0.2em;
padding-right: 0.2em;
text-align: right;
}
.feed_lastseen {
background-color: #DDF;
color: #000;
display: table-cell;
padding-left: 0.2em;
padding-right: 0.2em;
text-align: right;
}
.feedlist {
background-color: #BBF;
float: left;
display: table;
margin-right: 0.5em;
padding: 0.2em;
}
input[type=checkbox]:checked ~ .feedlist {
display: block;
}
input[type=checkbox] ~ .feedlist {
display: none;
}
.feedlist a {
text-decoration: none;
}
.op a {
text-decoration: none;
}
.itemlist {
//background-color: #EEF;
font-family: "Quercus", sans-serif;
display: flex;
flex-flow: row wrap;
}
@media screen and (min-width: 45em) and (max-width: 60em) {
.itemlist {
max-width: 68%;
}
.feedlist {
max-width: 32%;
}
}
.item.read {
background-color: #EEE;
}
.lastupdate {
position: absolute;
top: 0em;
right: 0em;
}
h1 {
background: linear-gradient(to right, #008, #CCF);
margin: 0em;
color: #FFF;
}
body {
margin: 0em;
}
img {
max-width: 99%;
}
.content {
max-height: 50vh;
overflow: auto;
}