From 44a3a35148861faba463baf9b69b5136581dc18a Mon Sep 17 00:00:00 2001 From: benweet Date: Mon, 25 Aug 2014 19:25:21 +0100 Subject: [PATCH] Landing page (part 2) --- public/index.html | 256 +++++++++++++++++++++++--------- public/res/WELCOME.md | 14 +- public/res/img/live-preview.png | Bin 0 -> 62155 bytes public/res/img/menu.png | Bin 0 -> 20397 bytes public/res/img/toc.gif | Bin 0 -> 15365 bytes 5 files changed, 193 insertions(+), 77 deletions(-) create mode 100644 public/res/img/live-preview.png create mode 100644 public/res/img/menu.png create mode 100644 public/res/img/toc.gif diff --git a/public/index.html b/public/index.html index 33fbd553..2bd4f9eb 100644 --- a/public/index.html +++ b/public/index.html @@ -6,7 +6,8 @@ - + @@ -17,19 +18,23 @@ font-size: 18px; font-weight: 300; } + .navbar { position: fixed; } + .content { position: absolute; width: 100%; height: 100%; } + .slide { position: relative; width: 100%; height: 100%; } + .footer { position: absolute; top: inherit; @@ -38,17 +43,21 @@ width: 100%; padding: 5px } + .slide, .footer, h1 { text-align: center; } + .footer .btn { font-size: 28px; padding: 0 11px; line-height: 1; } + .btn-info { color: #777; } + .centered { position: absolute; top: 0; @@ -57,59 +66,94 @@ right: 0; margin: auto; } + .logo { - height: 150px; + height: 160px; width: 600px; } + .logo .subtitle { position: absolute; text-align: right; color: #888; - top: 110px; + top: 105px; right: 10px; font-size: 22px; } + .logo a { color: #555; } + .logo i::before { - margin-right: 0; + margin-right: 8px; + margin-left: 0; } + .transition { -webkit-transition: all ease-in-out 1.5s; transition: all ease-out 1.5s; } + .transparent { opacity: 0; } + .scale { -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03); } + .navbar .nav { float: none; } + .navbar .btn { font-size: 18px; line-height: 1.25; } + img.modal-content { - margin: 50px auto; + margin: 70px auto; display: block; } + .social { font-size: 26px; + margin-right: 20px; + } + + .container { + margin-bottom: 40px; + } + + .dark { + background-color: #aeaeae; + } + + .inset-shadow { + -webkit-box-shadow: inset 0 4px 16px rgba(0, 0, 0, 0.2); + box-shadow: inset 0 4px 16px rgba(0, 0, 0, 0.2); + } + + .menu-img { + background-image: url(res/img/menu.png); + background-size: auto 240px; + background-repeat: no-repeat; + background-position: 30%; + height: 240px; }