webdocs-agl: added developer website template

Change-Id: I4a45ee0ad5dd0c29a6d6876a0e02cd5550c010e9
Signed-off-by: Stephane Desneux <stephane.desneux@iot.bzh>

1 files changed, 239 insertions, 0 deletions

diff --git a/site/static/styles/scss/webdocs.scss b/site/static/styles/scss/webdocs.scss
new file mode 100644
index 0000000..79edc17
--- /dev/null
+++ b/site/static/styles/scss/webdocs.scss
@@ -0,0 +1,239 @@
+
+@import 'bootstrap';
+
+/* Customized Variables for Bootstrap */
+$gray-base: black;
+$gray-transparent: rgba($gray-base,.8);
+$brand-primary-darker: rgb(57, 146, 171);
+$brand-success: rgb(41, 177, 106);
+$brand-info: rgb(76, 194, 228);
+$brand-danger: rgb(241, 83, 68);
+$font-family-sans-serif: "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif;
+$border-radius-large: 8px;
+$border-radius-small: 4px;
+$caret-width-base: 5px;
+$dropdown-bg: lighten($gray-base, 20%);
+$navbar-inverse-bg: rgba(0, 0, 0, .8);
+$label-color: rgb(255, 255, 255);
+$label-link-hover-color: rgb(255, 255, 255);
+$well-bg: lighten($gray-base, 90%);
+$well-border: transparent;
+$badge-color: rgb(255, 255, 255);
+$badge-link-hover-color: rgb(255, 255, 255);
+$badge-bg: $brand-danger;
+$badge-active-bg: rgb(255, 255, 255);
+$badge-line-height: 1.25;
+
+/* Other brand colors */
+$brand-gold: #F1B444;
+$brand-gold-darker: #B58733;
+$gray-90: lighten($gray-base, 10%);
+$gray-85: lighten($gray-base, 15%);
+$gray-80: lighten($gray-base, 20%);
+$gray-70: lighten($gray-base, 30%);
+$gray-60: lighten($gray-base, 40%);
+$gray-50: lighten($gray-base, 50%);
+$gray-40: lighten($gray-base, 60%);
+$gray-20: lighten($gray-base, 80%);
+$gray-10: lighten($gray-base, 90%);
+$gray-5: lighten($gray-base, 95%);
+$brand-primary: #4CC2E4;
+
+/* Grid size (mirrors Bootstraps) */
+$screen-sm-min: 768px;
+$screen-xs-max: $screen-sm-min - 1;
+$screen-md-min: 992px;
+$screen-sm-max: $screen-md-min - 1;
+$screen-lg-min: 1200px;
+$screen-md-max: $screen-lg-min - 1;
+
+
+/* Mixin that prefixes any CSS rule */
+@mixin vendor-prefix($property, $argument) {
+  -webkit-#{$property}: #{$argument};
+  -ms-#{$property}: #{$argument};
+  -moz-#{$property}: #{$argument};
+  -o-#{$property}: #{$argument};
+  #{$property}: #{$argument};
+}
+
+/* header */
+header {
+    .navbar-form {
+        margin-bottom: 0px;
+    }
+    .btn.search-button {
+        padding: 0px 10px 0px 15px;
+        font-size: 27px;
+        background-color: rgba(0, 0, 0, 0);
+        border-radius: 0px;
+        color: $gray-40;
+        &:hover {
+            color: $gray-10;
+        }
+    }
+}
+
+/* footer */
+footer {
+    background-color: $gray-5;
+    position: relative;
+    strong { color:inherit; }
+    h1 {
+        font-size: 2.5em;
+        color: $brand-primary-darker;
+    }
+    h2 {
+        text-transform: uppercase;
+        color:$gray-50;
+        font-size: 1em;
+        font-weight: bold;
+    }
+}
+footer ul.nav li > a {
+    font-size:1em;
+    margin-left: -15px;
+}
+footer ul.nav li > a:hover {
+    background-color: $gray-20;
+}
+footer .copyright_text {
+    margin-top: 25px;
+}
+
+.page {
+    margin-bottom: 2em;
+}
+
+/*
+ * position anchors of fragment links slightly above their targets
+ */
+.fragment-anchor {
+    display: block;
+    position: relative;
+    bottom: 50px;
+}
+
+/*
+********* Modifications to Bootstrap ***********
+*/
+button.btn, a.btn {
+    border-radius: 0;
+    background-color: $brand-primary;
+    color: black;
+    border: 0;
+}
+button.btn:hover, a.btn {
+    color: black;
+}
+h1 {
+    color: $brand-gold-darker;
+    font-weight: normal;
+}
+h2 {
+    color: $gray-50;
+    font-size: 18px;
+}
+.badge {
+    font-size: 12px;
+    margin-top: -14px;
+    padding: 1px 5px;
+}
+.blue-divider {
+    width:100%;
+    height:4px;
+    background-color: $brand-primary;
+}
+
+/* misc */
+.vertical-center-parent {
+    position: relative;
+    width: 100%;
+    height: 100%;
+    .vertical-center-child {
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        @include vendor-prefix(transform, translate(-50%,-50%));
+    }
+}
+.whole-page-content {
+    min-height: 300px;
+    height: 60%;
+    margin: auto;
+}
+.not-found, .deprecated {
+    .vertical-center-child {
+        width: 100%;
+    }
+}
+.not-found-header {
+    text-align: center;
+}
+.not-found-redirect {
+    margin-bottom: 20px;
+    text-align: center;
+    display: none;
+    em {
+        text-decoration: underline;
+    }
+}
+
+/* fixing prettyprint formatting */
+pre.prettyprint {
+    padding: 10px !important;
+    font-size: 13px !important;
+    border: 1px solid #cccccc !important;
+}
+code.prettyprint {
+    border: none !important;
+}
+
+/* improving inline quotes styling */
+code {
+    background-color: #c9dddf;
+    color: #000000;
+}
+
+/* algolia search formatting */
+.algolia-docsearch-suggestion--category-header, .algolia-docsearch-suggestion {
+    font-family: "Raleway", Helvetica, Arial, sans-serif !important;
+}
+
+.algolia-docsearch-suggestion--category-header {
+    background-color: #262626   !important;
+    font-size: 16px             !important;
+    font-weight: bold           !important;
+    line-height: 30px           !important;
+}
+
+.algolia-docsearch-suggestion {
+    font-size: 14px     !important;
+    font-weight: 300    !important;
+}
+
+@media (max-width: $screen-xs-max) {
+    #header-search-form {
+        display: none;
+    }
+}
+
+#header-search-field {
+    border-radius: 4px !important;
+}
+
+H1 {
+    display: none;
+}
+
+.error {
+    color: red;
+}
+
+@import '_home';
+@import '_blog';
+@import '_plugins';
+@import '_docs';
+@import '_contribute';
+@import '_contact';
+@import '_artwork';