yogsototh/sharieswebsite
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Better footer and layout

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2011-07-11 12:14:02 +02:00
parent 65ab9119e9
commit 74d1f80c48
10 changed files with 92 additions and 50 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
content/html/en/index.md
View file

@ -26,6 +26,7 @@ menupriority: 1
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

1
content/html/fr/index.md
View file

@ -26,6 +26,7 @@ menupriority: 1
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

1
multi/index.md
View file

@ -26,6 +26,7 @@ menupriority: 1
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

2
site/Scratch/en/blog/index.html
View file

@ -167,7 +167,7 @@ Now you can paste it anywhere.</p>
</div> </div>
<footer> <footer>
<ul class="article_metadata"> <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> <li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Copyright ©, Yann Esposito</a></li>
</ul> </ul>
</footer> </footer>

1
site/Scratch/en/index.html
View file

@ -79,6 +79,7 @@
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

2
site/Scratch/fr/blog/index.html
View file

@ -153,7 +153,7 @@ Les 5 derniers articles
</div> </div>
<footer> <footer>
<ul class="article_metadata"> <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> <li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/deed.fr">Droits de reproduction ©, Yann Esposito</a></li>
</ul> </ul>
</footer> </footer>

1
site/Scratch/fr/index.html
View file

@ -79,6 +79,7 @@
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

115
site/css/main.css
View file

@ -80,7 +80,7 @@ hgroup#maintitle h2 {
font-size: 0.8em; font-size: 0.8em;
} }
/* line 79, ../src/main.sass */ /* line 82, ../src/main.sass */
#container > footer { #container > footer {
padding: 3em 0; padding: 3em 0;
color: #0f1011; color: #0f1011;
@ -92,42 +92,42 @@ hgroup#maintitle h2 {
background-image: -ms-linear-gradient(top, #60646c, #51555c); background-image: -ms-linear-gradient(top, #60646c, #51555c);
background-image: linear-gradient(top, #60646c, #51555c); background-image: linear-gradient(top, #60646c, #51555c);
} }
/* line 80, ../src/main.sass */ /* line 83, ../src/main.sass */
#container > footer * { #container > footer * {
width: 960px; width: 960px;
margin: 0 auto; margin: 0 auto;
} }
/* line 83, ../src/main.sass */ /* line 86, ../src/main.sass */
#container > footer a { #container > footer a {
color: #1f2024; color: #1f2024;
} }
/* line 85, ../src/main.sass */ /* line 88, ../src/main.sass */
#container > footer a:hover { #container > footer a:hover {
color: #002255; color: #002255;
} }
/* line 99, ../src/main.sass */ /* line 102, ../src/main.sass */
.clickable { .clickable {
cursor: pointer; cursor: pointer;
} }
/* line 103, ../src/main.sass */ /* line 106, ../src/main.sass */
#container { #container {
width: span(24); width: span(24);
margin: 0 auto; margin: 0 auto;
} }
/* line 108, ../src/main.sass */ /* line 111, ../src/main.sass */
a { a {
text-decoration: none; text-decoration: none;
} }
/* line 111, ../src/main.sass */ /* line 114, ../src/main.sass */
h1, h2 { h1, h2 {
text-align: center; text-align: center;
} }
/* line 121, ../src/main.sass */ /* line 124, ../src/main.sass */
.block { .block {
background-color: #e3e5ed; background-color: #e3e5ed;
-moz-box-shadow: white 0 0 3px, rgba(0, 0, 0, 0.2) 0 0 3px inset; -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; -khtml-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
} }
/* line 118, ../src/main.sass */ /* line 121, ../src/main.sass */
.block > * { .block > * {
margin: 20px; margin: 20px;
} }
/* line 123, ../src/main.sass */ /* line 126, ../src/main.sass */
.block:hover { .block:hover {
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
} }
/* line 167, ../src/main.sass */ /* line 170, ../src/main.sass */
#prelinks { #prelinks {
width: 960px; width: 960px;
margin: 0.5em auto; margin: 0.5em auto;
height: 1em; height: 1em;
} }
/* line 173, ../src/main.sass */ /* line 176, ../src/main.sass */
#choixlang { #choixlang {
float: left; float: left;
font-size: 14px; font-size: 14px;
} }
/* line 128, ../src/main.sass */ /* line 131, ../src/main.sass */
#choixlang a:hover { #choixlang a:hover {
color: #efeff4; color: #efeff4;
background-color: rgba(0, 0, 0, 0.3); 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; -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; 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 { #choixlang a:active {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black; text-shadow: 0 0 2px black;
} }
/* line 135, ../src/main.sass */ /* line 138, ../src/main.sass */
#choixlang a { #choixlang a {
color: #9ca1ad; color: #9ca1ad;
} }
/* line 137, ../src/main.sass */ /* line 140, ../src/main.sass */
#choixlang a, #choixlang span { #choixlang a, #choixlang span {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -193,11 +193,11 @@ h1, h2 {
width: 100%; width: 100%;
display: inline-block; display: inline-block;
} }
/* line 143, ../src/main.sass */ /* line 146, ../src/main.sass */
#choixlang a:hover, #choixlang span:hover { #choixlang a:hover, #choixlang span:hover {
color: #efeff4; color: #efeff4;
} }
/* line 145, ../src/main.sass */ /* line 148, ../src/main.sass */
#choixlang span { #choixlang span {
color: #efeff4; color: #efeff4;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3); 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; 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 { #choixrss {
float: right; float: right;
font-size: 14px; font-size: 14px;
} }
/* line 128, ../src/main.sass */ /* line 131, ../src/main.sass */
#choixrss a:hover { #choixrss a:hover {
color: #efeff4; color: #efeff4;
background-color: rgba(0, 0, 0, 0.3); 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; -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; 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 { #choixrss a:active {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black; text-shadow: 0 0 2px black;
} }
/* line 135, ../src/main.sass */ /* line 138, ../src/main.sass */
#choixrss a { #choixrss a {
color: #9ca1ad; color: #9ca1ad;
} }
/* line 137, ../src/main.sass */ /* line 140, ../src/main.sass */
#choixrss a, #choixrss span { #choixrss a, #choixrss span {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -244,11 +244,11 @@ h1, h2 {
width: 100%; width: 100%;
display: inline-block; display: inline-block;
} }
/* line 143, ../src/main.sass */ /* line 146, ../src/main.sass */
#choixrss a:hover, #choixrss span:hover { #choixrss a:hover, #choixrss span:hover {
color: #efeff4; color: #efeff4;
} }
/* line 145, ../src/main.sass */ /* line 148, ../src/main.sass */
#choixrss span { #choixrss span {
color: #efeff4; color: #efeff4;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3); 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; 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 { #mainnav {
width: 600px; width: 600px;
padding: 0; padding: 0;
margin: 2.5em auto; margin: 2.5em auto;
} }
/* line 186, ../src/main.sass */ /* line 189, ../src/main.sass */
#mainnav ul { #mainnav ul {
height: 2.2ex; height: 2.2ex;
padding: 0; padding: 0;
list-style-type: none; list-style-type: none;
} }
/* line 190, ../src/main.sass */ /* line 193, ../src/main.sass */
#mainnav ul li { #mainnav ul li {
text-align: center; text-align: center;
float: left; float: left;
@ -279,7 +279,7 @@ h1, h2 {
margin: 0 20px; margin: 0 20px;
font-size: 14px; font-size: 14px;
} }
/* line 128, ../src/main.sass */ /* line 131, ../src/main.sass */
#mainnav ul li a:hover { #mainnav ul li a:hover {
color: #efeff4; color: #efeff4;
background-color: rgba(0, 0, 0, 0.3); 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; -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; 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 { #mainnav ul li a:active {
background-color: rgba(0, 0, 0, 0.5); background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black; text-shadow: 0 0 2px black;
} }
/* line 135, ../src/main.sass */ /* line 138, ../src/main.sass */
#mainnav ul li a { #mainnav ul li a {
color: #9ca1ad; color: #9ca1ad;
} }
/* line 137, ../src/main.sass */ /* line 140, ../src/main.sass */
#mainnav ul li a, #mainnav ul li span { #mainnav ul li a, #mainnav ul li span {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -310,11 +310,11 @@ h1, h2 {
width: 100%; width: 100%;
display: inline-block; display: inline-block;
} }
/* line 143, ../src/main.sass */ /* line 146, ../src/main.sass */
#mainnav ul li a:hover, #mainnav ul li span:hover { #mainnav ul li a:hover, #mainnav ul li span:hover {
color: #efeff4; color: #efeff4;
} }
/* line 145, ../src/main.sass */ /* line 148, ../src/main.sass */
#mainnav ul li span { #mainnav ul li span {
color: #efeff4; color: #efeff4;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3), 0 1px 0 rgba(255, 255, 255, 0.3); 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; -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; 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 * { #mainnav ul li * {
font-size: 1.5em; font-size: 1.5em;
} }
/* line 200, ../src/main.sass */ /* line 203, ../src/main.sass */
.flush { .flush {
clear: both !important; clear: both !important;
} }
/* line 203, ../src/main.sass */ /* line 206, ../src/main.sass */
.clean { .clean {
background: none; background: none;
border: none; border: none;
margin: none; margin: none;
} }
/* line 208, ../src/main.sass */ /* line 211, ../src/main.sass */
#main { #main {
width: 960px; width: 960px;
margin: 0 auto; margin: 0 auto;
} }
/* line 212, ../src/main.sass */ /* line 215, ../src/main.sass */
body.std #main > article, .slideshow { body.std #main > article, .slideshow {
padding: 3em; padding: 3em;
margin: 3em 0; margin: 3em 0;
@ -363,34 +363,55 @@ body.std #main > article, .slideshow {
-khtml-border-radius: 5px; -khtml-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
} }
/* line 118, ../src/main.sass */ /* line 121, ../src/main.sass */
body.std #main > article > *, .slideshow > * { body.std #main > article > *, .slideshow > * {
margin: 20px; margin: 20px;
} }
/* line 217, ../src/main.sass */ /* line 220, ../src/main.sass */
.slideshow { .slideshow {
color: #60646c; color: #60646c;
font-size: 1.3em; font-size: 1.3em;
} }
/* line 220, ../src/main.sass */ /* line 223, ../src/main.sass */
.slideshow img, .slideshow h3, .slideshow p, .slideshow ul { .slideshow h3, .slideshow p, .slideshow ul {
float: left; float: left;
margin-left: 60px; margin-left: 60px;
} }
/* line 223, ../src/main.sass */ /* line 226, ../src/main.sass */
.slideshow h3, .slideshow p, .slideshow ul { .slideshow h3, .slideshow p, .slideshow ul {
width: 40%; width: 40%;
} }
/* line 225, ../src/main.sass */ /* line 228, ../src/main.sass */
.slideshow h3 { .slideshow h3 {
font-size: 2em; font-size: 2em;
color: #9ca1ad; color: #9ca1ad;
text-shadow: 0 0 3px white; text-shadow: 0 0 3px white;
} }
/* line 230, ../src/main.sass */ /* line 233, ../src/main.sass */
.center { .center {
margin: 0 auto; margin: 0 auto;
text-align: center; 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;
}

1
site/index.html
View file

@ -79,6 +79,7 @@
</div> </div>
<div id="portable" class="slideshow"> <div id="portable" class="slideshow">
<h3>Portable</h3>
<p>You can use YPassword on: </p> <p>You can use YPassword on: </p>
<ul> <ul>
<li> iPhone, </li> <li> iPhone, </li>

17
site/src/main.sass
View file

@ -76,6 +76,9 @@ hgroup#maintitle
+box-shadow(rgba(#000,.6) 0 0 15px inset) +box-shadow(rgba(#000,.6) 0 0 15px inset)
+linear-gradient(color-stops($ycolor4,$ycolor5)) +linear-gradient(color-stops($ycolor4,$ycolor5))
footer
clear:both
#container>footer #container>footer
* *
width: $stdWidth width: $stdWidth
@ -217,7 +220,7 @@ body.std #main > article, .slideshow
.slideshow .slideshow
color: $ycolor4 color: $ycolor4
font-size: 1.3em font-size: 1.3em
img,h3,p,ul h3,p,ul
float: left float: left
margin-left: 60px margin-left: 60px
h3,p,ul h3,p,ul
@ -230,3 +233,15 @@ body.std #main > article, .slideshow
.center .center
margin: 0 auto margin: 0 auto
text-align: center text-align: center
.leftimage
float: left
.rightimage
float: right
ul.article_metadata
list-style-type: none
text-align: right
color: $ycolor1
a
color: $ycolor2