new libertaires.css theme

root/cigala.php

@@ -218,13 +218,13 @@ function render ($file, $mode='edit', $entry_dt='NEW') {
       <img src="<?php echo ((strpos($settings['logo'], '//') === false) ? $relroot : ''),$settings['logo']; ?>" alt="" />
       <?php endif; ?>
       <h1><a href="<?php echo $title_url; ?>"><?php echo $title_body; ?></a></h1>
-      <menu>
-        <?php foreach ($menu as $p): ?>
-        <li<?php if ($p['file'] == $file) { echo ' class="current"'; } ?>>
+      <menu><?php
+      foreach ($menu as $p):
+      ?><li<?php if ($p['file'] == $file) { echo ' class="current"'; } ?>>
           <a href="<?php echo ($mode != 'publish') ? 'cigala.php?edit='.$p['file'] : (($p['status'] == 'lnk') ? ((strpos($p['content'], '//') === false) ? $relroot : '').$p['content'] : $relroot.preg_replace('/\/?index\.html$/', '/', $p['file'])); ?>"><?php echo $p['title']; ?></a>
-        </li>
-        <?php endforeach; ?>
-      </menu>
+        </li><?php
+      endforeach;
+      ?></menu>
     </div>
     <?php if ($mode == 'edit' && $page['status'] == 'lnk'): ?>
     <div id="main">

root/libertaires.css

@@ -10,21 +10,20 @@ body {
   margin: 0 auto;
   min-width: 250px;
   max-width: 1000px;
-  background-color: #000;
-  background: linear-gradient(10deg, #000 0%, #000 59%, #a00 61%, #a00 100%);
   box-shadow: 0 -0.3rem 0.3rem 0.2rem #aaa;
+  background-color: #111;
 }
 #head img {
   float: right;
   margin: 0.5rem 1rem;
-  max-height: 5rem;
+  height: 7rem;
 }
 #head h1 {
-  padding: 1rem 1.5rem;
-  color: #fff;
-  font-size: 2.2rem;
-  font-family: monospace;
-  text-shadow: 0.05rem 0.05rem 0.1rem rgba(255,255,255,0.7);
+  padding: 2.5rem 1rem;
+  font-size: 1.8rem;
+  line-height: 3rem;
+  text-shadow: 0.05rem 0.05rem 0.1rem #aaa;
+  color: #eee;
 }
 #head h1 a {
   text-decoration: none;
@@ -34,28 +33,26 @@ menu {
   clear: both;
   margin: 0 auto;
   list-style-type: none;
-  text-align: center;
-  border-bottom: 0.2rem solid #000;
+  text-align: left;
+  background-color: #c11;
 }
 menu li {
   display: inline-block;
 }
 menu li a {
-  color: #ddd;
+  color: #fff;
   font-weight: bold;
   font-size: 0.9rem;
-  font-variant: small-caps;
   text-decoration: none;
   display: block;
-  padding: 0.5rem;
-  border-top-left-radius: 0.3rem;
-  border-top-right-radius: 0.3rem;
+  padding: 0.5rem 0.71rem 0.2rem 0.71rem;
+  border-bottom: 0.3rem solid transparent;
 }
 menu li.current a {
-  border-bottom: 0.2rem solid #c00;
+  background-color: #a00;
 }
 menu li a:hover {
-  color: #fff;
+  border-bottom: 0.3rem solid #111;
 }
 #main {
   margin: 0 auto 1rem auto;
@@ -63,10 +60,9 @@ menu li a:hover {
   max-width: 1000px;
   padding: 1.5rem;
   line-height: 150%;
+  box-shadow: 0 0.2rem 0.3rem 0.2rem #aaa;
   box-sizing: border-box;
-  background-color: #000;
-  box-shadow: 0 0.3rem 0.3rem 0.2rem #aaa;
-  color: #eee;
+  background-color: #fff;
 }
 #main h2,
 #main h3,
@@ -74,14 +70,13 @@ menu li a:hover {
 #main h5,
 #main h6 {
   font-family: serif;
-  color: #c00;
+  color: #333;
   margin: 1.5rem 0 0.5rem 0;
 }
 #main h2 {
-  color: #fff;
   font-weight: bold;
   font-size: 1.4rem;
-  border-bottom: 1px solid #c00;
+  border-bottom: 2px solid #c11;
 }
 #main h2:first-of-type {
   margin-top: 0;
@@ -117,19 +112,24 @@ menu li a:hover {
   color: inherit;
 }
 #main p, #main ul, #main ol {
-  margin: 0.5rem 0 1rem 0;
+  margin: 0 0 1rem 0;
   line-height: 150%;
   text-align: justify;
 }
 #content > p:last-child, #content > ul:last-child, #content > ol:last-child {
   margin-bottom: 0;
 }
+article > div > p:last-child, article > div > ul:last-child, article > div > ol:last-child {
+  margin-bottom: 0 !important;
+}
+#main p + ul, #main p + ol {
+  margin-top: -0.5rem;
+}
 #main ul, #main ol {
-  margin-bottom: 1.5rem;
   margin-left: 2rem;
 }
 #main ul li, #main ol li {
-  margin-top: 0.25rem;
+  margin-top: 0.5rem;
 }
 #main ul li p, #main ol li p {
   margin-bottom: 0.5rem;
@@ -142,7 +142,7 @@ menu li a:hover {
 }
 #main hr {
   width: 80%;
-  margin: 1rem auto;
+  margin: 1rem auto 1.5rem auto;
   border: none;
   border-top: 1px solid #aaa;
   height: 0;
@@ -162,12 +162,12 @@ menu li a:hover {
 }
 #main a.nodec { text-decoration: none; }
 #main a {
-  color: #ddd;
-  text-decoration: underline solid #c00;
+  color: #c11;
+  text-decoration: underline solid #111;
 }
 #main a:hover {
-  color: #c00;
-  text-decoration-color: #c00;
+  color: #111;
+  text-decoration-color: #c11;
 }
 #main blockquote {
   border-left: 0.3rem solid #ccc;
@@ -176,17 +176,18 @@ menu li a:hover {
   font-family: serif;
   font-style: italic;
   text-align: justify;
-  color: #ddd;
+  color: #333;
 }
 #main p.info {
   font-style: italic;
+  margin: 1rem 0;
   color: #666;
 }
 #main article {
   clear: both;
-  background: #222;
+  background: #fafafa;
   border: 1px solid #aaa;
-  padding: 1rem 1rem 0 1rem;
+  padding: 1rem;
   margin-top: 1.5rem;
 }
 #main article header {
@@ -198,13 +199,12 @@ menu li a:hover {
   margin-bottom: 0;
 }
 #main article header time {
-  color: #aaa;
+  color: #666;
   font-size: 0.9rem;
   text-align: right;
 }
-@media (max-width: 600px) {
+@media (max-width: 500px) {
   menu li { display: block; }
-  menu li.current a { background-color: #c00; }
   #main img {
     max-width: 100%;
     height: auto;