Changeset 354:dd1476ad9a88

Timestamp:

06/12/11 09:45:05 (14 years ago)

Author:

kozlika

Branch:

themes

Message:

Ductile, jour 4, première passe.

Location:

themes/ductile

Files:

• img/__comment.png (deleted)
• img/_comment.png (deleted)
• img/dotted.png (deleted)
• img/download.png (added)
• img/home-small.png (modified) (previous)
• img/sticker-about.png (added)
• img/sticker-contact.png (added)
• img/sticker-feed.png (added)
• img/sticker-hover.png (added)
• mediaqueries.css (modified) (4 diffs)
• style.css (modified) (13 diffs)
• tpl/_footer.html (added)
• tpl/_head.html (added)
• tpl/_top.html (added)
• tpl/user_head.html (deleted)

themes/ductile/mediaqueries.css

@@ -23 +23 @@
           }
      h1 a {
-          display: block;
-          padding: 0 3%;
+          padding: 6px 3%;
           color: #fff;
           text-shadow: 0 1px 1px #333;
           }
      h1 a:hover, h1 a:focus {
-          background: #333;
+          background: #686867;
           }
-     #prelude {
+     #prelude, #blogdesc {
           display: none;
+          }
+     h2.post-title {
+          font-size: 2.5em;
+          }
+     #supranav li {
+          display: block !important;
+          }
+     #supranav li+li {
+          border-top: 1px solid #ddd;
+          }
+     #stickers {
+          margin: 0;
+          padding: 0;
+          border-bottom: 8px solid #fff;
+          }
+     #stickers li {
+          position: relative;
+          line-height: 2.5em;
+          margin-left: 0;
+          padding-left: 0;
+          border: 2px solid #fff;
+          border-left: 8px solid #fff;
+          border-right: 8px solid #fff;
+     }
+     #stickers img {
+          display: block;
+          position: absolute;
+          clip: rect(0px,32px,32px,0px);
+          }
+     #stickers span {
+          margin-left: 40px;
+          }
+     #stickers a {
+          text-decoration: none;
           }
 }
 
 @media only screen and (min-width: 481px) {
-     #page {
-          padding-top: 16px;
+     #top {
+          padding-top: 24px;
           }
      h1 {
-     font-size: 2.25em;
+          font-size: 2em;
+          padding-right: 200px;
           }
      h1 a, h1 a:hover, h1 a:focus {
           background-repeat: no-repeat;
-          background-position: left center;
+          background-position: left top;
           padding-left: 68px;
           background-image: url(img/home-small.png);
+          min-height: 42px;
           }
+     #stickers {
+          position: absolute;
+          top: 0;
+          right: 0;
+          padding-right: 10%;
+          }
+     #stickers li {
+          display: inline;
+          padding: 0 4px;
+          }
+     #stickers li.last {
+          padding-right: 0;
+          }
+     #stickers li span {
+          display: none;
+          }
+     h2.post-title {
+          font-size: 2.8em;
+          }
+     #stickers li a:hover,
+     #stickers li a:active,
+     #stickers li a:focus {
+          background-color: #fff;
+          border-bottom: 4px solid #ad3f4c;
+     }
 }
 
@@ -75 +135 @@
           margin-right: 4%;
      }
+     #stickers {
+          padding-right: 10%;
+          }
 }
 
@@ -103 +166 @@
           margin : 0;
           }
+     #stickers {
+          padding-right: 15%;
+          }
 }
 
@@ -124 +190 @@
           text-align: left;
           }
+     #stickers {
+          padding-right: 140px;
+          }
 }

themes/ductile/style.css

@@ -79 +79 @@
 ------------------------------------------------------------- */
 
+h1 {
+     font-variant: small-caps;
+     line-height: 1;
+     }
 h1 a {
      text-decoration: none;
+     display: inline-block;
      }
 #prelude {
@@ -96 +101 @@
      color: #666;
      }
+#blogdesc {
+     margin: -8px 0 0 68px;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
+     font-style: italic;
+     color: #909090;
+     }
+#supranav {
+     margin: 16px 0 0;
+     padding: 0;
+     list-style-type: none;
+     padding: 4px;
+     font-size: .875em;
+     text-align: center;
+     background-color: #f3f2e9;
+     border-top: 1px solid #eee;
+     border-bottom: 1px solid #eee;
+     }
+#supranav li {
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
+     text-transform: uppercase;
+     display: inline;
+     padding: 4px 1em;
+     }
+#supranav li a {
+     text-decoration: none;
+     padding: 4px 1em;
+     white-space: nowrap;
+     }
 
 /* ------------------------------------------------------------
@@ -111 +144 @@
      margin-top: 4em;
      font-size: .875em;
-     font-family: "helvetica neue", helvetica, sans-serif;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
      }
 #content-info h2 { 
@@ -118 +151 @@
 #subcategories {
      font-size: .875em;
-     font-family: "helvetica neue", helvetica, sans-serif;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
      }
 #subcategories h3 { 
@@ -153 +186 @@
 .pagination a {
      padding: 0 1em;
+     white-space: nowrap;
      }
 
@@ -170 +204 @@
      color: #909090;
      line-height: 1.17;
-     font-size: 3em;
      }
 h2.post-title a {
@@ -254 +287 @@
      background-image: url(img/attach.png);  
      }
+#attachments {
+     font-size: .875em;
+     border-bottom: 1px solid #999;
+     margin: 0 0 2em;
+     }
+#attachments h3 {
+     font-variant: small-caps;
+     font-weight: normal;
+     color: #666;
+     }
+#attachments ul {
+     list-style-type: none;
+     margin: 0 0 1em;
+     padding: 0;
+     }
+#attachments ul li {
+     padding-left: 24px;
+     background: #fff url(img/download.png) no-repeat;
+     }
 
 /* ------------------------------------------------------------
@@ -265 +317 @@
 #comments-feed { 
      color: #4c4c85;
-     font-family: "helvetica neue", helvetica, sans-serif;  
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
      font-size: .875em;
      }
@@ -351 +403 @@
      }
 .field textarea { 
-     font-family: "helvetica neue", helvetica, sans-serif;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
      font-size: .875em;
      padding: .5em 1em;  
@@ -491 +543 @@
 #search .submit:hover, 
 #search .submit:focus {
-     background: #333;
+     background: #686867;
      }
      
@@ -500 +552 @@
 #footer {
      clear: both;
-     background: #706f6f;
+     background: #686867;
      color: #fff;
      }
@@ -513 +565 @@
 #footer a:hover, 
 #footer a:focus {
-     background: #333;
+     background: #686867;
+     }
+#stickers {
+     list-style-type: none;
+     margin: 0;
      }
      
@@ -608 +664 @@
 .post, 
 .footnotes, 
-.attachments, 
+#attachments, 
 .post-info-co, 
 #comments, #footer {