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

Nothing special, progress

Browse source
This commit is contained in:
Yann Esposito (Yogsototh) 2011-06-28 17:12:22 +02:00
parent f8f5f8f92f
commit 06fcc9c6cb
13 changed files with 223 additions and 118 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -34,9 +34,9 @@ $('document').ready(function() {
<% end %>
<div id="mainlinks">
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable") %>
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure clickable") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy clickable") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable clickable") %>
</div>
<div class="flush"></div>
@ -65,6 +65,9 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<%= block("Get it!", "http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8","On the Apple Store") %>
<%= block("Get it!",
"http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8",
"On the Apple Store",
"clickable") %>
<div class="flush"></div>

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

@ -34,9 +34,9 @@ $('document').ready(function() {
<% end %>
<div id="mainlinks">
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable") %>
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure clickable") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy clickable") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable clickable") %>
</div>
<div class="flush"></div>
@ -65,6 +65,9 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<%= block("Get it!", "http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8","On the Apple Store") %>
<%= block("Get it!",
"http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8",
"On the Apple Store",
"clickable") %>
<div class="flush"></div>

11
multi/index.md
View file

@ -34,9 +34,9 @@ $('document').ready(function() {
<% end %>
<div id="mainlinks">
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable") %>
<%= block("Secure","javascript:return false;","SHA1 ensure strong password generation","left secure clickable") %>
<%= block("Easy","javascript:return false;","Remember only one master password", "left easy clickable") %>
<%= block("Portable","javascript:return false;","Dashboard widget, Javascript applet, etc...", "left portable clickable") %>
</div>
<div class="flush"></div>
@ -65,6 +65,9 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<%= block("Get it!", "http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8","On the Apple Store") %>
<%= block("Get it!",
"http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8",
"On the Apple Store",
"clickable") %>
<div class="flush"></div>

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

@ -70,7 +70,7 @@
<div class="content">
<div id="mainlinks">
<div class="block left secure">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
@ -82,7 +82,7 @@
</p>
</div>
</div>
<div class="block left easy">
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
@ -94,7 +94,7 @@
</p>
</div>
</div>
<div class="block left portable">
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
@ -134,7 +134,7 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<div class="block left">
<div class="block clickable">
<div class="inner">
<h3>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&amp;mt=8"> Get it!

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

@ -70,7 +70,7 @@
<div class="content">
<div id="mainlinks">
<div class="block left secure">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
@ -82,7 +82,7 @@
</p>
</div>
</div>
<div class="block left easy">
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
@ -94,7 +94,7 @@
</p>
</div>
</div>
<div class="block left portable">
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
@ -134,7 +134,7 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<div class="block left">
<div class="block clickable">
<div class="inner">
<h3>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&amp;mt=8"> Get it!

32
site/css/buttons.css
View file

@ -1,4 +1,4 @@
/* line 18, ../../../../compass/buttons.scss */
/* line 18, ../src/buttons.scss */
a.button {
display: inline;
float: left;
@ -17,7 +17,7 @@ a.button {
border-color: #eeeeee #dedede #dedede #eeeeee;
color: #565656;
}
/* line 75, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 75, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.button img {
margin: 0 3px -3px 0 !important;
padding: 0;
@ -26,20 +26,20 @@ a.button img {
height: 16px;
float: none;
}
/* line 62, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.button:hover {
background-color: #dff4ff;
border-color: #d2f1ff #c2e1ef #c2e1ef #d2f1ff;
color: #336699;
}
/* line 47, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 47, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.button:active {
background-color: #6299c5;
border-color: #72a9d5 #6299c5 #6299c5 #72a9d5;
color: white;
}
/* line 31, ../../../../compass/buttons.scss */
/* line 31, ../src/buttons.scss */
button {
display: inline;
float: left;
@ -60,7 +60,7 @@ button {
border-color: #eeeeee #dedede #dedede #eeeeee;
color: #565656;
}
/* line 75, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 75, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
button img {
margin: 0 3px -3px 0 !important;
padding: 0;
@ -69,56 +69,56 @@ button img {
height: 16px;
float: none;
}
/* line 95, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 95, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
button[type] {
padding: 4px 10px 4px 7px;
line-height: 17px;
}
/* line 98, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 98, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
*:first-child + html button[type] {
padding: 4px 10px 3px 7px;
}
/* line 62, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
button:hover {
background-color: #dff4ff;
border-color: #d2f1ff #c2e1ef #c2e1ef #d2f1ff;
color: #336699;
}
/* line 47, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 47, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
button:active {
background-color: #6299c5;
border-color: #72a9d5 #6299c5 #6299c5 #72a9d5;
color: white;
}
/* line 39, ../../../../compass/buttons.scss */
/* line 39, ../src/buttons.scss */
a.positive, button.positive {
color: #529214;
}
/* line 62, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.positive:hover, button.positive:hover {
background-color: #e6efc2;
border-color: #d6e890 #c6d880 #c6d880 #d6e890;
color: #529214;
}
/* line 47, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 47, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.positive:active, button.positive:active {
background-color: #529214;
border-color: #62a224 #529214 #529214 #62a224;
color: white;
}
/* line 44, ../../../../compass/buttons.scss */
/* line 44, ../src/buttons.scss */
a.negative, button.negative {
color: #d12f19;
}
/* line 62, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.negative:hover, button.negative:hover {
background-color: #fbe3e4;
border-color: #ffd2d4 #fbc2c4 #fbc2c4 #ffd2d4;
color: #d12f19;
}
/* line 47, /var/lib/gems/1.8/gems/compass-0.11.1/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
/* line 47, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
a.negative:active, button.negative:active {
background-color: #d12f19;
border-color: #e13f29 #d12f19 #d12f19 #e13f29;

155
site/css/main.css
View file

@ -1,38 +1,38 @@
/* line 32, ../src/main.sass */
/* line 33, ../src/main.sass */
body {
background: #b4b8c5;
background: #efeff4;
}
/* line 34, ../src/main.sass */
/* line 35, ../src/main.sass */
body.bp {
margin-top: 30px;
background: #b4b8c5;
background: #efeff4;
}
/* line 37, ../src/main.sass */
/* line 38, ../src/main.sass */
body.bp h1, body.bp h2, body.bp h3, body.bp h4, body.bp h5, body.bp h6 {
color: #60646c;
font-weight: bold;
letter-spacing: -0.05em;
text-shadow: #41444a -1px -1px 0px, #efeff4 0px 1px 0px;
}
/* line 42, ../src/main.sass */
/* line 43, ../src/main.sass */
body.bp h1 a:hover, body.bp h2 a:hover, body.bp h3 a:hover, body.bp h4 a:hover, body.bp h5 a:hover, body.bp h6 a:hover {
text-shadow: #41444a -1px -1px 0px, #efeff4 0px 1px 0px, rgba(51, 0, 255, 0.7) 0 0 1px;
text-shadow: #41444a -1px -1px 0px, #efeff4 0px 1px 0px, rgba(51, 136, 204, 0.5) 0 0 4px;
}
/* line 44, ../src/main.sass */
/* line 45, ../src/main.sass */
body.bp a {
text-decoration: none;
color: #60646c;
}
/* line 47, ../src/main.sass */
/* line 48, ../src/main.sass */
body.bp a:visited {
color: #60646c;
}
/* line 49, ../src/main.sass */
/* line 50, ../src/main.sass */
body.bp a:hover, body.bp a:active {
color: #2288cc;
color: #86adff;
}
/* line 53, ../src/main.sass */
/* line 54, ../src/main.sass */
* {
-moz-transition-property: all;
-webkit-transition-property: all;
@ -45,22 +45,27 @@ body.bp a:hover, body.bp a:active {
}
/* line 64, ../src/main.sass */
.clickable {
cursor: pointer;
}
/* line 68, ../src/main.sass */
#container {
width: 950px;
margin: 0 auto;
}
/* line 69, ../src/main.sass */
/* line 73, ../src/main.sass */
a {
text-decoration: none;
}
/* line 72, ../src/main.sass */
/* line 76, ../src/main.sass */
h1 {
text-align: center;
}
/* line 82, ../src/main.sass */
/* line 86, ../src/main.sass */
.block {
display: inline;
float: left;
@ -79,22 +84,22 @@ h1 {
-ms-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;
margin-right: 30px;
margin-right: 50px;
}
/* line 147, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_grid.scss */
* html .block {
overflow-x: hidden;
}
/* line 79, ../src/main.sass */
/* line 83, ../src/main.sass */
.block > * {
padding: 20px;
}
/* line 88, ../src/main.sass */
/* line 92, ../src/main.sass */
.block:hover {
background-color: rgba(0, 0, 0, 0.05);
}
/* line 103, ../src/main.sass */
/* line 122, ../src/main.sass */
#choixlang {
display: inline;
float: left;
@ -105,18 +110,19 @@ h1 {
* html #choixlang {
overflow-x: hidden;
}
/* line 105, ../src/main.sass */
/* line 124, ../src/main.sass */
#choixlang a {
width: 100%;
text-align: center;
text-size: 14px;
padding: 3px;
text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px, rgba(255, 255, 255, 0.5) 0px 1px 0px;
display: -moz-inline-box;
-moz-box-orient: vertical;
display: inline-block;
vertical-align: middle;
*vertical-align: auto;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
text-align: center;
display: inline;
float: left;
display: block;
margin: 0.7em 0.5em 0.7em 0;
border-width: 1px;
border-style: solid;
@ -126,19 +132,13 @@ h1 {
font-weight: bold;
text-decoration: none;
cursor: pointer;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
background-color: rgba(0, 0, 0, 0.2);
border-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.3) rgba(255, 255, 255, 0.5);
color: #c9cede;
}
/* line 7, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/compass/stylesheets/compass/css3/_inline-block.scss */
#choixlang a {
*display: inline;
width: auto;
overflow: visible;
padding: 4px 10px 3px 7px;
background-color: #e3e5ed;
border-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.3) rgba(255, 255, 255, 0.3);
color: #51555c;
width: 100%;
}
/* line 75, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
#choixlang a img {
@ -149,15 +149,43 @@ h1 {
height: 16px;
float: none;
}
/* line 99, ../src/main.sass */
/* line 95, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
#choixlang a[type] {
padding: 4px 10px 4px 7px;
line-height: 17px;
}
/* line 98, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
*:first-child + html #choixlang a[type] {
padding: 4px 10px 3px 7px;
}
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
#choixlang a:hover {
background-color: #dff4ff;
border-color: #d2f1ff #c2e1ef #c2e1ef #d2f1ff;
color: #336699;
}
/* line 62, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
#choixlang a:hover {
background-color: #d2d4dc;
border-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.3) rgba(255, 255, 255, 0.3);
color: #caf1ff;
}
/* line 47, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/blueprint/stylesheets/blueprint/_buttons.scss */
#choixlang a:active {
background-color: #d2d4dc;
border-color: rgba(0, 0, 0, 0.3) rgba(255, 255, 255, 0.3) rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.3);
color: #caf1ff;
}
/* line 117, ../src/main.sass */
#choixlang a:hover {
text-shadow: #3388cc 0 0 3px, rgba(0, 0, 0, 0.5) 0px -1px 0px, rgba(255, 255, 255, 0.5) 0px 1px 0px;
background-color: rgba(0, 0, 0, 0.3);
border-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.5) rgba(0, 0, 0, 0.5) rgba(255, 255, 255, 0.5);
color: #efeff4;
}
/* line 119, ../src/main.sass */
#choixlang a:active {
text-shadow: #33aaff 0 0 4px, rgba(0, 0, 0, 0.5) 0px -1px 0px, rgba(255, 255, 255, 0.5) 0px 1px 0px;
}
/* line 109, ../src/main.sass */
/* line 128, ../src/main.sass */
#mainlinks {
display: inline;
float: left;
@ -165,7 +193,7 @@ h1 {
margin: 0 -120px 1.5em 120px;
}
/* line 112, ../src/main.sass */
/* line 131, ../src/main.sass */
#choixrss {
text-align: right;
display: inline;
@ -186,12 +214,13 @@ h1 {
* html #choixrss {
overflow-x: hidden;
}
/* line 118, ../src/main.sass */
/* line 137, ../src/main.sass */
#choixrss a {
width: 100%;
text-align: center;
text-size: 14px;
padding: 3px;
padding: 4px;
height: 22px;
text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0px, rgba(255, 255, 255, 0.5) 0px 1px 0px;
display: -moz-inline-box;
-moz-box-orient: vertical;
@ -207,15 +236,15 @@ h1 {
font-weight: bold;
text-decoration: none;
cursor: pointer;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
-o-border-radius: 3px;
-ms-border-radius: 3px;
-khtml-border-radius: 3px;
border-radius: 3px;
-moz-border-radius: 22px;
-webkit-border-radius: 22px;
-o-border-radius: 22px;
-ms-border-radius: 22px;
-khtml-border-radius: 22px;
border-radius: 22px;
background-color: rgba(0, 0, 0, 0.2);
border-color: rgba(255, 255, 255, 0.5) rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.3) rgba(255, 255, 255, 0.5);
color: #c9cede;
color: #41444a;
}
/* line 7, ../../../../../../var/lib/gems/1.8/gems/compass-0.11.3/frameworks/compass/stylesheets/compass/css3/_inline-block.scss */
#choixrss a {
@ -230,7 +259,7 @@ h1 {
height: 16px;
float: none;
}
/* line 99, ../src/main.sass */
/* line 104, ../src/main.sass */
#choixrss a:hover {
text-shadow: #3388cc 0 0 3px, rgba(0, 0, 0, 0.5) 0px -1px 0px, rgba(255, 255, 255, 0.5) 0px 1px 0px;
background-color: rgba(0, 0, 0, 0.3);
@ -238,7 +267,7 @@ h1 {
color: #efeff4;
}
/* line 123, ../src/main.sass */
/* line 142, ../src/main.sass */
#mainnav ul {
padding-left: 0;
list-style-type: none;
@ -253,7 +282,7 @@ h1 {
* html #mainnav ul {
overflow-x: hidden;
}
/* line 129, ../src/main.sass */
/* line 148, ../src/main.sass */
#mainnav ul li {
display: inline;
float: left;
@ -264,14 +293,14 @@ h1 {
* html #mainnav ul li {
overflow-x: hidden;
}
/* line 131, ../src/main.sass */
/* line 150, ../src/main.sass */
#mainnav ul li * {
display: block;
text-align: center;
width: 100%;
}
/* line 135, ../src/main.sass */
/* line 154, ../src/main.sass */
footer {
display: inline;
float: left;
@ -284,7 +313,7 @@ footer {
overflow-x: hidden;
}
/* line 139, ../src/main.sass */
/* line 158, ../src/main.sass */
.flush {
clear: both;
}

BIN
site/img/buttons/cross.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 655 B

BIN
site/img/buttons/key.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 455 B

BIN
site/img/buttons/tick.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 537 B

15
site/index.html
View file

@ -34,11 +34,12 @@
<!--[if lt IE 8]>
<link href="/css/ie.css" media="screen, projection" rel="stylesheet" type="text/css" />
<![endif]-->
<!-- CSS: blueprint buttons -->
<link href="/css/buttons.css" media="screen, projection" rel="stylesheet" type="text/css" />
<!-- CSS: implied media="all" -->
<!-- Google Fonts -->
<link href='http://fonts.googleapis.com/css?family=Expletus+Sans:bold' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Kreon:regular,bold' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Molengo:regular,bold' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="/css/main.css">
<!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
@ -69,7 +70,7 @@
<div class="content">
<div id="mainlinks">
<div class="block left secure">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
@ -81,7 +82,7 @@
</p>
</div>
</div>
<div class="block left easy">
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
@ -93,7 +94,7 @@
</p>
</div>
</div>
<div class="block left portable">
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
@ -133,7 +134,7 @@ Your password is copied, you can paste it.
</div>
<div class="flush"></div>
<div class="block left">
<div class="block clickable">
<div class="inner">
<h3>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&amp;mt=8"> Get it!
@ -151,7 +152,7 @@ Your password is copied, you can paste it.
</div>
<footer>
<ul class="article_metadata">
<li>Modified: <time>05/14/2011</time></li>
<li>Modified: <time>05/16/2011</time></li>
<li><a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">Copyright ©, Yann Esposito</a></li>
</ul>
</footer>

47
site/src/buttons.scss Normal file
View file

@ -0,0 +1,47 @@
@import "compass/utilities/general/float";
@import "blueprint/buttons";
// Use the following HTML code to place the buttons on your site:
//
// <button type="submit" class="button positive">
// <img src="css/blueprint/plugins/buttons/icons/tick.png" alt=""/> Save
// </button>
//
// <a class="button" href="/password/reset/">
// <img src="css/blueprint/plugins/buttons/icons/key.png" alt=""/> Change Password
// </a>
//
// <a href="#" class="button negative">
// <img src="css/blueprint/plugins/buttons/icons/cross.png" alt=""/> Cancel
// </a>
a.button {
// you can pass "left" or "right" to +anchor-button to float it in that direction
// or you can pass no argument to leave it inline-block (cross browser safe!) within
// the flow of your page.
@include anchor-button(left);
// All the button color mixins take 4 optional arguments:
// font color, background color, border color, border highlight color
// the first three default to constants set in blueprint/buttons.sass
// the last one defaults to a shade lighter than the border color.
@include button-colors;
@include button-hover-colors;
@include button-active-colors; }
button {
// The +button-button mixin is just like the +anchor-button mixin, but for <button> elements.
@include button-button(left);
@include button-colors;
@include button-hover-colors;
@include button-active-colors; }
// We can change the colors for buttons of certain classes, etc.
a.positive, button.positive {
color: #529214;
@include button-hover-colors(#529214, #e6efc2, #c6d880);
@include button-active-colors(white, #529214, #529214); }
a.negative, button.negative {
color: #d12f19;
@include button-hover-colors(#d12f19, #fbe3e4, #fbc2c4);
@include button-active-colors(white, #d12f19, #d12f19); }

43
site/src/main.sass
View file

@ -21,11 +21,12 @@ $ycolor7: #303237
$ycolor8: #1F2024
$ycolor9: #0F1011
$higlightcolor: #28C
// $higlightcolor: #28C
$higlightcolor: $ycolor3 + #027
$higlightcolor-shadow: #058
$higlightcolor-reflect: #6AF
$main-background-color: $ycolor1
$main-background-color: $ycolorb
// Background colors
@ -40,7 +41,7 @@ body
letter-spacing: -0.05em
+text-shadow($ycolor6 -1px -1px 0px,$ycolorb 0px 1px 0px )
a:hover
+text-shadow($ycolor6 -1px -1px 0px ,$ycolorb 0px 1px 0px ,rgba(#30F,0.7) 0 0 1px )
+text-shadow($ycolor6 -1px -1px 0px ,$ycolorb 0px 1px 0px ,rgba(#38C,0.5) 0 0 4px )
a
text-decoration: none
color: $ycolor4
@ -53,13 +54,16 @@ body
*
+transition
=debugblock
+box-shadow(#FFF 0 0 3px, rgba(#000,0.2) 0 0 3px inset)
background: rgba(#EA6,0.08)
// =debugblock
// +box-shadow(#FFF 0 0 3px, rgba(#000,0.2) 0 0 3px inset)
// background: rgba(#EA6,0.08)
//
// *
// +debugblock
.clickable
cursor: pointer
// large container
#container
width: span(24)
@ -84,27 +88,42 @@ h1
+prepend-top(10px)
+append-bottom(20px)
+innerblock
margin-right: +span(1)
margin-right: span(1) + 2 * 10px
&:hover
background-color: rgba(#000,0.05)
=ybutton
text-align: center
text-size: 14px
padding: 3px
padding: 4px
height: 22px
+text-shadow(rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
+button-base
+border-radius(3px)
+button-colors($ycolor0, rgba(#000,0.2), rgba(#000,0.3), rgba(#FFF,0.5))
+border-radius(22px)
+button-colors($ycolor6, rgba(#000,0.2), rgba(#000,0.3), rgba(#FFF,0.5))
&:hover
+text-shadow(#38C 0 0 3px, rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
+button-colors($ycolorb, rgba(#000,0.3), rgba(#000,0.5), rgba(#FFF,0.5))
=button
+text-shadow(rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
+border-radius(3px)
text-align: center
+button-button(left)
+button-hover-colors
+button-colors($ycolor5, $ycolorc, rgba(#000,.3), rgba(#FFF,.3))
+button-hover-colors($higlightcolor + #446, $ycolorc - #111, rgba(#000,.3), rgba(#FFF,.3))
+button-active-colors($higlightcolor + #448, $ycolorc - #111, rgba(#FFF,.3), rgba(#000,.3))
&:hover
+text-shadow(#38C 0 0 3px, rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
&:active
+text-shadow(#3AF 0 0 4px, rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
#choixlang
+column(4)
a
+button
width: 100%
+ybutton
#mainlinks
+push(3)