From 92be7f7267cd47a3d42d7187cbc33bd54b6bdd9a Mon Sep 17 00:00:00 2001 From: Maarten Billemont Date: Fri, 8 Jun 2012 20:46:08 +0200 Subject: [PATCH] Some site layout improvements. --- Site/css/screen.css | 45 +++++++++++++++++++++----------------- Site/img/back2-dark.png | Bin 0 -> 11281 bytes Site/img/back2-light.png | Bin 0 -> 11114 bytes Site/index.html | 46 +++++++++++++++++++++++---------------- 4 files changed, 52 insertions(+), 39 deletions(-) create mode 100644 Site/img/back2-dark.png create mode 100644 Site/img/back2-light.png diff --git a/Site/css/screen.css b/Site/css/screen.css index 8fda2a20..adaf33c6 100644 --- a/Site/css/screen.css +++ b/Site/css/screen.css @@ -1,5 +1,5 @@ html { - background: url("../img/back-light.png") center 0; + background: url("../img/back2-light.png") center 0; } body { padding: 0; @@ -65,14 +65,6 @@ img { /* 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 { display: inline-block; background: rgba(255, 255, 255, 0.7); @@ -94,7 +86,7 @@ img { header { position: relative; z-index: 99; - background: url("../img/back-dark.png") center 0; + background: url("../img/back2-dark.png") center 0; border-bottom: 1px solid #FFF; -webkit-box-shadow: 0 0 50px #666; -moz-box-shadow: 0 0 50px #666; @@ -107,7 +99,7 @@ header { left: 0; width: 100%; height: 150px; - margin: 0 0 5em; + margin: 0; padding: 1em 0 0; text-align: center; @@ -130,7 +122,7 @@ header .divider { #fixedheader { position: fixed; z-index: 98; - background: url("../img/back-dark.png") center 0; + background: url("../img/back2-dark.png") center 0; border-bottom: 1px solid #FFF; -webkit-box-shadow: 0 0 10px #000; -moz-box-shadow: 0 0 10px #000; @@ -143,7 +135,6 @@ header .divider { left: 0; width: 100%; height: 50px; - margin: 0 0 5em; padding: 10px 0 0; text-align: center; @@ -175,12 +166,25 @@ footer { font-size: 80%; } section { - width: 900px; - margin: 0 auto; + width: 950px; + margin: 0 auto 2em; + padding: 1em 0 0; } -#content section.current { - opacity: 1; - z-index: 1; +section.heading { + background: rgba(200, 200, 200, 0.3); + 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 { background: url("../img/Dividers/Simple.png") center center no-repeat; @@ -207,6 +211,7 @@ blockquote:before { .sidebox { background: url("../img/Dividers/Divider_H.png") center bottom no-repeat; position: relative; + z-index: 2; float: right; margin: 1em; width: 546px; @@ -215,7 +220,7 @@ blockquote:before { .sidebox .clip { overflow: hidden; position: relative; - z-index: -1; + z-index: 1; } .appstore { position: fixed; @@ -319,7 +324,7 @@ a.next:after { display: block; position: absolute; left: 0; - margin-top: -5em; + margin-top: -1em; width: 184px; height: 184px; } diff --git a/Site/img/back2-dark.png b/Site/img/back2-dark.png new file mode 100644 index 0000000000000000000000000000000000000000..82e2dd4e0e2fd144cdd003d2fc2209a183d69622 GIT binary patch literal 11281 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 Password -
- -
-
- + +
+
+
+
+ +
+ +

Stop worrying
+ about passwords

+ +

Admit it, you're terrible at memorizing passwords.

+ +

Just like the rest of the world, your passwords are too simple or reused between many sites. To hackers, your accounts are like an empty house with the door left open.

+ +

I'm sure you've tried 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 steal them, and you can loose them.

+ +

 

+ +

Master Password is a stateless solution, which means your passwords aren't saved anywhere. Not in your head, not in a notebook, not on your computer and not in the cloud.
+ Nothing to store means nothing to keep safe and nothing to lose.

+ +

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 secure and unique passwords.

+
-

Stop worrying
- about passwords

- -

Admit it, you're terrible at memorizing passwords.

- -

Just like the rest of the world, your passwords are too simple or reused between many sites. To security specialists or hackers, your accounts are like empty houses with the door wide open.

-

Even the sites you use that hold nothing of value can easily be used by attackers to impersonate you.

- -

Master Password is a stateless solution, which means your passwords don't need to be saved anywhere. Not in your head, not on your computer and not in the cloud.
- Nothing to store means nothing to lose. At the same time it makes sure that your accounts are adequately protected with secure and unique passwords.

- +

Master Password is different from other vault-like password solutions. It helps you set secure passwords for your sites, and at the same time makes losing your passwords almost impossible.

Built on algorithms such as scrypt and HMAC-SHA256, your master password is kept safe even if websites you use get hacked.

-

On that topic, if you're not using Master Password yet and you have a LinkedIn account, you should worry (click for details).
- Change your password now, and change it into something secure and unique.

+

As to prove a point, LinkedIn, eHarmony, and Last.FM have announced breaches that compromise millions of passwords in the past month alone. These breaches have leaked "hashes" of people's passwords, which make it trivial for attackers to find out the actual passwords if they're not secure enough.