Better footer and layout
This commit is contained in:
Yann Esposito (Yogsototh)
parent
65ab9119e9
commit
74d1f80c48
10 changed files with 92 additions and 50 deletions
|
|
@ -26,6 +26,7 @@ menupriority: 1
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@ menupriority: 1
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@ menupriority: 1
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -167,7 +167,7 @@ Now you can paste it anywhere.</p>
|
|||
</div>
|
||||
<footer>
|
||||
<ul class="article_metadata">
|
||||
<li>Modified: <time>05/14/2011</time></li>
|
||||
<li>Modified: <time>07/11/2011</time></li>
|
||||
<li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Copyright ©, Yann Esposito</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
|
|
|
|||
|
|
@ -79,6 +79,7 @@
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -153,7 +153,7 @@ Les 5 derniers articles
|
|||
</div>
|
||||
<footer>
|
||||
<ul class="article_metadata">
|
||||
<li>modifié le : <time>14/05/2011</time></li>
|
||||
<li>modifié le : <time>11/07/2011</time></li>
|
||||
<li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.fr">Droits de reproduction ©, Yann Esposito</a></li>
|
||||
</ul>
|
||||
</footer>
|
||||
|
|
|
|||
|
|
@ -79,6 +79,7 @@
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -80,7 +80,7 @@ hgroup#maintitle h2 {
|
|||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
/* line 79, ../src/main.sass */
|
||||
/* line 82, ../src/main.sass */
|
||||
#container > footer {
|
||||
padding: 3em 0;
|
||||
color: #0f1011;
|
||||
|
|
@ -92,42 +92,42 @@ hgroup#maintitle h2 {
|
|||
background-image: -ms-linear-gradient(top, #60646c, #51555c);
|
||||
background-image: linear-gradient(top, #60646c, #51555c);
|
||||
}
|
||||
/* line 80, ../src/main.sass */
|
||||
/* line 83, ../src/main.sass */
|
||||
#container > footer * {
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
/* line 83, ../src/main.sass */
|
||||
/* line 86, ../src/main.sass */
|
||||
#container > footer a {
|
||||
color: #1f2024;
|
||||
}
|
||||
/* line 85, ../src/main.sass */
|
||||
/* line 88, ../src/main.sass */
|
||||
#container > footer a:hover {
|
||||
color: #002255;
|
||||
}
|
||||
|
||||
/* line 99, ../src/main.sass */
|
||||
/* line 102, ../src/main.sass */
|
||||
.clickable {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* line 103, ../src/main.sass */
|
||||
/* line 106, ../src/main.sass */
|
||||
#container {
|
||||
width: span(24);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* line 108, ../src/main.sass */
|
||||
/* line 111, ../src/main.sass */
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/* line 111, ../src/main.sass */
|
||||
/* line 114, ../src/main.sass */
|
||||
h1, h2 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* line 121, ../src/main.sass */
|
||||
/* line 124, ../src/main.sass */
|
||||
.block {
|
||||
background-color: #e3e5ed;
|
||||
-moz-box-shadow: white 0 0 3px, rgba(0, 0, 0, 0.2) 0 0 3px inset;
|
||||
|
|
@ -141,28 +141,28 @@ h1, h2 {
|
|||
-khtml-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
/* line 118, ../src/main.sass */
|
||||
/* line 121, ../src/main.sass */
|
||||
.block > * {
|
||||
margin: 20px;
|
||||
}
|
||||
/* line 123, ../src/main.sass */
|
||||
/* line 126, ../src/main.sass */
|
||||
.block:hover {
|
||||
background-color: rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
/* line 167, ../src/main.sass */
|
||||
/* line 170, ../src/main.sass */
|
||||
#prelinks {
|
||||
width: 960px;
|
||||
margin: 0.5em auto;
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
/* line 173, ../src/main.sass */
|
||||
/* line 176, ../src/main.sass */
|
||||
#choixlang {
|
||||
float: left;
|
||||
font-size: 14px;
|
||||
}
|
||||
/* line 128, ../src/main.sass */
|
||||
/* line 131, ../src/main.sass */
|
||||
#choixlang a:hover {
|
||||
color: #efeff4;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
|
|
@ -171,16 +171,16 @@ h1, h2 {
|
|||
-o-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
/* line 132, ../src/main.sass */
|
||||
/* line 135, ../src/main.sass */
|
||||
#choixlang a:active {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-shadow: 0 0 2px black;
|
||||
}
|
||||
/* line 135, ../src/main.sass */
|
||||
/* line 138, ../src/main.sass */
|
||||
#choixlang a {
|
||||
color: #9ca1ad;
|
||||
}
|
||||
/* line 137, ../src/main.sass */
|
||||
/* line 140, ../src/main.sass */
|
||||
#choixlang a, #choixlang span {
|
||||
padding: 0.2em;
|
||||
-moz-border-radius: 2ex;
|
||||
|
|
@ -193,11 +193,11 @@ h1, h2 {
|
|||
width: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
/* line 143, ../src/main.sass */
|
||||
/* line 146, ../src/main.sass */
|
||||
#choixlang a:hover, #choixlang span:hover {
|
||||
color: #efeff4;
|
||||
}
|
||||
/* line 145, ../src/main.sass */
|
||||
/* line 148, ../src/main.sass */
|
||||
#choixlang span {
|
||||
color: #efeff4;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3);
|
||||
|
|
@ -208,12 +208,12 @@ h1, h2 {
|
|||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
|
||||
/* line 177, ../src/main.sass */
|
||||
/* line 180, ../src/main.sass */
|
||||
#choixrss {
|
||||
float: right;
|
||||
font-size: 14px;
|
||||
}
|
||||
/* line 128, ../src/main.sass */
|
||||
/* line 131, ../src/main.sass */
|
||||
#choixrss a:hover {
|
||||
color: #efeff4;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
|
|
@ -222,16 +222,16 @@ h1, h2 {
|
|||
-o-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
/* line 132, ../src/main.sass */
|
||||
/* line 135, ../src/main.sass */
|
||||
#choixrss a:active {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-shadow: 0 0 2px black;
|
||||
}
|
||||
/* line 135, ../src/main.sass */
|
||||
/* line 138, ../src/main.sass */
|
||||
#choixrss a {
|
||||
color: #9ca1ad;
|
||||
}
|
||||
/* line 137, ../src/main.sass */
|
||||
/* line 140, ../src/main.sass */
|
||||
#choixrss a, #choixrss span {
|
||||
padding: 0.2em;
|
||||
-moz-border-radius: 2ex;
|
||||
|
|
@ -244,11 +244,11 @@ h1, h2 {
|
|||
width: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
/* line 143, ../src/main.sass */
|
||||
/* line 146, ../src/main.sass */
|
||||
#choixrss a:hover, #choixrss span:hover {
|
||||
color: #efeff4;
|
||||
}
|
||||
/* line 145, ../src/main.sass */
|
||||
/* line 148, ../src/main.sass */
|
||||
#choixrss span {
|
||||
color: #efeff4;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3);
|
||||
|
|
@ -259,19 +259,19 @@ h1, h2 {
|
|||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
|
||||
/* line 182, ../src/main.sass */
|
||||
/* line 185, ../src/main.sass */
|
||||
#mainnav {
|
||||
width: 600px;
|
||||
padding: 0;
|
||||
margin: 2.5em auto;
|
||||
}
|
||||
/* line 186, ../src/main.sass */
|
||||
/* line 189, ../src/main.sass */
|
||||
#mainnav ul {
|
||||
height: 2.2ex;
|
||||
padding: 0;
|
||||
list-style-type: none;
|
||||
}
|
||||
/* line 190, ../src/main.sass */
|
||||
/* line 193, ../src/main.sass */
|
||||
#mainnav ul li {
|
||||
text-align: center;
|
||||
float: left;
|
||||
|
|
@ -279,7 +279,7 @@ h1, h2 {
|
|||
margin: 0 20px;
|
||||
font-size: 14px;
|
||||
}
|
||||
/* line 128, ../src/main.sass */
|
||||
/* line 131, ../src/main.sass */
|
||||
#mainnav ul li a:hover {
|
||||
color: #efeff4;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
|
|
@ -288,16 +288,16 @@ h1, h2 {
|
|||
-o-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
/* line 132, ../src/main.sass */
|
||||
/* line 135, ../src/main.sass */
|
||||
#mainnav ul li a:active {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
text-shadow: 0 0 2px black;
|
||||
}
|
||||
/* line 135, ../src/main.sass */
|
||||
/* line 138, ../src/main.sass */
|
||||
#mainnav ul li a {
|
||||
color: #9ca1ad;
|
||||
}
|
||||
/* line 137, ../src/main.sass */
|
||||
/* line 140, ../src/main.sass */
|
||||
#mainnav ul li a, #mainnav ul li span {
|
||||
padding: 0.2em;
|
||||
-moz-border-radius: 2ex;
|
||||
|
|
@ -310,11 +310,11 @@ h1, h2 {
|
|||
width: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
/* line 143, ../src/main.sass */
|
||||
/* line 146, ../src/main.sass */
|
||||
#mainnav ul li a:hover, #mainnav ul li span:hover {
|
||||
color: #efeff4;
|
||||
}
|
||||
/* line 145, ../src/main.sass */
|
||||
/* line 148, ../src/main.sass */
|
||||
#mainnav ul li span {
|
||||
color: #efeff4;
|
||||
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3);
|
||||
|
|
@ -324,30 +324,30 @@ h1, h2 {
|
|||
-o-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
|
||||
}
|
||||
/* line 196, ../src/main.sass */
|
||||
/* line 199, ../src/main.sass */
|
||||
#mainnav ul li * {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
/* line 200, ../src/main.sass */
|
||||
/* line 203, ../src/main.sass */
|
||||
.flush {
|
||||
clear: both !important;
|
||||
}
|
||||
|
||||
/* line 203, ../src/main.sass */
|
||||
/* line 206, ../src/main.sass */
|
||||
.clean {
|
||||
background: none;
|
||||
border: none;
|
||||
margin: none;
|
||||
}
|
||||
|
||||
/* line 208, ../src/main.sass */
|
||||
/* line 211, ../src/main.sass */
|
||||
#main {
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* line 212, ../src/main.sass */
|
||||
/* line 215, ../src/main.sass */
|
||||
body.std #main > article, .slideshow {
|
||||
padding: 3em;
|
||||
margin: 3em 0;
|
||||
|
|
@ -363,34 +363,55 @@ body.std #main > article, .slideshow {
|
|||
-khtml-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
/* line 118, ../src/main.sass */
|
||||
/* line 121, ../src/main.sass */
|
||||
body.std #main > article > *, .slideshow > * {
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
/* line 217, ../src/main.sass */
|
||||
/* line 220, ../src/main.sass */
|
||||
.slideshow {
|
||||
color: #60646c;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
/* line 220, ../src/main.sass */
|
||||
.slideshow img, .slideshow h3, .slideshow p, .slideshow ul {
|
||||
/* line 223, ../src/main.sass */
|
||||
.slideshow h3, .slideshow p, .slideshow ul {
|
||||
float: left;
|
||||
margin-left: 60px;
|
||||
}
|
||||
/* line 223, ../src/main.sass */
|
||||
/* line 226, ../src/main.sass */
|
||||
.slideshow h3, .slideshow p, .slideshow ul {
|
||||
width: 40%;
|
||||
}
|
||||
/* line 225, ../src/main.sass */
|
||||
/* line 228, ../src/main.sass */
|
||||
.slideshow h3 {
|
||||
font-size: 2em;
|
||||
color: #9ca1ad;
|
||||
text-shadow: 0 0 3px white;
|
||||
}
|
||||
|
||||
/* line 230, ../src/main.sass */
|
||||
/* line 233, ../src/main.sass */
|
||||
.center {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* line 237, ../src/main.sass */
|
||||
.leftimage {
|
||||
float: left;
|
||||
}
|
||||
|
||||
/* line 239, ../src/main.sass */
|
||||
.rightimage {
|
||||
float: right;
|
||||
}
|
||||
|
||||
/* line 242, ../src/main.sass */
|
||||
ul.article_metadata {
|
||||
list-style-type: none;
|
||||
text-align: right;
|
||||
color: #b4b8c5;
|
||||
}
|
||||
/* line 246, ../src/main.sass */
|
||||
ul.article_metadata a {
|
||||
color: #9ca1ad;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -79,6 +79,7 @@
|
|||
</div>
|
||||
|
||||
<div id="portable" class="slideshow">
|
||||
<h3>Portable</h3>
|
||||
<p>You can use YPassword on: </p>
|
||||
<ul>
|
||||
<li> iPhone, </li>
|
||||
|
|
|
|||
|
|
@ -76,6 +76,9 @@ hgroup#maintitle
|
|||
+box-shadow(rgba(#000,.6) 0 0 15px inset)
|
||||
+linear-gradient(color-stops($ycolor4,$ycolor5))
|
||||
|
||||
footer
|
||||
clear:both
|
||||
|
||||
#container>footer
|
||||
*
|
||||
width: $stdWidth
|
||||
|
|
@ -217,7 +220,7 @@ body.std #main > article, .slideshow
|
|||
.slideshow
|
||||
color: $ycolor4
|
||||
font-size: 1.3em
|
||||
img,h3,p,ul
|
||||
h3,p,ul
|
||||
float: left
|
||||
margin-left: 60px
|
||||
h3,p,ul
|
||||
|
|
@ -230,3 +233,15 @@ body.std #main > article, .slideshow
|
|||
.center
|
||||
margin: 0 auto
|
||||
text-align: center
|
||||
|
||||
.leftimage
|
||||
float: left
|
||||
.rightimage
|
||||
float: right
|
||||
|
||||
ul.article_metadata
|
||||
list-style-type: none
|
||||
text-align: right
|
||||
color: $ycolor1
|
||||
a
|
||||
color: $ycolor2
|
||||
|
|
|
|||
Loading…
Reference in a new issue