diff --git a/Site/2013-05/css/main.css b/Site/2013-05/css/main.css index 650e445f..2b60ca23 100644 --- a/Site/2013-05/css/main.css +++ b/Site/2013-05/css/main.css @@ -11,8 +11,9 @@ a { position: relative; color: inherit; } -a:link, a:visited { +a:link, a:visited, *[onclick] { color: #08c; + cursor: pointer; } a:hover { text-decoration: none; @@ -115,6 +116,27 @@ h2.inline, h3.inline, h4.inline { .thumb .pull-left { margin-right: 5ex; } +.fit-height { + height: 100%; + max-height: 100%; +} +.middle { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + text-align: center; + vertical-align: middle; +} +.middle::before { + display: inline-block; + content: ""; + width: 0; + height: 100%; + margin-left: -2px; + vertical-align: middle; +} .column { display: inline-block; @@ -164,6 +186,46 @@ header .background { width: 100%; height: 100%; } +header .box { + background: rgba(0, 0, 0, 0.8); + transition: all 0.5s; + + position: absolute; + right: 1em; + bottom: 1em; + width: 160px; + height: 100px; + + text-align: center; +} +header .box.active { + position: absolute; + right: 0; + bottom: 0; + width: 100%; + height: 100%; +} +header .box::before { + display: inline-block; + vertical-align: middle; + width: 0; + height: 100%; + content: ""; + margin-left: -2px; +} +header .box .minimized, +header .box .maximized { + position: relative; + vertical-align: middle; +} +header .box .minimized, +header .box.active .maximized { + display: inline-block; +} +header .box.active .minimized, +header .box .maximized { + display: none; +} #app header { height: 80%; } diff --git a/Site/2013-05/index.html b/Site/2013-05/index.html index 317152eb..43374a8a 100644 --- a/Site/2013-05/index.html +++ b/Site/2013-05/index.html @@ -56,18 +56,26 @@
- -

Master Password

Secure your life, forget your passwords.

+ +
+
+ +
+
+
+ + +
+