Simplification

This commit is contained in:
Yann Esposito (Yogsototh) 2011-07-09 23:06:45 +02:00
parent e3c69ffb9a
commit 23d5c0a58e
8 changed files with 128 additions and 387 deletions

View file

@ -3,44 +3,10 @@ title: YPassword
noSubMenu: true noSubMenu: true
menupriority: 1 menupriority: 1
----- -----
<% content_for :js do %>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<% end %>
<% content_for :title do %> <% content_for :title do %>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a> <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a>
<% end %> <% end %>
<div id="mainlinks">
<%= 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>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/>

View file

@ -3,44 +3,10 @@ title: YPassword
noSubMenu: true noSubMenu: true
menupriority: 1 menupriority: 1
----- -----
<% content_for :js do %>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<% end %>
<% content_for :title do %> <% content_for :title do %>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a> <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a>
<% end %> <% end %>
<div id="mainlinks">
<%= 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>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/>

View file

@ -3,44 +3,10 @@ title: YPassword
noSubMenu: true noSubMenu: true
menupriority: 1 menupriority: 1
----- -----
<% content_for :js do %>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<% end %>
<% content_for :title do %> <% content_for :title do %>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a> <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a>
<% end %> <% end %>
<div id="mainlinks">
<%= 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>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;"/>

View file

@ -61,47 +61,6 @@
<article> <article>
<div class="content"> <div class="content">
<div id="mainlinks">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
<span class="nicer">»</span>
</a>
</h3>
<p>
SHA1 ensure strong password generation
</p>
</div>
</div>
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
<span class="nicer">»</span>
</a>
</h3>
<p>
Remember only one master password
</p>
</div>
</div>
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
<span class="nicer">»</span>
</a>
</h3>
<p>
Dashboard widget, Javascript applet, etc...
</p>
</div>
</div>
</div>
<div class="flush"></div>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" /> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" />
@ -171,30 +130,6 @@ Your password is copied, you can paste it.
<script src="/js/plugins.js"></script> <script src="/js/plugins.js"></script>
<script src="/js/script.js"></script> <script src="/js/script.js"></script>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<!-- end scripts--> <!-- end scripts-->
<!--[if lt IE 7 ]> <!--[if lt IE 7 ]>
<script src="/js/libs/dd_belatedpng.js"></script> <script src="/js/libs/dd_belatedpng.js"></script>

View file

@ -61,47 +61,6 @@
<article> <article>
<div class="content"> <div class="content">
<div id="mainlinks">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
<span class="nicer">»</span>
</a>
</h3>
<p>
SHA1 ensure strong password generation
</p>
</div>
</div>
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
<span class="nicer">»</span>
</a>
</h3>
<p>
Remember only one master password
</p>
</div>
</div>
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
<span class="nicer">»</span>
</a>
</h3>
<p>
Dashboard widget, Javascript applet, etc...
</p>
</div>
</div>
</div>
<div class="flush"></div>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" /> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" />
@ -171,30 +130,6 @@ Your password is copied, you can paste it.
<script src="/js/plugins.js"></script> <script src="/js/plugins.js"></script>
<script src="/js/script.js"></script> <script src="/js/script.js"></script>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<!-- end scripts--> <!-- end scripts-->
<!--[if lt IE 7 ]> <!--[if lt IE 7 ]>
<script src="/js/libs/dd_belatedpng.js"></script> <script src="/js/libs/dd_belatedpng.js"></script>

View file

@ -1,51 +1,46 @@
/* line 31, ../src/main.sass */ /* line 33, ../src/main.sass */
body { body {
margin: 0; margin: 0;
font-family: Futura, Molengo; font-family: Futura, Molengo, sans-serif;
background: #efeff4;
}
/* line 35, ../src/main.sass */
body.bp {
background: #efeff4; background: #efeff4;
} }
/* line 37, ../src/main.sass */ /* line 37, ../src/main.sass */
body.bp {
background: #efeff4;
}
/* line 39, ../src/main.sass */
body.bp h1, body.bp h2, body.bp h3, body.bp h4, body.bp h5, body.bp h6 { body.bp h1, body.bp h2, body.bp h3, body.bp h4, body.bp h5, body.bp h6 {
color: #60646c; color: #60646c;
font-weight: bold; font-weight: bold;
letter-spacing: -0.05em; 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, body.bp h2 a, body.bp h3 a, body.bp h4 a, body.bp h5 a, body.bp h6 a { body.bp h1 a, body.bp h2 a, body.bp h3 a, body.bp h4 a, body.bp h5 a, body.bp h6 a {
color: #9ca1ad; color: #9ca1ad;
} }
/* line 44, ../src/main.sass */ /* line 45, ../src/main.sass */
body.bp h1 a:visited, body.bp h2 a:visited, body.bp h3 a:visited, body.bp h4 a:visited, body.bp h5 a:visited, body.bp h6 a:visited { body.bp h1 a:visited, body.bp h2 a:visited, body.bp h3 a:visited, body.bp h4 a:visited, body.bp h5 a:visited, body.bp h6 a:visited {
color: #9ca1ad; color: #9ca1ad;
} }
/* line 46, ../src/main.sass */ /* line 47, ../src/main.sass */
body.bp h1 a:hover, body.bp h1 a:active, body.bp h2 a:hover, body.bp h2 a:active, body.bp h3 a:hover, body.bp h3 a:active, body.bp h4 a:hover, body.bp h4 a:active, body.bp h5 a:hover, body.bp h5 a:active, body.bp h6 a:hover, body.bp h6 a:active { body.bp h1 a:hover, body.bp h1 a:active, body.bp h2 a:hover, body.bp h2 a:active, body.bp h3 a:hover, body.bp h3 a:active, body.bp h4 a:hover, body.bp h4 a:active, body.bp h5 a:hover, body.bp h5 a:active, body.bp h6 a:hover, body.bp h6 a:active {
color: #86adff; color: #86adeb;
} }
/* line 48, ../src/main.sass */ /* line 49, ../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, 136, 204, 0.5) 0 0 4px;
}
/* line 50, ../src/main.sass */
body.bp a { body.bp a {
text-decoration: none; text-decoration: none;
color: #60646c; color: #60646c;
} }
/* line 53, ../src/main.sass */ /* line 52, ../src/main.sass */
body.bp a:visited { body.bp a:visited {
color: #60646c; color: #60646c;
} }
/* line 55, ../src/main.sass */ /* line 54, ../src/main.sass */
body.bp a:hover, body.bp a:active { body.bp a:hover, body.bp a:active {
color: #86adff; color: #86adeb;
} }
/* line 59, ../src/main.sass */ /* line 58, ../src/main.sass */
* { * {
-moz-transition-property: all; -moz-transition-property: all;
-webkit-transition-property: all; -webkit-transition-property: all;
@ -57,7 +52,7 @@ body.bp a:hover, body.bp a:active {
transition-duration: 0.5s; transition-duration: 0.5s;
} }
/* line 62, ../src/main.sass */ /* line 61, ../src/main.sass */
hgroup#maintitle { hgroup#maintitle {
margin: 0.5em 0; margin: 0.5em 0;
font-size: 2em; font-size: 2em;
@ -73,34 +68,39 @@ hgroup#maintitle {
background-image: -o-linear-gradient(top, #60646c, #51555c); background-image: -o-linear-gradient(top, #60646c, #51555c);
background-image: linear-gradient(top, #60646c, #51555c); background-image: linear-gradient(top, #60646c, #51555c);
} }
/* line 66, ../src/main.sass */ /* line 65, ../src/main.sass */
hgroup#maintitle h1, hgroup#maintitle h1 a, hgroup#maintitle h2, hgroup#maintitle h2 a { hgroup#maintitle h1, hgroup#maintitle h1 a, hgroup#maintitle h2, hgroup#maintitle h2 a {
font-weight: normal;
color: #0f1011; color: #0f1011;
text-shadow: 0 0 2px rgba(239, 239, 244, 0.5); text-shadow: 0 0 2px rgba(239, 239, 244, 0.5);
} }
/* line 69, ../src/main.sass */
hgroup#maintitle h1 a:hover, hgroup#maintitle h2 a:hover {
color: #002255;
}
/* line 82, ../src/main.sass */ /* line 84, ../src/main.sass */
.clickable { .clickable {
cursor: pointer; cursor: pointer;
} }
/* line 86, ../src/main.sass */ /* line 88, ../src/main.sass */
#container { #container {
width: span(24); width: span(24);
margin: 0 auto; margin: 0 auto;
} }
/* line 91, ../src/main.sass */ /* line 93, ../src/main.sass */
a { a {
text-decoration: none; text-decoration: none;
} }
/* line 94, ../src/main.sass */ /* line 96, ../src/main.sass */
h1 { h1, h2 {
text-align: center; text-align: center;
} }
/* line 104, ../src/main.sass */ /* line 106, ../src/main.sass */
.block { .block {
background-color: rgba(0, 0, 0, 0.02); background-color: rgba(0, 0, 0, 0.02);
-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;
@ -114,37 +114,42 @@ h1 {
-khtml-border-radius: 5px; -khtml-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
} }
/* line 101, ../src/main.sass */ /* line 103, ../src/main.sass */
.block > * { .block > * {
padding: 20px; padding: 20px;
} }
/* line 106, ../src/main.sass */ /* line 108, ../src/main.sass */
.block:hover { .block:hover {
background-color: rgba(0, 0, 0, 0.05); background-color: rgba(0, 0, 0, 0.05);
} }
/* line 139, ../src/main.sass */ /* line 147, ../src/main.sass */
#prelinks { #prelinks {
width: 600px; width: 600px;
margin: 0.5em auto; margin: 0.5em auto;
height: 1em; height: 1em;
} }
/* line 145, ../src/main.sass */ /* line 153, ../src/main.sass */
#choixlang { #choixlang {
float: left; float: left;
font-size: 14px; font-size: 14px;
} }
/* line 111, ../src/main.sass */ /* line 113, ../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);
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -webkit-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 0; -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 0; box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
} }
/* line 115, ../src/main.sass */ /* line 117, ../src/main.sass */
#choixlang a:active {
background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black;
}
/* line 120, ../src/main.sass */
#choixlang a { #choixlang a {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -156,28 +161,33 @@ h1 {
text-align: center; text-align: center;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
color: #b4b8c5; color: #9ca1ad;
} }
/* line 122, ../src/main.sass */ /* line 127, ../src/main.sass */
#choixlang a:hover { #choixlang a:hover {
color: #efeff4; color: #efeff4;
} }
/* line 149, ../src/main.sass */ /* line 157, ../src/main.sass */
#choixrss { #choixrss {
float: right; float: right;
font-size: 14px; font-size: 14px;
} }
/* line 111, ../src/main.sass */ /* line 113, ../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);
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -webkit-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 0; -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 0; box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
} }
/* line 115, ../src/main.sass */ /* line 117, ../src/main.sass */
#choixrss a:active {
background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black;
}
/* line 120, ../src/main.sass */
#choixrss a { #choixrss a {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -189,41 +199,48 @@ h1 {
text-align: center; text-align: center;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
color: #b4b8c5; color: #9ca1ad;
} }
/* line 122, ../src/main.sass */ /* line 127, ../src/main.sass */
#choixrss a:hover { #choixrss a:hover {
color: #efeff4; color: #efeff4;
} }
/* line 153, ../src/main.sass */ /* line 161, ../src/main.sass */
#mainnav { #mainnav {
width: 50%; width: 600px;
padding: 0;
margin: 2.5em auto;
} }
/* line 155, ../src/main.sass */ /* line 165, ../src/main.sass */
#mainnav ul { #mainnav ul {
width: +span(9);
height: 2.2ex; height: 2.2ex;
margin: 0 auto; padding: 0;
padding-left: 0;
list-style-type: none; list-style-type: none;
margin: 0 auto;
} }
/* line 162, ../src/main.sass */ /* line 169, ../src/main.sass */
#mainnav ul li { #mainnav ul li {
text-align: center; text-align: center;
float: left;
width: 160px;
margin: 0 20px;
font-size: 14px; font-size: 14px;
} }
/* line 111, ../src/main.sass */ /* line 113, ../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);
-moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
-webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 0; -webkit-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 0; -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 0; box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px inset, rgba(255, 255, 255, 0.3) 0 1px 3px inset;
} }
/* line 115, ../src/main.sass */ /* line 117, ../src/main.sass */
#mainnav ul li a:active {
background-color: rgba(0, 0, 0, 0.5);
text-shadow: 0 0 2px black;
}
/* line 120, ../src/main.sass */
#mainnav ul li a { #mainnav ul li a {
padding: 0.2em; padding: 0.2em;
-moz-border-radius: 2ex; -moz-border-radius: 2ex;
@ -235,14 +252,19 @@ h1 {
text-align: center; text-align: center;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
color: #b4b8c5; color: #9ca1ad;
} }
/* line 122, ../src/main.sass */ /* line 127, ../src/main.sass */
#mainnav ul li a:hover { #mainnav ul li a:hover {
color: #efeff4; color: #efeff4;
} }
/* line 176, ../src/main.sass */
#mainnav ul li * {
font-size: 1.5em;
font-weight: bold;
}
/* line 166, ../src/main.sass */ /* line 180, ../src/main.sass */
.slideshow { .slideshow {
background-color: rgba(0, 0, 0, 0.02); background-color: rgba(0, 0, 0, 0.02);
-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;
@ -256,18 +278,18 @@ h1 {
-khtml-border-radius: 5px; -khtml-border-radius: 5px;
border-radius: 5px; border-radius: 5px;
} }
/* line 101, ../src/main.sass */ /* line 103, ../src/main.sass */
.slideshow > * { .slideshow > * {
padding: 20px; padding: 20px;
} }
/* line 169, ../src/main.sass */ /* line 183, ../src/main.sass */
.flush { .flush {
clear: both; clear: both;
} }
/* line 172, ../src/main.sass */ /* line 186, ../src/main.sass */
#main { #main {
width: 50%; width: 600px;
margin-left: 25%; margin: 0 auto;
} }

View file

@ -42,9 +42,11 @@
<body lang="en" class="bp"> <body lang="en" class="bp">
<div id="container"> <div id="container">
<header> <header>
<div id="choixlang"><a href="/Scratch/fr/" onclick="setLanguage('fr')">en Français</a></div> <div id="prelinks">
<div id="choixrss"><a id="rss" href="http://feeds.feedburner.com/ypasswordespozitocomen">Subscribe</a></div> <div id="choixlang"><a href="/Scratch/fr/" onclick="setLanguage('fr')">en Français</a></div>
<hgroup> <div id="choixrss"><a id="rss" href="http://feeds.feedburner.com/ypasswordespozitocomen">Subscribe</a></div>
</div>
<hgroup id="maintitle">
<h1> <h1>
<a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a> <a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewSoftware?id=436268354&mt=8">YPassword</a>
</h1> </h1>
@ -59,47 +61,6 @@
<article> <article>
<div class="content"> <div class="content">
<div id="mainlinks">
<div class="block left secure clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Secure
<span class="nicer">»</span>
</a>
</h3>
<p>
SHA1 ensure strong password generation
</p>
</div>
</div>
<div class="block left easy clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Easy
<span class="nicer">»</span>
</a>
</h3>
<p>
Remember only one master password
</p>
</div>
</div>
<div class="block left portable clickable">
<div class="inner">
<h3>
<a href="javascript:return false;"> Portable
<span class="nicer">»</span>
</a>
</h3>
<p>
Dashboard widget, Javascript applet, etc...
</p>
</div>
</div>
</div>
<div class="flush"></div>
<div id="securecontent" class="slideshow big"><div class="inner"> <div id="securecontent" class="slideshow big"><div class="inner">
YPassword use SHA1 YPassword use SHA1
<img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" /> <img src="/Scratch//img/blog/2011-05-05-Screenshots/main_password.jpg" alt="main password view" style="display:block; margin-left:0;" />
@ -169,30 +130,6 @@ Your password is copied, you can paste it.
<script src="/js/plugins.js"></script> <script src="/js/plugins.js"></script>
<script src="/js/script.js"></script> <script src="/js/script.js"></script>
<script>
var blocks=["secure","easy","portable"];
function show(name) {
for ( var i in blocks ) {
el=blocks[i];
if (el == name) { continue; }
// console.log('HIDE: #'+el+'content');
$('#'+el+'content').hide();
}
$('#'+name+'content').show();
// console.log('SHOW: #'+name+'content');
}
$('document').ready(function() {
$('.secure').click(function() {show("secure")});
$('.easy').click(function() {show("easy")});
$('.portable').click(function() {show("portable")});
for (var i in blocks) {
el=blocks[i];
$('#'+el+'content').hide();
}
});
</script>
<!-- end scripts--> <!-- end scripts-->
<!--[if lt IE 7 ]> <!--[if lt IE 7 ]>
<script src="/js/libs/dd_belatedpng.js"></script> <script src="/js/libs/dd_belatedpng.js"></script>

View file

@ -20,17 +20,19 @@ $ycolor8: #1F2024
$ycolor9: #0F1011 $ycolor9: #0F1011
// $higlightcolor: #28C // $higlightcolor: #28C
$higlightcolor: $ycolor3 + #027 $higlightcolor: $ycolor3 + #025
$higlightcolor-shadow: #058 $higlightcolor-shadow: #058
$higlightcolor-reflect: #6AF $higlightcolor-reflect: #6AF
$dark_highlight: #025
$main-background-color: $ycolorb $main-background-color: $ycolorb
// Background colors // Background colors
body body
margin: 0 margin: 0
font-family: Futura, Molengo font-family: Futura, Molengo, sans-serif
background: $main-background-color background: $main-background-color
&.bp &.bp
background: $main-background-color background: $main-background-color
@ -38,15 +40,12 @@ body
color: $ycolor4 color: $ycolor4
font-weight: bold font-weight: bold
letter-spacing: -0.05em letter-spacing: -0.05em
+text-shadow($ycolor6 -1px -1px 0px,$ycolorb 0px 1px 0px )
a a
color: $ycolor2 color: $ycolor2
&:visited &:visited
color: $ycolor2 color: $ycolor2
&:hover, &:active &:hover, &:active
color: $higlightcolor color: $higlightcolor
a:hover
+text-shadow($ycolor6 -1px -1px 0px ,$ycolorb 0px 1px 0px ,rgba(#38C,0.5) 0 0 4px )
a a
text-decoration: none text-decoration: none
color: $ycolor4 color: $ycolor4
@ -64,8 +63,11 @@ hgroup#maintitle
font-size: 2em font-size: 2em
h1,h2 h1,h2
&,a &,a
font-weight: normal
color: $ycolor9 color: $ycolor9
text-shadow: 0 0 2px rgba($ycolorb,.5) text-shadow: 0 0 2px rgba($ycolorb,.5)
a:hover
color: $dark_highlight
border: border:
top: solid 1px #000 top: solid 1px #000
bottom: solid 1px #FFF bottom: solid 1px #FFF
@ -91,7 +93,7 @@ hgroup#maintitle
a a
text-decoration: none text-decoration: none
h1 h1,h2
text-align: center text-align: center
=innerblock =innerblock
@ -111,14 +113,17 @@ h1
a:hover a:hover
color: $ycolorb color: $ycolorb
background-color: rgba(#000,.3) background-color: rgba(#000,.3)
+box-shadow(rgba(#000,.3) 0 1px 3px inset,rgba(#FFF,.3) 0 1px 0) +box-shadow(rgba(#000,.3) 0 1px 3px inset,rgba(#FFF,.3) 0 1px 3px inset)
a:active
background-color: rgba(#000,.5)
text-shadow: 0 0 2px #000
a a
padding: .2em padding: .2em
+border-radius(2ex) +border-radius(2ex)
text-align: center text-align: center
width: 100% width: 100%
display: inline-block display: inline-block
color: $ycolor1 color: $ycolor2
&:hover &:hover
color: $ycolorb color: $ycolorb
@ -136,8 +141,11 @@ h1
&:active &:active
+text-shadow(#3AF 0 0 4px, rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px ) +text-shadow(#3AF 0 0 4px, rgba(#000,0.5) 0px -1px 0px,rgba(#FFF,0.5) 0px 1px 0px )
$stdWidth: 600px
#prelinks #prelinks
width: 600px width: $stdWidth
margin: .5em auto margin: .5em auto
height: 1em height: 1em
@ -151,17 +159,23 @@ h1
+ybutton +ybutton
#mainnav #mainnav
width: 50% width: $stdWidth
padding: 0
margin: 2.5em auto
ul ul
width: +span(9)
height: 2.2ex height: 2.2ex
margin: 0 auto padding: 0
padding-left: 0
list-style-type: none list-style-type: none
margin: 0 auto
li li
*
text-align: center text-align: center
float: left
width: ($stdWidth - 120px)/3
margin: 0 20px
+ybutton +ybutton
*
font-size: 1.5em
font-weight: bold
.slideshow .slideshow
+innerblock +innerblock
@ -170,5 +184,5 @@ h1
clear: both clear: both
#main #main
width: 50% width: $stdWidth
margin-left: 25% margin: 0 auto