Some site layout improvements.
This commit is contained in:
Maarten Billemont
parent
09d5e64c55
commit
92be7f7267
@ -1,5 +1,5 @@
|
|||||||
html {
|
html {
|
||||||
background: url("../img/back-light.png") center 0;
|
background: url("../img/back2-light.png") center 0;
|
||||||
}
|
}
|
||||||
body {
|
body {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
@ -65,14 +65,6 @@ img {
|
|||||||
|
|
||||||
|
|
||||||
/* Classes */
|
/* Classes */
|
||||||
.stripe {
|
|
||||||
background: rgba(255, 255, 255, 0.3);
|
|
||||||
border: 1px solid rgba(255, 255, 255, 0.5);
|
|
||||||
border-width: 1px 0;
|
|
||||||
-webkit-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
|
||||||
-moz-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
|
||||||
box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
|
||||||
}
|
|
||||||
.button {
|
.button {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
background: rgba(255, 255, 255, 0.7);
|
background: rgba(255, 255, 255, 0.7);
|
||||||
@ -94,7 +86,7 @@ img {
|
|||||||
header {
|
header {
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
background: url("../img/back-dark.png") center 0;
|
background: url("../img/back2-dark.png") center 0;
|
||||||
border-bottom: 1px solid #FFF;
|
border-bottom: 1px solid #FFF;
|
||||||
-webkit-box-shadow: 0 0 50px #666;
|
-webkit-box-shadow: 0 0 50px #666;
|
||||||
-moz-box-shadow: 0 0 50px #666;
|
-moz-box-shadow: 0 0 50px #666;
|
||||||
@ -107,7 +99,7 @@ header {
|
|||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 150px;
|
height: 150px;
|
||||||
margin: 0 0 5em;
|
margin: 0;
|
||||||
padding: 1em 0 0;
|
padding: 1em 0 0;
|
||||||
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -130,7 +122,7 @@ header .divider {
|
|||||||
#fixedheader {
|
#fixedheader {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
z-index: 98;
|
z-index: 98;
|
||||||
background: url("../img/back-dark.png") center 0;
|
background: url("../img/back2-dark.png") center 0;
|
||||||
border-bottom: 1px solid #FFF;
|
border-bottom: 1px solid #FFF;
|
||||||
-webkit-box-shadow: 0 0 10px #000;
|
-webkit-box-shadow: 0 0 10px #000;
|
||||||
-moz-box-shadow: 0 0 10px #000;
|
-moz-box-shadow: 0 0 10px #000;
|
||||||
@ -143,7 +135,6 @@ header .divider {
|
|||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
margin: 0 0 5em;
|
|
||||||
padding: 10px 0 0;
|
padding: 10px 0 0;
|
||||||
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -175,12 +166,25 @@ footer {
|
|||||||
font-size: 80%;
|
font-size: 80%;
|
||||||
}
|
}
|
||||||
section {
|
section {
|
||||||
width: 900px;
|
width: 950px;
|
||||||
margin: 0 auto;
|
margin: 0 auto 2em;
|
||||||
|
padding: 1em 0 0;
|
||||||
}
|
}
|
||||||
#content section.current {
|
section.heading {
|
||||||
opacity: 1;
|
background: rgba(200, 200, 200, 0.3);
|
||||||
z-index: 1;
|
border: 1px solid rgba(200, 200, 200, 0.5);
|
||||||
|
border-width: 0 0 1px;
|
||||||
|
-webkit-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
||||||
|
-moz-box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
||||||
|
box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.5), 2px 2px 6px rgba(200, 200, 200, 0.5);
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
section.heading>div {
|
||||||
|
width: 950px;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 1em 0;
|
||||||
}
|
}
|
||||||
hr {
|
hr {
|
||||||
background: url("../img/Dividers/Simple.png") center center no-repeat;
|
background: url("../img/Dividers/Simple.png") center center no-repeat;
|
||||||
@ -207,6 +211,7 @@ blockquote:before {
|
|||||||
.sidebox {
|
.sidebox {
|
||||||
background: url("../img/Dividers/Divider_H.png") center bottom no-repeat;
|
background: url("../img/Dividers/Divider_H.png") center bottom no-repeat;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
float: right;
|
float: right;
|
||||||
margin: 1em;
|
margin: 1em;
|
||||||
width: 546px;
|
width: 546px;
|
||||||
@ -215,7 +220,7 @@ blockquote:before {
|
|||||||
.sidebox .clip {
|
.sidebox .clip {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: -1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
.appstore {
|
.appstore {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
@ -319,7 +324,7 @@ a.next:after {
|
|||||||
display: block;
|
display: block;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
margin-top: -5em;
|
margin-top: -1em;
|
||||||
width: 184px;
|
width: 184px;
|
||||||
height: 184px;
|
height: 184px;
|
||||||
}
|
}
|
||||||
|
|||||||
BIN
Site/img/back2-dark.png
Normal file
BIN
Site/img/back2-dark.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
Site/img/back2-light.png
Normal file
BIN
Site/img/back2-light.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
@ -92,31 +92,39 @@
|
|||||||
<h2><a href="index.html">Master Password</a></h2>
|
<h2><a href="index.html">Master Password</a></h2>
|
||||||
</div>
|
</div>
|
||||||
<!--a href="http://bit.ly/vNN5Zi" onclick="_gaq.push(['_trackPageview', '/outbound/testflight']);" id="ribbon"></a-->
|
<!--a href="http://bit.ly/vNN5Zi" onclick="_gaq.push(['_trackPageview', '/outbound/testflight']);" id="ribbon"></a-->
|
||||||
<section>
|
|
||||||
|
<section class="heading">
|
||||||
<div class="sidebox">
|
<div>
|
||||||
<div class="clip">
|
<div class="sidebox">
|
||||||
<img src="img/frontpage_phone.png" />
|
<div class="clip">
|
||||||
|
<img src="img/frontpage_phone.png" />
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<h1>Stop worrying<br />
|
||||||
|
about passwords</h1>
|
||||||
|
|
||||||
|
<h2>Admit it, you're terrible at memorizing passwords.</h2>
|
||||||
|
|
||||||
|
<p>Just like the rest of the world, your passwords are too simple or reused between many sites. To hackers, <em>your accounts are like an empty house with the door left open</em>.</p>
|
||||||
|
|
||||||
|
<p>I'm sure you've <em>tried</em> to do better. Maybe you keep a notebook or post-it with passwords. Maybe you even store your passwords in a program or just in your browser. The problem with putting your passwords somewhere "safe" is two-fold: Somebody can <em>steal them</em>, and you can <em>loose them</em>.</p>
|
||||||
|
|
||||||
|
<p> </p>
|
||||||
|
|
||||||
|
<p><b>Master Password is a <em>stateless solution</em></b>, which means <strong>your passwords aren't saved <em>anywhere</em></strong>. Not in your head, not in a notebook, not on your computer and not in the cloud.<br />
|
||||||
|
Nothing to store means nothing to keep safe and nothing to lose.</p>
|
||||||
|
|
||||||
|
<p>Master Password just recreates the passwords for your sites whenever you need them: instantly and on-demand. At the same time it makes sure that your accounts are adequately protected with <em>secure and unique</em> passwords.</p>
|
||||||
</div>
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<h1>Stop worrying<br />
|
<section>
|
||||||
about passwords</h1>
|
|
||||||
|
|
||||||
<h2>Admit it, you're terrible at memorizing passwords.</h2>
|
|
||||||
|
|
||||||
<p>Just like the rest of the world, your passwords are too simple or reused between many sites. To security specialists or hackers, <em>your accounts are like empty houses with the door wide open</em>.</p>
|
|
||||||
<p>Even the sites you use that hold nothing of value can easily be used by attackers to impersonate you.</p>
|
|
||||||
|
|
||||||
<p><b>Master Password</b> is a <em>stateless solution</em>, which means <strong>your passwords don't need to be saved <em>anywhere</em></strong>. Not in your head, not on your computer and not in the cloud.<br />
|
|
||||||
Nothing to store means nothing to lose. At the same time it makes sure that your accounts are adequately protected with secure and <em>unique</em> passwords.</p>
|
|
||||||
|
|
||||||
<p>Master Password is <b>different</b> from other vault-like password solutions. It helps you set <b>secure passwords</b> for your sites, and at the same time makes <b>losing your passwords almost impossible</b>.</p>
|
<p>Master Password is <b>different</b> from other vault-like password solutions. It helps you set <b>secure passwords</b> for your sites, and at the same time makes <b>losing your passwords almost impossible</b>.</p>
|
||||||
|
|
||||||
<p>Built on algorithms such as <a href="http://www.bsdcan.org/2009/schedule/events/147.en.html">scrypt</a> and <a href="http://en.wikipedia.org/wiki/HMAC">HMAC-SHA256</a>, your master password is kept safe even if websites you use get hacked.</p>
|
<p>Built on algorithms such as <a href="http://www.bsdcan.org/2009/schedule/events/147.en.html">scrypt</a> and <a href="http://en.wikipedia.org/wiki/HMAC">HMAC-SHA256</a>, your master password is kept safe even if websites you use get hacked.</p>
|
||||||
|
|
||||||
<p>On that topic, if you're not using Master Password yet and <a href="http://www.washingtonpost.com/business/technology/linkedin-eharmony-deal-with-breach-aftermath/2012/06/07/gJQAwqs5KV_story.html">you have a <b>LinkedIn</b> account, you should <em>worry</em> (click for details)</a>.<br />
|
<p>As to prove a point, <a href="http://www.washingtonpost.com/business/technology/linkedin-eharmony-deal-with-breach-aftermath/2012/06/07/gJQAwqs5KV_story.html"><b>LinkedIn</b>, <b>eHarmony</b></a>, and <a href="http://securitywatch.pcmag.com/none/298865-last-fm-joins-eharmony-linkedin-to-celebrate-breach-week"><b>Last.FM</b></a> have announced breaches that compromise millions of passwords in the past month alone. These breaches have leaked "<em>hashes</em>" of people's passwords, which make it trivial for attackers to find out the actual passwords <em>if they're not secure enough</em>.</p>
|
||||||
Change your password <em>now</em>, and change it into something secure and unique.</p>
|
|
||||||
|
|
||||||
<hr class="clear" />
|
<hr class="clear" />
|
||||||
<!--p>
|
<!--p>
|
||||||
@ -155,7 +163,7 @@
|
|||||||
<br />
|
<br />
|
||||||
</div>
|
</div>
|
||||||
<h2>Different password types</h2>
|
<h2>Different password types</h2>
|
||||||
Master Password's <strong>presets allow you to comply with</strong> almost any site's restrictive <strong>password policies</strong>, while still producing secure passwords for them.
|
Master Password's <strong>presets allow you to comply with</strong> almost any site's restrictive <strong>password policies</strong>, while still producing as secure a password for them as they permit.
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<div class="columnhead">
|
<div class="columnhead">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user