tilde/data/styles/header.css

131 lines
1.9 KiB
CSS

#partial_header {
float:right;
display:block;
}
nav {
text-align: center ;
font-variant: small-caps ;
clear: both ;
background: var(--altbg) ;
border-radius: 5px ;
border: dashed 1px var(--bordercolor) ;
max-width: var(--genwidth);
}
nav {
margin-left: 5px;
}
nav,header {
max-width: var(--genwidth) ;
}
nav li {
transition:all 1s ease-in-out;
display: block ;
list-style: none ;
background: var(--bg) ;
border-radius: 10px ;
padding: .5em ;
}
nav {
width: 4em;
}
.hidden {
display: none;
}
nav ul li:hover .hidden {
display: inline-block;
}
nav ul li:hover {
margin-right: -5em;
}
nav ul {
align-items: flex-start;
display: flex-container;
}
nav ul, #taglist {
padding: 0;
margin: .5em;
}
a {
color: #36f433;
text-decoration: none;
}
a:hover {
font-style: italic;
}
#partial_header a:hover {
font-style: normal;
}
#partial_header a li:hover {
font-style: italic;
}
dt img {
max-height: 1em;
max-width: 1em;
vertical-align: middle;
}
nav li img {
max-height: 1em;
max-width: 1em;
vertical-align: middle;
}
nav a:hover li, #tagcloud a:hover li {
background: steelblue ;
color: black ;
box-shadow: 2px 2px cyan ;
}
/* This should be genwidth + (navwidth*2) + padding */
@media (min-width: 1200px) {
nav {
float: left ;
vertical-align: middle ;
position: fixed ;
text-align: left ;
font-size: large ;
}
nav li {
display: block ;
text-align: center ;
margin: .5em auto ;
}
}
@media (min-width: 40em) {
.resright, .disappear {
display: block ;
float: right;
padding: 20px ;
clear: both ;
max-height: 300px ;
max-width: 300px ;
}
.resmid {
max-height: 300px ;
max-width: 300px ;
}
main {
max-width: var(--genwidth) ;
}
tr, td {
display: table-cell;
}
td {
float: none;
}
ul.images {
display: flex;
flex-direction: row;
margin: 0;
padding: 0;
width: 25em;
overflow-x: auto;
list-style-type: none;
transition: -webkit-transform 0.25s ease;
transition: transform 0.25s ease;
}
}