| @import 'lib/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; |
| } |
| |
| .platform-icon { |
| width: 22px; |
| height: 22px; |
| } |
| |
| .platform-icon.android { |
| width: 18px; |
| } |
| |
| .platform-icon.electron { |
| width: 21px; |
| } |
| |
| .cdv-var-type { |
| display: inline-block; |
| font-size: 1.2rem; |
| padding: 5px; |
| border-radius: 5px; |
| height: 25px; |
| |
| background-color: #bfbfbf; |
| color: #333333; |
| |
| &.number { |
| background-color: #3ce4c5; |
| color: #333333; |
| } |
| |
| &.string { |
| background-color: #3ccde4; |
| color: #333333; |
| } |
| |
| &.boolean { |
| background-color: #3c78e4; |
| color: #ffffff; |
| } |
| |
| &.object { |
| background-color: #3c51e4; |
| color: #ffffff; |
| } |
| |
| &.float { |
| background-color: #7c3ce4; |
| color: #ffffff; |
| } |
| |
| &.array { |
| background-color: #b33ce4; |
| color: #333333; |
| } |
| } |
| |
| @import 'home'; |
| @import 'blog'; |
| @import 'plugins'; |
| @import 'docs'; |
| @import 'contribute'; |
| @import 'contact'; |
| @import 'artwork'; |
| @import 'team'; |