%PDF- %PDF-
| Direktori : /usr/share/yelp-xsl/xslt/common/css/ |
| Current File : //usr/share/yelp-xsl/xslt/common/css/core.css.tmpl |
<tmpl>
html { height: 100%; }
body {
font-family: sans-serif;
margin: 0; padding: 0;
background-color: {{$color.bg}};
color: {{$color.fg}};
direction: {{$direction}};
}
article, aside, nav, header, footer, section {
display: block;
margin: 0;
padding: 0;
}
main {
display: flex;
flex-flow: row;
}
main > * {
flex: 0 0 220px;
}
main > div.page {
flex-grow: 1;
margin: 0;
display: flex;
flex-flow: column;
align-items: stretch;
justify-content: flex-start;
min-height: 100vh;
}
div.page > article { flex: 1 0 auto; }
div.page > header, div.page > footer { flex: 0 1 auto; }
.pagewide {
max-width: {{$html.grid.size - 20}}px;
margin-left: auto;
margin-right: auto;
padding-left: 10px;
padding-right: 10px;
}
aside.sidebar {
width: 300px;
padding: 20px 10px;
background: {{$color.bg.gray}}
}
@media only screen and (max-width: 720px) {
aside.sidebar {
display: none;
}
}
aside.sidebar-right { order: 3; }
aside.sidebar section { margin-top: 0; }
aside.sidebar * { margin-bottom: 20px; }
aside.sidebar section > div.inner > div.hgroup {
border-bottom: none;
}
aside.sidebar section h2 {
font-size: 1em;
margin-bottom: 0;
}
article {
padding-top: 10px;
padding-bottom: 10px;
min-height: 20em;
background-color: {{$color.bg}};
}
section {
margin-top: 2.4em;
clear: both;
}
section section {
margin-top: 1.44em;
}
.yelp-hash-highlight {
animation-name: yelp-hash-highlight;
animation-duration: 0.5s;
animation-fill-mode: forwards;
}
@keyframes yelp-hash-highlight {
from { transform: translateY(0px) }
25% { transform: translateY(20px); }
50% { transform: translateY(0); }
75% { transform: translateY(10px); }
to { transform: translateY(0px); }
}
div.trails {
margin: 0 -10px 0 -10px;
padding: 0.2em 10px;
background-color: {{$color.bg.gray}};
}
div.trail {
margin: 0.2em 0;
padding: 0 1em 0 1em;
text-indent: -1em;
color: {{$color.fg.dark}};
}
a.trail { white-space: nowrap; }
div.hgroup {
margin-bottom: 0.5em;
color: {{$color.fg.dark}};
}
section > div.inner > div.hgroup {
margin-top: 0;
border-bottom: solid 1px {{$color.gray}};
}
section.links > div.inner > div.hgroup {
border-bottom: solid 2px {{$color.fg.blue}};
}
section section.links > div.inner > div.hgroup {
border: none;
}
h1, h2, h3, h4, h5, h6, h7 {
margin: 0; padding: 0;
font-weight: normal;
}
h1 { font-size: 2.4em; }
h2 { font-size: 1.72em; }
h3.title, h4.title, h5.title, h6.title, h7.title { font-size: 1.44em; }
h3, h4, h5, h6, h7 { font-size: 1em; }
p { line-height: 1.44em; }
div, pre, p { margin: 0; padding: 0; }
div.contents > * + *,
th > * + *, td > * + *,
dt > * + *, dd > * + *,
li > * + * { margin-top: 1em; }
p img { vertical-align: middle; }
p.lead { font-size: 1.2em; }
div.clear {
margin: 0; padding: 0;
height: 0; line-height: 0;
clear: both;
}
.center { text-align: center; }
footer { background: #ddd; }
footer div.about {
max-width: {{2 * $html.grid.size div 3 - 20}}px;
margin: 0 auto;
}
footer div.about > div.inner > div.hgroup {
margin: 0; padding: 0;
text-align: center;
border: none;
}
footer div.about > div.inner > div.hgroup > h2 {
margin: 0; padding: 0.2em;
font-size: inherit;
}
footer div.about.ui-expander > div.inner > div.hgroup span.title:before {
content: "";
}
div.copyrights { text-align: center; }
div.copyright { margin: 0; }
div.credits {
display: flex;
flex-flow: row wrap;
align-items: stretch;
justify-content: flex-start;
margin: 0 -10px;
}
div.credits > * {
vertical-align: top;
text-align: left;
flex: 1 0 {{$html.grid.size div 3 - 60}}px;
padding: 10px;
}
div.credits > *:empty { padding: 0; height: 0; }
ul.credits, ul.credits li {
margin: 0; padding: 0;
list-style-type: none;
}
ul.credits li {
margin-{{$left}}: 1em;
text-indent: -1em;
}
div.license {
padding-bottom: 10px;
}
table {
border-collapse: collapse;
border-color: {{$color.gray}};
border-width: 1px;
}
td, th {
padding: 0.5em;
vertical-align: top;
border-color: {{$color.gray}};
border-width: 1px;
}
thead td, thead th, tfoot td, tfoot th {
font-weight: bold;
color: {{$color.fg.dark}};
background-color: {{$color.bg.dark}};
}
th {
text-align: {{$left}};
font-weight: bold;
color: {{$color.fg.dark}};
}
ul, ol, dl { margin: 0; padding: 0; }
li {
margin: 1em 0 0 0;
margin-{{$left}}: 2.4em;
padding: 0;
}
li:first-child { margin-top: 0; }
@media (max-width: 480px) {
li {
margin-{{$left}}: 1.44em;
}
}
dt { margin-top: 1em; }
dt:first-child { margin-top: 0; }
dt + dt { margin-top: 0; }
dd {
margin: 0.2em 0 0 0;
margin-{{$left}}: 1.44em;
}
dd + dd { margin-top: 1em; }
ol.compact li { margin-top: 0.2em; }
ul.compact li { margin-top: 0.2em; }
ol.compact li:first-child { margin-top: 0; }
ul.compact li:first-child { margin-top: 0; }
dl.compact dt { margin-top: 0.2em; }
dl.compact dt:first-child { margin-top: 0; }
dl.compact dt + dt { margin-top: 0; }
div.tiles {
display: flex;
flex-flow: row wrap;
align-items: stretch;
justify-content: stretch;
vertical-align: top;
clear: both;
margin: 0 -10px;
}
div.tiles > * {
vertical-align: top;
margin: 0;
padding: 10px;
max-width: none;
}
div.tiles > *:empty { padding: 0 10px; height: 0; }
div.tile4 { flex: 1 0 {{$html.grid.size div 4 - 20}}px; }
div.tile3 { flex: 1 0 {{$html.grid.size div 3 - 20}}px; }
div.tile2 { flex: 1 0 {{$html.grid.size div 2 - 20}}px; }
div.tile1 { flex: 1 0 {{$html.grid.size - 20}}px; }
a {
text-decoration: none;
color: {{$color.fg.blue}};
}
a:visited { color: {{$color.fg.purple}}; }
a:hover {
border-bottom: dotted 1px {{$color.fg.blue}};
}
p a {
border-bottom: dotted 1px {{$color.fg.blue}};
}
a img { border: none; }
</tmpl>