Add project page for picard plugins.

[homepage.git] / content / style.css

diff --git a/content/style.css b/content/style.css
index a8ff2c7bd71859d5c6a041bec9e5ecc32e8018e8..1028de0879fcd22d64689e3bcefbd6c966e159f3 100644 (file)
--- a/content/style.css
+++ b/content/style.css
@@ -44,7 +44,7 @@ a:visited {
     color: purple;
 }
 
-p {
+p, body>div {
     text-align: justify;
     padding: 0;
     margin: 1em 0;
@@ -59,21 +59,10 @@ ul, ol, dl {
 
 dt, dd, li {
     text-align: justify;
-    margin: 0 0 0 2em;
     padding: 0;
 }
-
-dl.terms>dt {
-    display: list-item;
-    font-weight: bold;
-    text-align: left;
-
-    float: left;
-}
-
-dt::after {
-    content: " ";
-}
+li { margin: 0 0 0 2em; }
+dd { margin: 0 0 0 1em; }
 
 ul.ordered>li {
     list-style: none;
@@ -88,9 +77,10 @@ ul.ordered>li>span:first-child, ul.ordered>li>*:first-child>span:first-child {
 }
 
 hr {
+    clear: both;
     text-align: left;
     margin: 0.5em 0;
-    width: 50em;
+    max-width: 50em;
     border: 0;
     border-top: 1px solid lightgray;
 }
@@ -124,6 +114,54 @@ small.permalink {
     margin: 0.2em 0;
 }
 
+kbd {
+    font-family: monospace;
+    font-size: small;
+}
+
+kbd::before {
+    content: "% ";
+}
+
+#breadcrumbs, #sitetitle { text-align: left; }
+#breadcrumbs>*, #sitetitle>* { font-size: 0.8em; }
+
+#sitetitle>* {
+    float: right;
+    display: inline-block;
+}
+
+#breadcrumbs>strong {
+    vertical-align: top;
+    margin: 0;
+    padding: 0;
+}
+
+#breadcrumbs>ul {
+    list-style-type: none;
+    vertical-align: top;
+    display: inline;
+    margin: 0;
+    padding: 0;
+}
+
+#breadcrumbs>ul>li {
+    display: inline;
+    padding: 0;
+    margin: 0;
+}
+
+#breadcrumbs>ul>li::before { content: "/ " }
+#breadcrumbs>ul>li:first-child::before { content: none; }
+
 @media (max-width: 512px) {
-    li, dd, dt, p, #footer>p { text-align: left; }
+    body { margin: 0.6em; }
+    ul ul { margin-left: -1.2em; }
+    dd { margin: 0; }
+}
+
+@media (max-width: 28em) { li, dd, dt, p { text-align: left; } }
+@media (max-width: 35em) {
+    #sitetitle>* { float: none; }
+    #footer { padding: 0 1em; }
 }