From 23ec64d0977fe59e4d4629e729dde9839bbedbfb Mon Sep 17 00:00:00 2001 From: Shipow Date: Tue, 22 Dec 2015 22:15:50 +0100 Subject: [PATCH] chore(docs): Cleaned Css --- docs/css/_home.scss | 139 +++++++++++++++++++------------------------- docs/index.haml | 16 ++--- 2 files changed, 67 insertions(+), 88 deletions(-) diff --git a/docs/css/_home.scss b/docs/css/_home.scss index 882c7aa7..2d1cad8e 100644 --- a/docs/css/_home.scss +++ b/docs/css/_home.scss @@ -10,68 +10,57 @@ // ------------------------- */ html, body { position: relative; - width: 100%; - height: 100%; - background-attachment: fixed; - font-family: "Raleway", "Open Sans", Helvetica, Arial, sans-serif; + font-family: "Raleway", Helvetica, Arial, sans-serif; } /* HEADER // ------------------------- */ -.site-header { - position: fixed; - top: 0; - width: 100%; - z-index: 99; - background: linear-gradient(to right, rgba(10, 23, 36, 0.8) -50%, rgba(23, 44, 79, 0.5) 100%); - transition: background 2s ease; - border-bottom: 1px solid #232E3A; -} -.site-header nav.navbar { - margin-bottom: 0; - background-color: #0B1724; - border-radius: 0; - border: none; -} -.site-header nav.navbar .navbar-collapse.in { - background-color: #0B1724 !important; - animation: fadeInUp .2s ease-in-out; - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - padding: 20%; - font-size: 1.2em; -} -.site-header nav.navbar .navbar-collapse.in li { - padding-bottom: 1em; -} -.site-header nav.navbar #logo img { +#logo img { height: 32px; margin-right: 12px; } -.site-header nav.navbar .navbar-header { - position: relative; - z-index: 2; - height: 50px; - font-size: 16px; - color: #FF2E6C; - line-height: 50px; -} -.site-header nav.navbar .navbar-toggle { - background-color: #1d96c7; - border: solid 1px #1d96c7; - color: white; -} -.site-header nav.navbar .navbar-toggle.collapsed { - background-color: transparent; - border: solid 1px rgba(255, 255, 255, 0.4); - color: white; -} -.site-header nav.navbar .navbar-nav > li > a { - padding-bottom: 0; + +.site-header { + width: 100%; + .navbar { + border-radius: 0; + border: none; + .navbar-header { + position: relative; + height: 50px; + font-size: 16px; + line-height: 50px; + } + .navbar-toggle { + background-color: #1d96c7; + border: solid 1px #1d96c7; + color: white; + &.collapsed { + background-color: transparent; + border: solid 1px rgba(255, 255, 255, 0.4); + color: white; + } + } + .navbar-nav > li > a { + padding-bottom: 0; + } + .navbar-collapse.in { + background-color: #0B1724 !important; + animation: fadeInUp .2s ease-in-out; + position: fixed; + top: 0; + right: 0; + bottom: 0; + left: 0; + padding: 20%; + font-size: 1.2em; + li { + padding-bottom: 1em; + } + } + } } + .site-header nav.navbar .navbar-nav > .active > a { color: #1D96C7 !important; background-color: transparent; @@ -90,11 +79,7 @@ html, body { // ------------------------- */ .main-content .jumbotron { padding-top: 60px; - height: 700px; background: #091724 url(../img/header-bg.png) no-repeat center center; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; background-size: cover; margin-bottom: 0; } @@ -104,12 +89,6 @@ html, body { color: #FFF; } -.jumbotron .jumbotron-header h1 { - font-size: 60px; - font-weight: 500; - font-family: "Helvetica Neue", "Raleway", "Open Sans", Helvetica, Arial, sans-serif; -} - .jumbotron .jumbotron-left-column { display: none; padding-top: 100px; @@ -119,7 +98,8 @@ html, body { margin-left: 120px; } .jumbotron .jumbotron-left-column p { - font-size: 22px; + font-size: 18px; + color: #C7C4C3; } @media (min-width: 1200px) { .jumbotron .jumbotron-left-column { @@ -288,28 +268,27 @@ footer.site-footer { border-top: 1px solid #eeeeee; background-color: white; text-align: center; -} -footer.site-footer .fa.fa-heart { - color: #e61870; -} -footer.site-footer .input-group-addon { - background-color: transparent; + .fa.fa-heart { + color: #e61870; + } + .input-group-addon { + background-color: transparent; + } } .doc-page { position: absolute; z-index: 1; + &.show { + transition: opacity 300ms; + opacity:1; + } + &.hide { + opacity: 0; + transition: opacity 0; + } } -.doc-page.show { - transition: opacity 300ms; - opacity:1; -} - -.doc-page.hide { - opacity: 0; - transition: opacity 0; -} .index-container { position: relative; diff --git a/docs/index.haml b/docs/index.haml index 6c82467f..434d5fe8 100644 --- a/docs/index.haml +++ b/docs/index.haml @@ -12,8 +12,10 @@ layout: default .jumbotron-left-column %div.index-container %img.index{src: 'img/illus-index.png'} - %p We’ve created the fastest, easiest way to search within documentation. - %p
And best of all? It’s FREE. + .spacer40 + .text-center + %p We’ve created the fastest, easiest way to search within documentation. + %p
And best of all? It’s FREE. %form#join-form{action: '#', method: 'POST'} %h3 Get Started. It’s FREE! .spacer20 @@ -33,12 +35,10 @@ layout: default %button.btn.btn-primary.btn-lg{type: 'submit'} JOIN THE BETA! #section_why.page-section - .container - .row - .col-sm-10.col-sm-offset-1 - %h2.page-section-title Why DocSearch? - %p We’re scratching our own itch here. As developers, we spend a lot of time reading documentation, and it isn’t always easy to find the information we need. - %p Not blaming anyone here. Building a good search for a documentation is a complex challenge.
We happen to have a lot of experience doing that, and we want to share it with the world. For free. + .m800.m-l-r-auto + %h2.page-section-title Why DocSearch? + %p We’re scratching our own itch here. As developers, we spend a lot of time reading documentation, and it isn’t always easy to find the information we need. + %p Not blaming anyone here. Building a good search for a documentation is a complex challenge.
We happen to have a lot of experience doing that, and we want to share it with the world. For free. #section_examples.page-section.page-section-dark .container .row