Changeset 360:30bb82ca4426 for themes

Timestamp:

06/13/11 21:58:25 (14 years ago)

Author:

kozlika

Branch:

themes

Message:

Ductile, jour 4, ready.

Location:

themes/ductile

Files:

• mediaqueries.css (modified) (12 diffs)
• style.css (modified) (7 diffs)

themes/ductile/mediaqueries.css

@@ -4 +4 @@
 480px
 640px
-960px
+1024px
 1280px
 ----------------- */
@@ -76 +76 @@
           font-size: 2em;
           padding-right: 240px;
-          }
-     h1 a {
-          padding-left: 32px;
+          margin-left: 32px;
           }
 
@@ -91 +89 @@
      #supranav li a {
           display: inline-block;
-          padding: 8px 32px;
+          padding: 8px 32px 8px 28px;
           border-right: 1px solid #ccc;
           }
@@ -102 +100 @@
           top: 0;
           right: 0;
-          padding-right: 10%;
+          padding-right: 3%;
           }
      #stickers li {
@@ -130 +128 @@
           }
      #wrapper {
-          padding: 0 3%;
+          padding: 0 2%;
           }
      img {
@@ -139 +137 @@
 }
 
-@media only screen and (min-width: 640px) and (max-width: 960px) {
+@media only screen and (min-width: 640px) and (max-width: 1024px) {
      #wrapper {
           padding: 0 10%;
@@ -148 +146 @@
      #blognav {
           margin-right: 4%;
-     }
+          }
      #stickers {
           padding-right: 10%;
@@ -154 +152 @@
 }
 
-@media only screen and (min-width: 961px) {
+@media only screen and (min-width: 840px) and (max-width: 1024px) {
      #wrapper {
           padding: 0 13%;
+          }
+     #stickers {
+          padding-right: 13%;
+          }    
+}
+
+@media only screen and (min-width: 1025px) {
+     #wrapper {
+          padding: 0 32px;
           }
      #main {
           width : 100%;
-          margin : 0 -26% 0 0;
+          margin : 0 -22% 0 0;
           float : left;
           display: inline;
           }
      #content {
-          margin : 0 32% 0 0;
-          padding : 10px;
+          margin : 0 30% 0 0;
+          padding : 0 0 2em 0;
           }
      #footer {
@@ -173 +180 @@
           }
      #sidebar {
-          width : 26%;
+          width : 22%;
           float : right;
-          margin-top: 4.66em;
           }
      #blognav, #blogextra {
@@ -181 +187 @@
           }
      #stickers {
-          padding-right: 13%;
+          padding-right: 32px;
+          }
+
+     #sidebar #blognav div:first-child {
+          margin-top: 4.66em;
+          }
+     #sidebar div#search:first-child { 
+          background: none;
+          margin-top: 0;
+          margin-bottom: 2em;
+          padding-bottom: 2px;
+          font-size: 1em;
+          }
+     #sidebar div#search:first-child h2 {
+          font-size: 1em;
+          text-transform: uppercase;
+          text-shadow: 0 1px 1px rgba(0,0,0,.2);
+          vertical-align: top;
+          color: #666;
+          }
+     #sidebar div#search p {
+          margin: .33em 0;
           }
 }
@@ -187 +214 @@
 @media only screen and (min-width: 1280px) {
      #wrapper {
-          padding: 0 140px 0 340px;
+          padding: 0 96px 0 296px;
           }
      .dc-tags #wrapper, .dc-archive-month #wrapper, .dc-404 #wrapper {
-          padding: 0 15%;
+          padding: 0 96px;
           }
      p.post-info { 
@@ -205 +232 @@
           }
      #stickers {
-          padding-right: 140px;
-          }
-}
+          padding-right: 96px;
+          }
+}

themes/ductile/style.css

@@ -24 +24 @@
 Typo: #222 courant, #4c4c85 commentaires
 Liens: #666 courant, #ad3f4c titre billet et Lire la suite
-Titres: #909090
 Fond formulaire comm: #eef
 
@@ -117 +116 @@
      }
 #blogdesc {
-     margin: 0;
-     padding-left: 32px;
+     margin: 0 0 0 32px;
      font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
      font-style: italic;
@@ -125 +123 @@
      }
 #supranav {
-     padding: 0 0 0 2px;
+     padding: 0 0 0 4px;
      list-style-type: none;
      line-height: 1.25;
@@ -437 +435 @@
      }
 .field textarea { 
-     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
-     font-size: .875em;
+     font-family: sans-serif;
      padding: .5em 1em;  
      }
@@ -513 +510 @@
      }
 #sidebar h2 {
-     font-size: 1.2em;
+     font-size: 1.1em;
      margin: 0;
      font-weight: normal;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
+     color: #333;
      }
 #sidebar h3 {
-     font-size: 1.1em;
+     font-size: 1em;
      margin-bottom: 0;
      font-weight: normal;
+     font-family: "Franklin gothic medium","arial narrow","DejaVu Sans Condensed","helvetica neue",helvetica,sans-serif;
+     color: #333;
      }
 #sidebar ul {
@@ -567 +568 @@
      border: none;
      background: transparent;
-     height: 2em;
+     height: auto;
+     line-height: 2em;
      }
 #search #q {
      float: left;
      width: 78%;
+     font-size: 100%;
+     padding-left: 2px;
      }
 #search #q:focus {
@@ -582 +586 @@
      width: 20%;
      font-variant: small-caps;
+     height: 2em;
      }
 #search .submit:hover, 
 #search .submit:focus {
-     background: #686867;
+     background: #333;
      }