Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 1 | /*! |
| 2 | * Neon Pingendo template (https://templates.pingendo.com) |
| 3 | * Based on: Bootstrap v4.1.3 (https://getbootstrap.com) |
| 4 | * Copyright 2014-2018 Pingendo (https://pingendo.com) |
| 5 | */ |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 6 | @import url('https://fonts.googleapis.com/css?family=Montserrat:200'); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 7 | // Options |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 8 | // |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 9 | // Quickly modify global styling by enabling or disabling optional features. |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 10 | $enable-rounded: true; |
| 11 | $enable-shadows: false; |
| 12 | $enable-transitions: true; |
| 13 | $enable-hover-media-query: false; |
| 14 | $enable-grid-classes: true; |
| 15 | $enable-print-styles: true; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 16 | // Variables |
| 17 | // |
| 18 | // Colors |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 19 | $theme-colors: ( |
| 20 | primary: #0080ff, |
| 21 | secondary: #0060aa, |
| 22 | light: #f3f3f3, |
| 23 | dark: #303030, |
| 24 | info: #00aaff, |
| 25 | success: #28a745, |
| 26 | warning: #ffc107, |
| 27 | danger: #dc3545 |
| 28 | ); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 29 | $body-bg: #111; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 30 | $body-color: #efefef; |
| 31 | $body-color-inverse: invert($body-color) !default; |
| 32 | $link-color: #0080ff; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 33 | $link-hover-color: white; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 34 | $link-hover-decoration: none; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 35 | // Fonts |
| 36 | $font-family-base: Montserrat; |
| 37 | $headings-font-family: Montserrat; |
| 38 | $font-weight-normal: 200; |
| 39 | $font-weight-base: $font-weight-normal; |
| 40 | $headings-line-height: 1.2; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 41 | $lead-font-size: 1.30rem; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 42 | $line-height-base: 1.8; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 43 | $spacer: 1.5rem; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 44 | // Components |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 45 | $border-width: 1px; |
| 46 | $border-radius: 0.75rem; |
| 47 | $border-radius-lg: $border-radius * 1.2; |
| 48 | $border-radius-sm: $border-radius * .4; |
| 49 | $component-active-color: map-get($theme-colors,"dark"); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 50 | // Buttons |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 51 | $input-btn-padding-x-lg: 1.1rem; |
| 52 | $input-btn-padding-x: 1rem !default; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 53 | // Cards |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 54 | $card-border-width: 0; |
| 55 | $card-bg: rgba(#333,.5); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 56 | // Breadcrumb |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 57 | $breadcrumb-bg: transparent !default; |
| 58 | $breadcrumb-active-color: map-get($theme-colors,"light"); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 59 | // Carousel |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 60 | $carousel-caption-width: 100% !default; |
| 61 | $carousel-indicator-height: 6px !default; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 62 | //Images |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 63 | $thumbnail-border-color: map-get($theme-colors,"primary"); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 64 | // Nav tabs |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 65 | $nav-tabs-border-color: map-get($theme-colors,"primary"); |
| 66 | $nav-tabs-link-hover-border-color: transparent; |
| 67 | $nav-tabs-link-active-color: $component-active-color; |
| 68 | $nav-tabs-link-active-bg: map-get($theme-colors,"primary"); |
| 69 | $nav-tabs-link-active-border-color: $nav-tabs-border-color; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 70 | // Nav pills |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 71 | $nav-pills-link-active-color: $component-active-color !default; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 72 | // Navbar |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 73 | $navbar-light-color: rgba(black,.6); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 74 | // Pagination |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 75 | $pagination-bg: $body-bg; |
| 76 | $pagination-border-color: map-get($theme-colors,"dark"); |
| 77 | $pagination-hover-bg: $body-bg; |
| 78 | $pagination-hover-border-color: $pagination-border-color; |
| 79 | $pagination-active-color: $component-active-color; |
| 80 | $pagination-active-bg: map-get($theme-colors,"primary"); |
| 81 | $pagination-active-border-color: map-get($theme-colors,"dark"); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 82 | // List group |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 83 | $list-group-bg: $body-bg; |
| 84 | $list-group-border-color: map-get($theme-colors,"dark"); |
| 85 | $list-group-hover-bg: $body-bg; |
| 86 | $list-group-active-color: $component-active-color; |
| 87 | $list-group-action-color: $link-color; |
| 88 | $list-group-active-border-color: map-get($theme-colors,"dark"); |
| 89 | $list-group-action-hover-color: map-get($theme-colors,"light"); |
| 90 | $list-group-action-active-color: $body-color !default; |
| 91 | $list-group-action-active-bg: transparent; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 92 | // Horizontal rule |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 93 | $hr-border-color: rgba(map-get($theme-colors,"primary"),.75); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 94 | // Tables |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 95 | $table-accent-bg: rgba(map-get($theme-colors,"light"),.05); |
| 96 | $table-inverse-bg: rgba(map-get($theme-colors,"light"),.5); |
| 97 | $table-hover-bg: rgba(map-get($theme-colors,"light"),.1); |
| 98 | $table-border-color: map-get($theme-colors,"dark"); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 99 | $font-size-base: 0.85rem; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 100 | @import 'bootstrap-4.1.3'; |
| 101 | |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 102 | body, |
| 103 | html { |
| 104 | height: 100%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 105 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 106 | // Color yiq |
| 107 | @each $name, $value in $theme-colors { |
| 108 | .bg-#{$name} { |
| 109 | color: color-yiq($value); |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 110 | |
| 111 | input::placeholder { |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 112 | color: transparentize(color-yiq($value), .2); |
| 113 | } |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 114 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 115 | .input-group-text { |
| 116 | color: color-yiq($value); |
| 117 | } |
| 118 | } |
| 119 | } |
| 120 | |
| 121 | .section-fade-in-out { |
| 122 | position: relative; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 123 | color: white; |
| 124 | background-size: cover; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 125 | background-position: center; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 126 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 127 | &:before { |
| 128 | position: absolute; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 129 | top: 0; |
| 130 | left: 0; |
| 131 | width: 100%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 132 | height: 100%; |
| 133 | content: ' '; |
| 134 | background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.8),transparentize($body-bg, 0.2), $body-bg); |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 135 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 136 | } |
| 137 | |
| 138 | .section-fade-in { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 139 | position: relative; |
| 140 | color: white; |
| 141 | background-size: cover; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 142 | background-position: center; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 143 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 144 | &:before { |
| 145 | position: absolute; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 146 | top: 0; |
| 147 | left: 0; |
| 148 | width: 100%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 149 | height: 100%; |
| 150 | content: ' '; |
| 151 | background: linear-gradient($body-bg, transparentize($body-bg, 0.2),transparentize($body-bg, 0.8)); |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 152 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 153 | } |
| 154 | |
| 155 | .section-fade-out { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 156 | position: relative; |
| 157 | color: white; |
| 158 | background-size: cover; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 159 | background-position: center; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 160 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 161 | &:before { |
| 162 | position: absolute; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 163 | top: 0; |
| 164 | left: 0; |
| 165 | width: 100%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 166 | height: 100%; |
| 167 | content: ' '; |
| 168 | background: linear-gradient(transparentize($body-bg, 0.8),transparentize($body-bg, 0.2), $body-bg); |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 169 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 170 | } |
| 171 | |
| 172 | .shadowed { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 173 | box-shadow: 0 0 10px #000; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 174 | } |
| 175 | |
| 176 | .carousel { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 177 | .carousel-caption { |
| 178 | padding-top: 50px; |
| 179 | padding-bottom: 20px; |
| 180 | bottom: 0; |
| 181 | background: linear-gradient(transparent 10%, transparentize($body-bg, 0) 100%); |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 182 | } |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 183 | |
| 184 | .carousel-control-next, |
| 185 | .carousel-control-prev { |
| 186 | opacity: 0.85; |
| 187 | } |
| 188 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 189 | .carousel-indicators { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 190 | bottom: 0; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 191 | } |
| 192 | } |
| 193 | |
| 194 | mark { |
| 195 | &.primary { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 196 | background-color: map-get($theme-colors,"primary"); |
| 197 | color: black; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 198 | } |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 199 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 200 | &.secondary { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 201 | background-color: map-get($theme-colors,"secondary"); |
| 202 | color: white; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 203 | } |
| 204 | } |
| 205 | |
| 206 | .cover { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 207 | min-height: 100%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 208 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 209 | /* Animate state between .navbar and .navbar-ontop */ |
| 210 | .navbar { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 211 | transition: background-color 0.5s ease-out; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 212 | } |
| 213 | |
| 214 | .navbar-ontop { |
| 215 | background-color: transparent !important; |
| 216 | } |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 217 | /* Animate on entrance */ |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 218 | .animate-in-down { |
| 219 | transition: all 1.3s ease-out; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 220 | position: relative; |
| 221 | opacity: 1; |
| 222 | top: 0; |
| 223 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 224 | &.out-of-viewport { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 225 | top: 40px; |
| 226 | opacity: 0; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 227 | } |
| 228 | } |
| 229 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 230 | .animate-in-left { |
| 231 | transition: all 1.0s ease-out; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 232 | position: relative; |
| 233 | opacity: 1; |
| 234 | left: 0; |
| 235 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 236 | &.out-of-viewport { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 237 | opacity: 0; |
| 238 | left: -5%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 239 | } |
| 240 | } |
| 241 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 242 | .animate-in-right { |
| 243 | transition: all 1.0s ease-out; |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 244 | position: relative; |
| 245 | opacity: 1; |
| 246 | left: 0; |
| 247 | |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 248 | &.out-of-viewport { |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 249 | opacity: 0; |
| 250 | left: 5%; |
Unknown | d2db0f1 | 2019-01-10 14:22:00 -0500 | [diff] [blame] | 251 | } |
Jackeagle | aed6d39 | 2020-06-09 23:27:02 +0530 | [diff] [blame] | 252 | } |