X-Git-Url: https://juplo.de/gitweb/?p=website;a=blobdiff_plain;f=less%2Ftiny%2Flayout.less;fp=less%2Ftiny%2Flayout.less;h=dcef10ccbd267afaf1c15f3180fe77a69c0fe787;hp=0000000000000000000000000000000000000000;hb=3c6c6c0735bcccedf34fe5411d86777c3511f31a;hpb=7967465800f4235b769e7151d5986ca92fc2a0ff diff --git a/less/tiny/layout.less b/less/tiny/layout.less new file mode 100644 index 00000000..dcef10cc --- /dev/null +++ b/less/tiny/layout.less @@ -0,0 +1,78 @@ +body +{ + font-size: 75%; /** 12px */ +} +#header +{ + margin: .25em .5em 1em 1em; +} +#nav:target +{ + padding-left: 0.5em; + padding-right: 0.5em; +} +#breadcrumb, +#nav:target > a.hide +{ + top: .5em; + right: .5em; +} +.content > .main, +#footer +{ + margin: 0; + padding: 0 .5em; +} +.content > .marginal +{ + padding: 1em .5em 999em .5em; + margin-bottom: -991em; +} + +@media (max-width: 210px) +{ + #header + { + font-size: 75%; + } + #nav:target + { + padding-top: 0; + } + #breadcrumb, + #nav:target > a.hide + { + top: .1em; + right: .3em; + } + #breadcrumb > a.hide:before, + #nav:target > a.hide:before + { + font-size: 300%; /** Vielfaches von 12px */ + } +} +@media (max-width: 150px) +{ + #header + { + font-size: 50%; + } + #header > hr.h + { + display: block; + } + #slogan + { + display: none; + } + #breadcrumb, + #nav:target > a.hide + { + top: .2em; + } + #breadcrumb > a.hide:before, + #nav:target > a.hide:before + { + font-size: 264%; /** Vielfaches von 12px */ + } +}