├── .github └── workflows │ └── main.yml ├── CHANGELOG.md ├── ISSUE_TEMPLATE.md ├── LICENSE.md ├── README.md ├── assets ├── css │ ├── bootstrap.min.css │ ├── bootstrap.min.css.map │ ├── now-ui-kit.css │ ├── now-ui-kit.css.map │ └── now-ui-kit.min.css ├── demo │ └── demo.css ├── fonts │ ├── nucleo-license.md │ ├── nucleo-outline.eot │ ├── nucleo-outline.ttf │ ├── nucleo-outline.woff │ └── nucleo-outline.woff2 ├── img │ ├── apple-icon.png │ ├── avatar.jpg │ ├── bg1.jpg │ ├── bg11.jpg │ ├── bg3.jpg │ ├── bg4.jpg │ ├── bg5.jpg │ ├── bg6.jpg │ ├── bg7.jpg │ ├── bg8.jpg │ ├── blurred-image-1.jpg │ ├── creative-tim-white-slim2.png │ ├── default-avatar.png │ ├── eva.jpg │ ├── favicon.png │ ├── flags │ │ ├── AD.png │ │ ├── AE.png │ │ ├── AG.png │ │ ├── AM.png │ │ ├── AR.png │ │ ├── AT.png │ │ ├── AU.png │ │ ├── BE.png │ │ ├── BF.png │ │ ├── BG.png │ │ ├── BO.png │ │ ├── BR.png │ │ ├── CA.png │ │ ├── CD.png │ │ ├── CG.png │ │ ├── CH.png │ │ ├── CL.png │ │ ├── CM.png │ │ ├── CN.png │ │ ├── CO.png │ │ ├── CZ.png │ │ ├── DE.png │ │ ├── DJ.png │ │ ├── DK.png │ │ ├── DZ.png │ │ ├── EE.png │ │ ├── EG.png │ │ ├── ES.png │ │ ├── FI.png │ │ ├── FR.png │ │ ├── GA.png │ │ ├── GB.png │ │ ├── GM.png │ │ ├── GT.png │ │ ├── HN.png │ │ ├── HT.png │ │ ├── HU.png │ │ ├── ID.png │ │ ├── IE.png │ │ ├── IL.png │ │ ├── IN.png │ │ ├── IQ.png │ │ ├── IR.png │ │ ├── IT.png │ │ ├── JM.png │ │ ├── JO.png │ │ ├── JP.png │ │ ├── KG.png │ │ ├── KN.png │ │ ├── KP.png │ │ ├── KR.png │ │ ├── KW.png │ │ ├── KZ.png │ │ ├── LA.png │ │ ├── LB.png │ │ ├── LC.png │ │ ├── LS.png │ │ ├── LU.png │ │ ├── LV.png │ │ ├── MG.png │ │ ├── MK.png │ │ ├── ML.png │ │ ├── MM.png │ │ ├── MT.png │ │ ├── MX.png │ │ ├── NA.png │ │ ├── NE.png │ │ ├── NG.png │ │ ├── NI.png │ │ ├── NL.png │ │ ├── NO.png │ │ ├── OM.png │ │ ├── PA.png │ │ ├── PE.png │ │ ├── PG.png │ │ ├── PK.png │ │ ├── PL.png │ │ ├── PT.png │ │ ├── PY.png │ │ ├── QA.png │ │ ├── RO.png │ │ ├── RU.png │ │ ├── RW.png │ │ ├── SA.png │ │ ├── SE.png │ │ ├── SG.png │ │ ├── SL.png │ │ ├── SN.png │ │ ├── SO.png │ │ ├── SV.png │ │ ├── TD.png │ │ ├── TJ.png │ │ ├── TL.png │ │ ├── TR.png │ │ ├── TZ.png │ │ ├── UA.png │ │ ├── US.png │ │ ├── VE.png │ │ ├── VN.png │ │ └── YE.png │ ├── header.jpg │ ├── hero-image-1.png │ ├── hero-image-2.png │ ├── hero-image-3.png │ ├── invision-white-slim.png │ ├── julie.jpg │ ├── landing.jpg │ ├── login.jpg │ ├── logo-square.jpg │ ├── logo.png │ ├── now-logo.png │ ├── nucleo-logo.svg │ ├── profile.jpg │ └── ryan.jpg ├── js │ ├── core │ │ ├── bootstrap.min.js │ │ ├── jquery.min.js │ │ └── popper.min.js │ ├── now-ui-kit.js │ ├── now-ui-kit.js.map │ ├── now-ui-kit.min.js │ └── plugins │ │ ├── bootstrap-datepicker.js │ │ ├── bootstrap-switch.js │ │ └── nouislider.min.js └── scss │ ├── now-ui-kit.scss │ └── now-ui-kit │ ├── _alerts.scss │ ├── _badges.scss │ ├── _buttons.scss │ ├── _cards.scss │ ├── _carousel.scss │ ├── _checkboxes-radio.scss │ ├── _dropdown.scss │ ├── _example-pages.scss │ ├── _footers.scss │ ├── _images.scss │ ├── _inputs.scss │ ├── _misc.scss │ ├── _mixins.scss │ ├── _modals.scss │ ├── _navbar.scss │ ├── _nucleo-outline.scss │ ├── _pagination.scss │ ├── _pills.scss │ ├── _popups.scss │ ├── _progress.scss │ ├── _responsive.scss │ ├── _sections.scss │ ├── _tabs.scss │ ├── _typography.scss │ ├── _variables.scss │ ├── cards │ ├── _card-plain.scss │ └── _card-signup.scss │ ├── mixins │ ├── _badges.scss │ ├── _buttons.scss │ ├── _cards.scss │ ├── _datepicker.scss │ ├── _dropdown.scss │ ├── _inputs.scss │ ├── _modals.scss │ ├── _navbar.scss │ ├── _pages.scss │ ├── _popovers.scss │ ├── _transparency.scss │ └── _vendor-prefixes.scss │ └── plugins │ ├── _plugin-bootstrap-switch.scss │ ├── _plugin-datepicker.scss │ ├── _plugin-nouislider.scss │ └── _plugin-perfect-scrollbar.scss ├── docs └── documentation.html ├── examples ├── landing-page.html ├── login-page.html └── profile-page.html ├── genezio.yaml ├── gulpfile.js ├── index.html ├── nucleo-icons.html └── package.json /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | name: Autocloser 2 | on: [issues] 3 | jobs: 4 | autoclose: 5 | runs-on: ubuntu-latest 6 | steps: 7 | - name: Issue auto-closer 8 | uses: roots/issue-closer-action@v1.1 9 | with: 10 | repo-token: ${{ secrets.GITHUB_TOKEN }} 11 | issue-close-message: "@${issue.user.login} this issue was automatically closed because it did not follow the bellow rules:\n\n
\n\n\n\nIMPORTANT: Please use the following link to create a new issue:\n\nhttps://www.creative-tim.com/new-issue/now-ui-kit\n\n**If your issue was not created using the app above, it will be closed immediately.**\n\n\n\nLove Creative Tim? Do you need Angular, React, Vuejs or HTML? You can visit:\n👉  https://www.creative-tim.com/bundles\n👉  https://www.creative-tim.com\n\n\n
\n\n" 12 | issue-pattern: (\#\#\# Version([\S\s.*]*?)\#\#\# Reproduction link([\S\s.*]*?)\#\#\# Operating System([\S\s.*]*?)\#\#\# Device([\S\s.*]*?)\#\#\# Browser & Version([\S\s.*]*?)\#\#\# Steps to reproduce([\S\s.*]*?)\#\#\# What is expected([\S\s.*]*?)\#\#\# What is actually happening([\S\s.*]*?)---([\S\s.*]*?)\#\#\# Solution([\S\s.*]*?)\#\#\# Additional comments([\S\s.*]*?)\<\!-- generated by creative-tim-issues\. DO NOT REMOVE --\>)|(\#\#\# What is your enhancement([\S\s.*]*?)\<\!-- generated by creative-tim-issues\. DO NOT REMOVE --\>) 13 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | ## [1.3.0] 2019-04-12 4 | ### Bugfixing & Bootstrap 4.3.1 integration 5 | - Bootstrap Switch library updated 6 | - NoUiSlider library updated 7 | 8 | ## [1.2.0] 2018-07-31 9 | ### Bugfixing & Bootstrap 4.1.1 integration 10 | - Added section `How to enable Burger Menu` in Docs 11 | - Added section `Visual Inspector` in Docs 12 | - Added new documentation layout 13 | - Updates for `NoUISlider` to the latest version 14 | - Datepicker select date fixed 15 | - Fixed burger-menu 16 | - IE lateral scrolling fixed 17 | - Github issues 18 | - Other bug fixes 19 | 20 | ## [1.1.0] 2017-08-30 21 | ### Bootstrap 4 Beta 22 | - Changed the library Tether.js with Popper.js 23 | - Renamed the old classes from Bootstrap 4 Alpha with the new Bootstrap 4 Beta classes 24 | - Small bug fixes 25 | - Added burger menu with sidebar menu for desktop/tablet (used to be only in mobile) 26 | - Options for regular Bootstrap Collapse Navbar (using class `.bootstrap-collapse` on ``) and Sidebar Collapse Navbar (using class `.css-collapse` on ``) 27 | 28 | ## [1.0.1] 2017-06-28 29 | ### Icons Update 30 | - Changed source files for the icons, optimized from 2MB to 100KB 31 | 32 | ## [1.0.0] 2017-05-16 33 | ### Original Release 34 | -------------------------------------------------------------------------------- /ISSUE_TEMPLATE.md: -------------------------------------------------------------------------------- 1 | 8 | 9 | 14 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 Creative Tim 4 | 5 | Designed by Invision (https://www.invisionapp.com). Coded by Creative Tim (https://www.creative-tim.com/) 6 | 7 | Permission is hereby granted, free of charge, to any person obtaining a copy 8 | of this software and associated documentation files (the "Software"), to deal 9 | in the Software without restriction, including without limitation the rights 10 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 11 | copies of the Software, and to permit persons to whom the Software is 12 | furnished to do so, subject to the following conditions: 13 | 14 | The above copyright notice and this permission notice shall be included in all 15 | copies or substantial portions of the Software. 16 | 17 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 18 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 19 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 20 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 21 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 22 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 23 | SOFTWARE. 24 | -------------------------------------------------------------------------------- /assets/demo/demo.css: -------------------------------------------------------------------------------- 1 | .tim-row { 2 | margin-bottom: 20px; 3 | } 4 | 5 | .tim-white-buttons { 6 | background-color: #777777; 7 | } 8 | 9 | .typography-line { 10 | padding-left: 25%; 11 | margin-bottom: 35px; 12 | position: relative; 13 | display: block; 14 | width: 100%; 15 | } 16 | 17 | .pick-class-label { 18 | border-radius: 8px; 19 | border: 1px solid #E3E3E3; 20 | color: #ffffff; 21 | cursor: pointer; 22 | display: inline-block; 23 | font-size: 75%; 24 | font-weight: bold; 25 | line-height: 1; 26 | margin-right: 10px; 27 | padding: 23px; 28 | text-align: center; 29 | vertical-align: baseline; 30 | white-space: nowrap; 31 | } 32 | 33 | .offline-doc .page-header { 34 | display: flex; 35 | align-items: center; 36 | } 37 | 38 | .typography-line span { 39 | bottom: 10px; 40 | color: #c0c1c2; 41 | display: block; 42 | font-weight: 400; 43 | font-size: 13px; 44 | line-height: 13px; 45 | left: 0; 46 | margin-left: 20px; 47 | position: absolute; 48 | width: 260px; 49 | text-transform: none; 50 | } 51 | 52 | .tim-row { 53 | padding-top: 60px; 54 | } 55 | 56 | .tim-row h3 { 57 | margin-top: 0; 58 | } 59 | 60 | .switch { 61 | margin-right: 20px; 62 | } 63 | 64 | #navbar-full .navbar { 65 | border-radius: 0 !important; 66 | margin-bottom: 15px; 67 | z-index: 2; 68 | } 69 | 70 | #menu-dropdown .navbar { 71 | border-radius: 3px; 72 | } 73 | 74 | #pagination-row .pagination-container { 75 | height: 100%; 76 | max-height: 100%; 77 | display: flex; 78 | align-items: center; 79 | } 80 | 81 | #icons-row i.now-ui-icons { 82 | font-size: 30px; 83 | } 84 | 85 | .space { 86 | height: 130px; 87 | display: block; 88 | } 89 | 90 | .space-110 { 91 | height: 110px; 92 | display: block; 93 | } 94 | 95 | .space-50 { 96 | height: 50px; 97 | display: block; 98 | } 99 | 100 | .space-70 { 101 | height: 70px; 102 | display: block; 103 | } 104 | 105 | .navigation-example .img-src { 106 | background-attachment: scroll; 107 | } 108 | 109 | .navigation-example { 110 | background-position: center center; 111 | background-size: cover; 112 | margin-top: 0; 113 | min-height: 740px; 114 | height: 100%; 115 | } 116 | 117 | #notifications { 118 | background-color: #FFFFFF; 119 | display: block; 120 | width: 100%; 121 | position: relative; 122 | } 123 | 124 | .tim-note { 125 | text-transform: capitalize; 126 | } 127 | 128 | #buttons .btn, 129 | #javascriptComponents .btn { 130 | margin: 0 0px 10px; 131 | } 132 | 133 | .space-100 { 134 | height: 100px; 135 | display: block; 136 | width: 100%; 137 | } 138 | 139 | .be-social { 140 | padding-bottom: 20px; 141 | /* border-bottom: 1px solid #aaa; */ 142 | margin: 0 auto 40px; 143 | } 144 | 145 | .txt-white { 146 | color: #FFFFFF; 147 | } 148 | 149 | .txt-gray { 150 | color: #ddd !important; 151 | } 152 | 153 | .parallax { 154 | width: 100%; 155 | height: 570px; 156 | display: block; 157 | background-attachment: fixed; 158 | background-repeat: no-repeat; 159 | background-size: cover; 160 | background-position: center center; 161 | } 162 | 163 | .logo-container .logo { 164 | overflow: hidden; 165 | border-radius: 50%; 166 | border: 1px solid #333333; 167 | width: 50px; 168 | float: left; 169 | } 170 | 171 | .logo-container .brand { 172 | font-size: 16px; 173 | color: #FFFFFF; 174 | line-height: 18px; 175 | float: left; 176 | margin-left: 10px; 177 | margin-top: 7px; 178 | width: 70px; 179 | height: 40px; 180 | text-align: left; 181 | } 182 | 183 | .logo-container .brand-material { 184 | font-size: 18px; 185 | margin-top: 15px; 186 | height: 25px; 187 | width: auto; 188 | } 189 | 190 | .logo-container .logo img { 191 | width: 100%; 192 | } 193 | 194 | .navbar-small .logo-container .brand { 195 | color: #333333; 196 | } 197 | 198 | .fixed-section { 199 | top: 90px; 200 | max-height: 80vh; 201 | overflow: scroll; 202 | position: sticky; 203 | } 204 | 205 | .fixed-section ul { 206 | padding: 0; 207 | } 208 | 209 | .fixed-section ul li { 210 | list-style: none; 211 | } 212 | 213 | .fixed-section li a { 214 | font-size: 14px; 215 | padding: 2px; 216 | display: block; 217 | color: #666666; 218 | } 219 | 220 | .fixed-section li a.active { 221 | color: #00bbff; 222 | } 223 | 224 | .fixed-section.float { 225 | position: fixed; 226 | top: 100px; 227 | width: 200px; 228 | margin-top: 0; 229 | } 230 | 231 | .parallax .parallax-image { 232 | width: 100%; 233 | overflow: hidden; 234 | position: absolute; 235 | } 236 | 237 | .parallax .parallax-image img { 238 | width: 100%; 239 | } 240 | 241 | @media (max-width: 768px) { 242 | .parallax .parallax-image { 243 | width: 100%; 244 | height: 640px; 245 | overflow: hidden; 246 | } 247 | .parallax .parallax-image img { 248 | height: 100%; 249 | width: auto; 250 | } 251 | } 252 | 253 | /*.separator{ 254 | content: "Separator"; 255 | color: #FFFFFF; 256 | display: block; 257 | width: 100%; 258 | padding: 20px; 259 | } 260 | .separator-line{ 261 | background-color: #EEE; 262 | height: 1px; 263 | width: 100%; 264 | display: block; 265 | } 266 | .separator.separator-gray{ 267 | background-color: #EEEEEE; 268 | }*/ 269 | 270 | .social-buttons-demo .btn { 271 | margin-right: 5px; 272 | margin-bottom: 7px; 273 | } 274 | 275 | .img-container { 276 | width: 100%; 277 | overflow: hidden; 278 | } 279 | 280 | .img-container img { 281 | width: 100%; 282 | } 283 | 284 | .lightbox img { 285 | width: 100%; 286 | } 287 | 288 | .lightbox .modal-content { 289 | overflow: hidden; 290 | } 291 | 292 | .lightbox .modal-body { 293 | padding: 0; 294 | } 295 | 296 | @media screen and (min-width: 991px) { 297 | .lightbox .modal-dialog { 298 | width: 960px; 299 | } 300 | } 301 | 302 | @media (max-width: 991px) { 303 | .fixed-section.affix { 304 | position: relative; 305 | margin-bottom: 100px; 306 | } 307 | } 308 | 309 | @media (max-width: 768px) { 310 | .btn, 311 | .btn-morphing { 312 | margin-bottom: 10px; 313 | } 314 | .parallax .motto { 315 | top: 170px; 316 | margin-top: 0; 317 | font-size: 60px; 318 | width: 270px; 319 | } 320 | } 321 | 322 | /* Loading dots */ 323 | 324 | /* transitions */ 325 | 326 | .presentation .front, 327 | .presentation .front:after, 328 | .presentation .front .btn, 329 | .logo-container .logo, 330 | .logo-container .brand { 331 | -webkit-transition: all .2s; 332 | -moz-transition: all .2s; 333 | -o-transition: all .2s; 334 | transition: all .2s; 335 | } 336 | 337 | #images h4 { 338 | margin-bottom: 30px; 339 | } 340 | 341 | #javascriptComponents { 342 | padding-bottom: 0; 343 | } 344 | 345 | /* layer animation */ 346 | 347 | .layers-container { 348 | display: block; 349 | margin-top: 50px; 350 | position: relative; 351 | } 352 | 353 | .layers-container img { 354 | position: absolute; 355 | width: 100%; 356 | height: auto; 357 | top: 0; 358 | left: 0; 359 | text-align: center; 360 | } 361 | 362 | .animate { 363 | transition: 1.5s ease-in-out; 364 | -moz-transition: 1.5s ease-in-out; 365 | -webkit-transition: 1.5s ease-in-out; 366 | } 367 | 368 | .navbar-default.navbar-small .logo-container .brand { 369 | color: #333333; 370 | } 371 | 372 | .navbar-transparent.navbar-small .logo-container .brand { 373 | color: #FFFFFF; 374 | } 375 | 376 | .navbar-default.navbar-small .logo-container .brand { 377 | color: #333333; 378 | } 379 | 380 | .sharing-area { 381 | margin-top: 80px; 382 | } 383 | 384 | .sharing-area .btn { 385 | margin: 15px 4px 0; 386 | } 387 | 388 | .section-thin, 389 | .section-notifications { 390 | padding: 0; 391 | } 392 | 393 | .section-navbars { 394 | padding-top: 0; 395 | } 396 | 397 | #navbar .navbar { 398 | margin-bottom: 20px; 399 | } 400 | 401 | #navbar .navbar-toggler, 402 | #menu-dropdown .navbar-toggler { 403 | pointer-events: none; 404 | } 405 | 406 | .section-tabs { 407 | background: #EEEEEE; 408 | } 409 | 410 | .section-pagination { 411 | padding-bottom: 0; 412 | } 413 | 414 | .section-download { 415 | padding-top: 130px; 416 | } 417 | 418 | .section-download .description { 419 | margin-bottom: 60px; 420 | } 421 | 422 | .section-download h4 { 423 | margin-bottom: 25px; 424 | } 425 | 426 | .section-examples a { 427 | text-decoration: none; 428 | } 429 | 430 | .section-examples a+a { 431 | margin-top: 30px; 432 | } 433 | 434 | .section-examples h5 { 435 | margin-top: 30px; 436 | } 437 | 438 | .components-page .wrapper>.header, 439 | .tutorial-page .wrapper>.header { 440 | height: 500px; 441 | padding-top: 128px; 442 | background-size: cover; 443 | background-position: center center; 444 | } 445 | 446 | .components-page .title, 447 | .tutorial-page .title { 448 | color: #FFFFFF; 449 | } 450 | 451 | .brand .h1-seo { 452 | font-size: 2.8em; 453 | text-transform: uppercase; 454 | font-weight: 300; 455 | } 456 | 457 | .brand .n-logo { 458 | max-width: 100px; 459 | margin-bottom: 40px; 460 | } 461 | 462 | .invision-logo { 463 | max-width: 70px; 464 | top: -2px; 465 | position: relative; 466 | } 467 | 468 | .creative-tim-logo { 469 | max-width: 140px; 470 | top: -2px; 471 | position: relative; 472 | } 473 | 474 | .section-javascript .title { 475 | margin-bottom: 0; 476 | } 477 | 478 | .navbar .switch-background { 479 | display: block; 480 | } 481 | 482 | .navbar-transparent .switch-background { 483 | display: none; 484 | } 485 | 486 | .section-signup .col .btn { 487 | margin-top: 30px; 488 | } 489 | 490 | #buttons-row .btn { 491 | margin-bottom: 10px; 492 | } 493 | 494 | .section-basic { 495 | padding-top: 0; 496 | } 497 | 498 | .section-images { 499 | padding-bottom: 0; 500 | } 501 | 502 | @media screen and (max-width: 991px) { 503 | .section-navbars .navbar-collapse { 504 | display: none !important; 505 | } 506 | } -------------------------------------------------------------------------------- /assets/fonts/nucleo-license.md: -------------------------------------------------------------------------------- 1 | # Standard License - nucleoapp.com 2 | 3 | Github repo: https://github.com/NucleoApp/license-standard 4 | 5 | By purchasing Nucleo you are being granted a license to use Nucleo icons (including the custom Nucleo icons created through the Nucleo applications) for specific uses under certain conditions. 6 | 7 | You have rights to use Nucleo icons in unlimited personal and commercial projects for yourself or a client. Even if you don't renew the Basic license, you can still use the source files for as many projects as you want. 8 | 9 | For each project, you can use a maximum of 250 Nucleo icons (intended per unique style: for example if you're using the same icon in both the outline and glyph styles, or in 2 different sizes, you're using 2 icons). 10 | 11 | By purchasing Nucleo, you have the right to: 12 | 13 | - Use Nucleo icons in unlimited personal and commercial projects. 14 | - Use Nucleo icons in application/website/print/mobile/logo design. 15 | - Modify Nucleo icons to create you own icon variations. 16 | 17 | You don't have the right to: 18 | 19 | - Sublicense, resell, share, transfer, or otherwise redistribute Nucleo icons (even for free or within a more complex downloadable file). 20 | - Use more than 250 Nucleo icons in a single project. 21 | - Use Nucleo icons in a product that is directly competitive with Nucleo. 22 | 23 | ## Freelance Projects & Contracted work 24 | If you’re working on one or more projects for a client, you can share with your client a maximum of 250 Nucleo icons per project. You can’t share Nucleo source files, unless the client purchases a Nucleo license. 25 | 26 | If the End Product you (or the team you’ve been part of) have created for the client is a product offered for sale, and the Nucleo icons contribute to the core value of the product being sold/shared, your client will have to buy an Extended License. 27 | 28 | ## End Product Users 29 | If you're using Nucleo icons in apps, installable items or online products/services, there's no limit to the number of users/customers that can use the product you're developing (e.g. if you're developing a web application and you're using Nucleo icons throughout the design, there's no limit to the number of active users of the application). 30 | 31 | ## Templates, Themes, UI Kits & Plugins 32 | If you’re using Nucleo icons in templates, themes or plugins offered for sale, or for free, (e.g. UI kits, Wordpress Themes, HTML/CSS Templates), you can include up to 100 icons in the downloadable source files. This limitation applies to the icon fonts as well. 33 | 34 | The downloadable source file has to include [Nucleo license](https://github.com/NucleoApp/license-standard). No attribution or link back required, however any credit will be much appreciated. 35 | 36 | If Nucleo icons contribute to the core value of the template, theme or plugin sold/shared (e.g. a theme builder where users can browse Nucleo icons and pick the ones to include in their design), you will need an Extended License. 37 | 38 | ## Open source projects 39 | If you’re using Nucleo icons in open source projects, you can include up to 100 icons in the downloadable source files. This limitation applies to the icon fonts as well. 40 | 41 | The downloadable source file has to include [Nucleo license](https://github.com/NucleoApp/license-standard). No attribution or link back required, however any credit will be much appreciated. 42 | 43 | If Nucleo icons contribute to the core value of the open source project (e.g. a CMS where users can browse Nucleo icons and pick the ones to include in their design), you will need an Extended License. 44 | 45 | ## Extended License 46 | If you're interested in using Nucleo icons in items offered for sale (or for free) where the Nucleo icons contribute to the core value of the product being sold/shared, you will need an Extended License. 47 | 48 | By purchasing an Extended License, you’re also granted the right to: 49 | 50 | - Use up to 500 icons in a single project (the one you’re purchasing the Extended License for) if the users/customers can access Nucleo source files (e.g. Nucleo icons are stored in a folder inside the downloadable file). 51 | - Use unlimited icons if the users/customers cannot access Nucleo source files (e.g. Nucleo icons are encrypted and user can only use icons throughout the application). 52 | 53 | The downloadable source file has to include [Nucleo Standard License](https://github.com/NucleoApp/license-standard), as well as Nucleo Extended License. 54 | 55 | Example of products offered for sale (or for free) where Nucleo contributes to the core value of the product being sold/shared: 56 | 57 | - Logo builder application that combines Nucleo icons to create a logo 58 | - Theme builder where users can browse Nucleo icons and pick the ones to include in their design. 59 | - Application used to create presentations, where users can pick Nucleo icons through the built-in presentation builder. 60 | 61 | If you’re still unclear about what is or isn’t allowed under this license, please contact us at info@nucleoapp.com. 62 | -------------------------------------------------------------------------------- /assets/fonts/nucleo-outline.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/fonts/nucleo-outline.eot -------------------------------------------------------------------------------- /assets/fonts/nucleo-outline.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/fonts/nucleo-outline.ttf -------------------------------------------------------------------------------- /assets/fonts/nucleo-outline.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/fonts/nucleo-outline.woff -------------------------------------------------------------------------------- /assets/fonts/nucleo-outline.woff2: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/fonts/nucleo-outline.woff2 -------------------------------------------------------------------------------- /assets/img/apple-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/apple-icon.png -------------------------------------------------------------------------------- /assets/img/avatar.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/avatar.jpg -------------------------------------------------------------------------------- /assets/img/bg1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg1.jpg -------------------------------------------------------------------------------- /assets/img/bg11.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg11.jpg -------------------------------------------------------------------------------- /assets/img/bg3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg3.jpg -------------------------------------------------------------------------------- /assets/img/bg4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg4.jpg -------------------------------------------------------------------------------- /assets/img/bg5.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg5.jpg -------------------------------------------------------------------------------- /assets/img/bg6.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg6.jpg -------------------------------------------------------------------------------- /assets/img/bg7.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg7.jpg -------------------------------------------------------------------------------- /assets/img/bg8.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/bg8.jpg -------------------------------------------------------------------------------- /assets/img/blurred-image-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/blurred-image-1.jpg -------------------------------------------------------------------------------- /assets/img/creative-tim-white-slim2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/creative-tim-white-slim2.png -------------------------------------------------------------------------------- /assets/img/default-avatar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/default-avatar.png -------------------------------------------------------------------------------- /assets/img/eva.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/eva.jpg -------------------------------------------------------------------------------- /assets/img/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/favicon.png -------------------------------------------------------------------------------- /assets/img/flags/AD.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AD.png -------------------------------------------------------------------------------- /assets/img/flags/AE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AE.png -------------------------------------------------------------------------------- /assets/img/flags/AG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AG.png -------------------------------------------------------------------------------- /assets/img/flags/AM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AM.png -------------------------------------------------------------------------------- /assets/img/flags/AR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AR.png -------------------------------------------------------------------------------- /assets/img/flags/AT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AT.png -------------------------------------------------------------------------------- /assets/img/flags/AU.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/AU.png -------------------------------------------------------------------------------- /assets/img/flags/BE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/BE.png -------------------------------------------------------------------------------- /assets/img/flags/BF.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/BF.png -------------------------------------------------------------------------------- /assets/img/flags/BG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/BG.png -------------------------------------------------------------------------------- /assets/img/flags/BO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/BO.png -------------------------------------------------------------------------------- /assets/img/flags/BR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/BR.png -------------------------------------------------------------------------------- /assets/img/flags/CA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CA.png -------------------------------------------------------------------------------- /assets/img/flags/CD.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CD.png -------------------------------------------------------------------------------- /assets/img/flags/CG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CG.png -------------------------------------------------------------------------------- /assets/img/flags/CH.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CH.png -------------------------------------------------------------------------------- /assets/img/flags/CL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CL.png -------------------------------------------------------------------------------- /assets/img/flags/CM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CM.png -------------------------------------------------------------------------------- /assets/img/flags/CN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CN.png -------------------------------------------------------------------------------- /assets/img/flags/CO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CO.png -------------------------------------------------------------------------------- /assets/img/flags/CZ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/CZ.png -------------------------------------------------------------------------------- /assets/img/flags/DE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/DE.png -------------------------------------------------------------------------------- /assets/img/flags/DJ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/DJ.png -------------------------------------------------------------------------------- /assets/img/flags/DK.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/DK.png -------------------------------------------------------------------------------- /assets/img/flags/DZ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/DZ.png -------------------------------------------------------------------------------- /assets/img/flags/EE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/EE.png -------------------------------------------------------------------------------- /assets/img/flags/EG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/EG.png -------------------------------------------------------------------------------- /assets/img/flags/ES.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/ES.png -------------------------------------------------------------------------------- /assets/img/flags/FI.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/FI.png -------------------------------------------------------------------------------- /assets/img/flags/FR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/FR.png -------------------------------------------------------------------------------- /assets/img/flags/GA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/GA.png -------------------------------------------------------------------------------- /assets/img/flags/GB.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/GB.png -------------------------------------------------------------------------------- /assets/img/flags/GM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/GM.png -------------------------------------------------------------------------------- /assets/img/flags/GT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/GT.png -------------------------------------------------------------------------------- /assets/img/flags/HN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/HN.png -------------------------------------------------------------------------------- /assets/img/flags/HT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/HT.png -------------------------------------------------------------------------------- /assets/img/flags/HU.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/HU.png -------------------------------------------------------------------------------- /assets/img/flags/ID.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/ID.png -------------------------------------------------------------------------------- /assets/img/flags/IE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IE.png -------------------------------------------------------------------------------- /assets/img/flags/IL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IL.png -------------------------------------------------------------------------------- /assets/img/flags/IN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IN.png -------------------------------------------------------------------------------- /assets/img/flags/IQ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IQ.png -------------------------------------------------------------------------------- /assets/img/flags/IR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IR.png -------------------------------------------------------------------------------- /assets/img/flags/IT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/IT.png -------------------------------------------------------------------------------- /assets/img/flags/JM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/JM.png -------------------------------------------------------------------------------- /assets/img/flags/JO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/JO.png -------------------------------------------------------------------------------- /assets/img/flags/JP.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/JP.png -------------------------------------------------------------------------------- /assets/img/flags/KG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KG.png -------------------------------------------------------------------------------- /assets/img/flags/KN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KN.png -------------------------------------------------------------------------------- /assets/img/flags/KP.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KP.png -------------------------------------------------------------------------------- /assets/img/flags/KR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KR.png -------------------------------------------------------------------------------- /assets/img/flags/KW.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KW.png -------------------------------------------------------------------------------- /assets/img/flags/KZ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/KZ.png -------------------------------------------------------------------------------- /assets/img/flags/LA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LA.png -------------------------------------------------------------------------------- /assets/img/flags/LB.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LB.png -------------------------------------------------------------------------------- /assets/img/flags/LC.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LC.png -------------------------------------------------------------------------------- /assets/img/flags/LS.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LS.png -------------------------------------------------------------------------------- /assets/img/flags/LU.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LU.png -------------------------------------------------------------------------------- /assets/img/flags/LV.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/LV.png -------------------------------------------------------------------------------- /assets/img/flags/MG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/MG.png -------------------------------------------------------------------------------- /assets/img/flags/MK.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/MK.png -------------------------------------------------------------------------------- /assets/img/flags/ML.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/ML.png -------------------------------------------------------------------------------- /assets/img/flags/MM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/MM.png -------------------------------------------------------------------------------- /assets/img/flags/MT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/MT.png -------------------------------------------------------------------------------- /assets/img/flags/MX.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/MX.png -------------------------------------------------------------------------------- /assets/img/flags/NA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NA.png -------------------------------------------------------------------------------- /assets/img/flags/NE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NE.png -------------------------------------------------------------------------------- /assets/img/flags/NG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NG.png -------------------------------------------------------------------------------- /assets/img/flags/NI.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NI.png -------------------------------------------------------------------------------- /assets/img/flags/NL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NL.png -------------------------------------------------------------------------------- /assets/img/flags/NO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/NO.png -------------------------------------------------------------------------------- /assets/img/flags/OM.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/OM.png -------------------------------------------------------------------------------- /assets/img/flags/PA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PA.png -------------------------------------------------------------------------------- /assets/img/flags/PE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PE.png -------------------------------------------------------------------------------- /assets/img/flags/PG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PG.png -------------------------------------------------------------------------------- /assets/img/flags/PK.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PK.png -------------------------------------------------------------------------------- /assets/img/flags/PL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PL.png -------------------------------------------------------------------------------- /assets/img/flags/PT.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PT.png -------------------------------------------------------------------------------- /assets/img/flags/PY.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/PY.png -------------------------------------------------------------------------------- /assets/img/flags/QA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/QA.png -------------------------------------------------------------------------------- /assets/img/flags/RO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/RO.png -------------------------------------------------------------------------------- /assets/img/flags/RU.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/RU.png -------------------------------------------------------------------------------- /assets/img/flags/RW.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/RW.png -------------------------------------------------------------------------------- /assets/img/flags/SA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SA.png -------------------------------------------------------------------------------- /assets/img/flags/SE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SE.png -------------------------------------------------------------------------------- /assets/img/flags/SG.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SG.png -------------------------------------------------------------------------------- /assets/img/flags/SL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SL.png -------------------------------------------------------------------------------- /assets/img/flags/SN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SN.png -------------------------------------------------------------------------------- /assets/img/flags/SO.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SO.png -------------------------------------------------------------------------------- /assets/img/flags/SV.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/SV.png -------------------------------------------------------------------------------- /assets/img/flags/TD.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/TD.png -------------------------------------------------------------------------------- /assets/img/flags/TJ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/TJ.png -------------------------------------------------------------------------------- /assets/img/flags/TL.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/TL.png -------------------------------------------------------------------------------- /assets/img/flags/TR.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/TR.png -------------------------------------------------------------------------------- /assets/img/flags/TZ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/TZ.png -------------------------------------------------------------------------------- /assets/img/flags/UA.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/UA.png -------------------------------------------------------------------------------- /assets/img/flags/US.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/US.png -------------------------------------------------------------------------------- /assets/img/flags/VE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/VE.png -------------------------------------------------------------------------------- /assets/img/flags/VN.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/VN.png -------------------------------------------------------------------------------- /assets/img/flags/YE.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/flags/YE.png -------------------------------------------------------------------------------- /assets/img/header.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/header.jpg -------------------------------------------------------------------------------- /assets/img/hero-image-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/hero-image-1.png -------------------------------------------------------------------------------- /assets/img/hero-image-2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/hero-image-2.png -------------------------------------------------------------------------------- /assets/img/hero-image-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/hero-image-3.png -------------------------------------------------------------------------------- /assets/img/invision-white-slim.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/invision-white-slim.png -------------------------------------------------------------------------------- /assets/img/julie.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/julie.jpg -------------------------------------------------------------------------------- /assets/img/landing.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/landing.jpg -------------------------------------------------------------------------------- /assets/img/login.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/login.jpg -------------------------------------------------------------------------------- /assets/img/logo-square.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/logo-square.jpg -------------------------------------------------------------------------------- /assets/img/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/logo.png -------------------------------------------------------------------------------- /assets/img/now-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/now-logo.png -------------------------------------------------------------------------------- /assets/img/nucleo-logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 6 | 7 | 11 | 15 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /assets/img/profile.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/profile.jpg -------------------------------------------------------------------------------- /assets/img/ryan.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/creativetimofficial/now-ui-kit/80acd1717f3c4f9a791ca47219b4a8b09fbd0daa/assets/img/ryan.jpg -------------------------------------------------------------------------------- /assets/js/now-ui-kit.js: -------------------------------------------------------------------------------- 1 | /*! 2 | 3 | ========================================================= 4 | * Now UI Kit - v1.3.0 5 | ========================================================= 6 | 7 | * Product Page: https://www.creative-tim.com/product/now-ui-kit 8 | * Copyright 2019 Creative Tim (http://www.creative-tim.com) 9 | 10 | * Designed by www.invisionapp.com Coded by www.creative-tim.com 11 | 12 | ========================================================= 13 | 14 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 15 | 16 | */ 17 | 18 | 19 | var transparent = true; 20 | var big_image; 21 | 22 | var transparentDemo = true; 23 | var fixedTop = false; 24 | 25 | var navbar_initialized, 26 | backgroundOrange = false, 27 | toggle_initialized = false; 28 | 29 | var nowuiKit, 30 | $navbar, 31 | scroll_distance, 32 | oVal; 33 | 34 | $(document).ready(function() { 35 | // Activate the Tooltips 36 | $('[data-toggle="tooltip"], [rel="tooltip"]').tooltip(); 37 | 38 | // Activate Popovers and set color for popovers 39 | $('[data-toggle="popover"]').each(function() { 40 | color_class = $(this).data('color'); 41 | $(this).popover({ 42 | template: '' 43 | }); 44 | }); 45 | 46 | // Activate the image for the navbar-collapse 47 | nowuiKit.initNavbarImage(); 48 | 49 | $navbar = $('.navbar[color-on-scroll]'); 50 | scroll_distance = $navbar.attr('color-on-scroll') || 500; 51 | 52 | // Check if we have the class "navbar-color-on-scroll" then add the function to remove the class "navbar-transparent" so it will transform to a plain color. 53 | 54 | if ($('.navbar[color-on-scroll]').length != 0) { 55 | nowuiKit.checkScrollForTransparentNavbar(); 56 | $(window).on('scroll', nowuiKit.checkScrollForTransparentNavbar) 57 | } 58 | 59 | $('.form-control').on("focus", function() { 60 | $(this).parent('.input-group').addClass("input-group-focus"); 61 | }).on("blur", function() { 62 | $(this).parent(".input-group").removeClass("input-group-focus"); 63 | }); 64 | 65 | // Activate bootstrapSwitch 66 | $('.bootstrap-switch').each(function() { 67 | $this = $(this); 68 | data_on_label = $this.data('on-label') || ''; 69 | data_off_label = $this.data('off-label') || ''; 70 | 71 | $this.bootstrapSwitch({ 72 | onText: data_on_label, 73 | offText: data_off_label 74 | }); 75 | }); 76 | 77 | if ($(window).width() >= 992) { 78 | big_image = $('.page-header-image[data-parallax="true"]'); 79 | 80 | $(window).on('scroll', nowuiKitDemo.checkScrollForParallax); 81 | } 82 | 83 | // Activate Carousel 84 | $('.carousel').carousel({ 85 | interval: 4000 86 | }); 87 | 88 | $('.date-picker').each(function() { 89 | $(this).datepicker({ 90 | templates: { 91 | leftArrow: '', 92 | rightArrow: '' 93 | } 94 | }).on('show', function() { 95 | $('.datepicker').addClass('open'); 96 | 97 | datepicker_color = $(this).data('datepicker-color'); 98 | if (datepicker_color.length != 0) { 99 | $('.datepicker').addClass('datepicker-' + datepicker_color + ''); 100 | } 101 | }).on('hide', function() { 102 | $('.datepicker').removeClass('open'); 103 | }); 104 | }); 105 | 106 | 107 | }); 108 | 109 | // Javascript just for Demo purpose, remove it from your project 110 | nowuiKitDemo = { 111 | checkScrollForParallax: debounce(function() { 112 | var current_scroll = $(this).scrollTop(); 113 | 114 | oVal = ($(window).scrollTop() / 3); 115 | big_image.css({ 116 | 'transform': 'translate3d(0,' + oVal + 'px,0)', 117 | '-webkit-transform': 'translate3d(0,' + oVal + 'px,0)', 118 | '-ms-transform': 'translate3d(0,' + oVal + 'px,0)', 119 | '-o-transform': 'translate3d(0,' + oVal + 'px,0)' 120 | }); 121 | 122 | }, 6) 123 | 124 | } 125 | 126 | // Returns a function, that, as long as it continues to be invoked, will not 127 | // be triggered. The function will be called after it stops being called for 128 | // N milliseconds. If `immediate` is passed, trigger the function on the 129 | // leading edge, instead of the trailing. 130 | 131 | function debounce(func, wait, immediate) { 132 | var timeout; 133 | return function() { 134 | var context = this, 135 | args = arguments; 136 | clearTimeout(timeout); 137 | timeout = setTimeout(function() { 138 | timeout = null; 139 | if (!immediate) func.apply(context, args); 140 | }, wait); 141 | if (immediate && !timeout) func.apply(context, args); 142 | }; 143 | }; 144 | 145 | $(window).on('resize', function() { 146 | nowuiKit.initNavbarImage(); 147 | }); 148 | 149 | $(document).on('click', '.navbar-toggler', function() { 150 | $toggle = $(this); 151 | 152 | if (nowuiKit.misc.navbar_menu_visible == 1) { 153 | $('html').removeClass('nav-open'); 154 | nowuiKit.misc.navbar_menu_visible = 0; 155 | $('#bodyClick').remove(); 156 | setTimeout(function() { 157 | $toggle.removeClass('toggled'); 158 | }, 550); 159 | } else { 160 | setTimeout(function() { 161 | $toggle.addClass('toggled'); 162 | }, 580); 163 | div = '
'; 164 | $(div).appendTo('body').click(function() { 165 | $('html').removeClass('nav-open'); 166 | nowuiKit.misc.navbar_menu_visible = 0; 167 | setTimeout(function() { 168 | $toggle.removeClass('toggled'); 169 | $('#bodyClick').remove(); 170 | }, 550); 171 | }); 172 | 173 | $('html').addClass('nav-open'); 174 | nowuiKit.misc.navbar_menu_visible = 1; 175 | } 176 | }); 177 | 178 | nowuiKit = { 179 | misc: { 180 | navbar_menu_visible: 0 181 | }, 182 | 183 | checkScrollForTransparentNavbar: debounce(function() { 184 | if ($(document).scrollTop() > scroll_distance) { 185 | if (transparent) { 186 | transparent = false; 187 | $('.navbar[color-on-scroll]').removeClass('navbar-transparent'); 188 | } 189 | } else { 190 | if (!transparent) { 191 | transparent = true; 192 | $('.navbar[color-on-scroll]').addClass('navbar-transparent'); 193 | } 194 | } 195 | }, 17), 196 | 197 | initNavbarImage: function() { 198 | var $navbar = $('.navbar').find('.navbar-translate').siblings('.navbar-collapse'); 199 | var background_image = $navbar.data('nav-image'); 200 | 201 | if (background_image != undefined) { 202 | if ($(window).width() < 991 || $('body').hasClass('burger-menu')) { 203 | $navbar.css('background', "url('" + background_image + "')") 204 | .removeAttr('data-nav-image') 205 | .css('background-size', "cover") 206 | .addClass('has-image'); 207 | } else { 208 | $navbar.css('background', "") 209 | .attr('data-nav-image', '' + background_image + '') 210 | .css('background-size', "") 211 | .removeClass('has-image'); 212 | } 213 | } 214 | }, 215 | 216 | initSliders: function() { 217 | // Sliders for demo purpose in refine cards section 218 | var slider = document.getElementById('sliderRegular'); 219 | 220 | noUiSlider.create(slider, { 221 | start: 40, 222 | connect: [true, false], 223 | range: { 224 | min: 0, 225 | max: 100 226 | } 227 | }); 228 | 229 | var slider2 = document.getElementById('sliderDouble'); 230 | 231 | noUiSlider.create(slider2, { 232 | start: [20, 60], 233 | connect: true, 234 | range: { 235 | min: 0, 236 | max: 100 237 | } 238 | }); 239 | } 240 | } 241 | 242 | // Javascript just for Demo purpose, remove it from your project 243 | nowuiKitDemo = { 244 | checkScrollForParallax: debounce(function() { 245 | var current_scroll = $(this).scrollTop(); 246 | 247 | oVal = ($(window).scrollTop() / 3); 248 | big_image.css({ 249 | 'transform': 'translate3d(0,' + oVal + 'px,0)', 250 | '-webkit-transform': 'translate3d(0,' + oVal + 'px,0)', 251 | '-ms-transform': 'translate3d(0,' + oVal + 'px,0)', 252 | '-o-transform': 'translate3d(0,' + oVal + 'px,0)' 253 | }); 254 | 255 | }, 6) 256 | 257 | } 258 | 259 | // Returns a function, that, as long as it continues to be invoked, will not 260 | // be triggered. The function will be called after it stops being called for 261 | // N milliseconds. If `immediate` is passed, trigger the function on the 262 | // leading edge, instead of the trailing. 263 | 264 | function debounce(func, wait, immediate) { 265 | var timeout; 266 | return function() { 267 | var context = this, 268 | args = arguments; 269 | clearTimeout(timeout); 270 | timeout = setTimeout(function() { 271 | timeout = null; 272 | if (!immediate) func.apply(context, args); 273 | }, wait); 274 | if (immediate && !timeout) func.apply(context, args); 275 | }; 276 | }; -------------------------------------------------------------------------------- /assets/js/now-ui-kit.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["_site_kit_free/assets/js/kit-free.js"],"names":["big_image","navbar_initialized","nowuiKit","$navbar","scroll_distance","oVal","transparent","transparentDemo","fixedTop","backgroundOrange","toggle_initialized","debounce","func","wait","immediate","timeout","context","this","args","arguments","clearTimeout","setTimeout","apply","$","document","ready","tooltip","each","color_class","data","popover","template","initNavbarImage","attr","length","checkScrollForTransparentNavbar","window","on","parent","addClass","removeClass","$this","data_on_label","data_off_label","bootstrapSwitch","onText","offText","width","nowuiKitDemo","checkScrollForParallax","carousel","interval","datepicker","templates","leftArrow","rightArrow","datepicker_color","scrollTop","css","transform","-webkit-transform","-ms-transform","-o-transform","$toggle","misc","navbar_menu_visible","remove","div","appendTo","click","find","siblings","background_image","undefined","hasClass","removeAttr","initSliders","slider","getElementById","noUiSlider","create","start","connect","range","min","max","slider2"],"mappings":"AAkBA,IACIA,UAKAC,mBAIAC,SACJC,QACAC,gBACAC,KAbIC,aAAc,EAGdC,iBAAkB,EAClBC,UAAW,EAGXC,kBAAmB,EACnBC,oBAAqB,EAwGzB,SAASC,SAASC,EAAMC,EAAMC,GAC7B,IAAIC,EACJ,OAAO,WACN,IAAIC,EAAUC,KAAMC,EAAOC,UAC3BC,aAAaL,GACbA,EAAUM,WAAW,WACpBN,EAAU,KACLD,GAAWF,EAAKU,MAAMN,EAASE,IAClCL,GACCC,IAAcC,GAASH,EAAKU,MAAMN,EAASE,IA2HjD,SAASP,SAASC,EAAMC,EAAMC,GAC7B,IAAIC,EACJ,OAAO,WACN,IAAIC,EAAUC,KAAMC,EAAOC,UAC3BC,aAAaL,GACbA,EAAUM,WAAW,WACpBN,EAAU,KACLD,GAAWF,EAAKU,MAAMN,EAASE,IAClCL,GACCC,IAAcC,GAASH,EAAKU,MAAMN,EAASE,IA9OjDK,EAAEC,UAAUC,MAAM,WAEdF,EAAE,4CAA4CG,UAG9CH,EAAE,2BAA2BI,KAAK,WAC9BC,YAAcL,EAAEN,MAAMY,KAAK,SAC3BN,EAAEN,MAAMa,QAAQ,CACZC,SAAU,+BAA+BH,YAAa,uHAK9D1B,SAAS8B,kBAET7B,QAAUoB,EAAE,4BACZnB,gBAAkBD,QAAQ8B,KAAK,oBAAsB,IAIV,GAAxCV,EAAE,4BAA4BW,SAC7BhC,SAASiC,kCACTZ,EAAEa,QAAQC,GAAG,SAAUnC,SAASiC,kCAGpCZ,EAAE,iBAAiBc,GAAG,QAAS,WAC3Bd,EAAEN,MAAMqB,OAAO,gBAAgBC,SAAS,uBACzCF,GAAG,OAAQ,WACVd,EAAEN,MAAMqB,OAAO,gBAAgBE,YAAY,uBAI/CjB,EAAE,qBAAqBI,KAAK,WACxBc,MAAQlB,EAAEN,MACVyB,cAAgBD,MAAMZ,KAAK,aAAe,GAC1Cc,eAAiBF,MAAMZ,KAAK,cAAgB,GAE5CY,MAAMG,gBAAgB,CAClBC,OAAQH,cACRI,QAASH,mBAIQ,KAArBpB,EAAEa,QAAQW,UACV/C,UAAYuB,EAAE,4CAEdA,EAAEa,QAAQC,GAAG,SAAUW,aAAaC,yBAI3C1B,EAAE,aAAa2B,SAAS,CACjBC,SAAU,MAGd5B,EAAE,gBAAgBI,KAAK,WACnBJ,EAAEN,MAAMmC,WAAW,CACfC,UAAU,CACNC,UAAW,qDACXC,WAAY,yDAEjBlB,GAAG,OAAQ,WACNd,EAAE,eAAegB,SAAS,QAE1BiB,iBAAmBjC,EAAEN,MAAMY,KAAK,oBACD,GAA3B2B,iBAAiBtB,QACjBX,EAAE,eAAegB,SAAS,cAAeiB,oBAE9CnB,GAAG,OAAQ,WACVd,EAAE,eAAeiB,YAAY,cAQ7CQ,aAAe,CACXC,uBAAwBtC,SAAS,WACRY,EAAEN,MAAMwC,YAE7BpD,KAAQkB,EAAEa,QAAQqB,YAAc,EAChCzD,UAAU0D,IAAI,CACVC,UAAY,iBAAmBtD,KAAM,QACrCuD,oBAAoB,iBAAmBvD,KAAM,QAC7CwD,gBAAgB,iBAAmBxD,KAAM,QACzCyD,eAAe,iBAAmBzD,KAAM,WAG7C,IAsBPkB,EAAEa,QAAQC,GAAG,SAAU,WACnBnC,SAAS8B,oBAGbT,EAAEC,UAAUa,GAAG,QAAS,kBAAmB,WACvC0B,QAAUxC,EAAEN,MAE4B,GAArCf,SAAS8D,KAAKC,qBACb1C,EAAE,QAAQiB,YAAY,YACvBtC,SAAS8D,KAAKC,oBAAsB,EACnC1C,EAAE,cAAc2C,SAChB7C,WAAW,WACR0C,QAAQvB,YAAY,YACrB,OAEHnB,WAAW,WACP0C,QAAQxB,SAAS,YAClB,KACH4B,IAAM,6BACN5C,EAAE4C,KAAKC,SAAS,QAAQC,MAAM,WAC1B9C,EAAE,QAAQiB,YAAY,YACtBtC,SAAS8D,KAAKC,oBAAsB,EACnC5C,WAAW,WACR0C,QAAQvB,YAAY,WACpBjB,EAAE,cAAc2C,UAChB,OAGT3C,EAAE,QAAQgB,SAAS,YAClBrC,SAAS8D,KAAKC,oBAAsB,KAI3C/D,SAAW,CACP8D,KAAK,CACDC,oBAAqB,GAGzB9B,gCAAiCxB,SAAS,WAC/BY,EAAEC,UAAUiC,YAAcrD,gBACtBE,cACCA,aAAc,EACdiB,EAAE,4BAA4BiB,YAAY,uBAGzClC,cACDA,aAAc,EACdiB,EAAE,4BAA4BgB,SAAS,wBAGpD,IAEHP,gBAAiB,WACb,IAAI7B,EAAUoB,EAAE,WAAW+C,KAAK,qBAAqBC,SAAS,oBAC1DC,EAAmBrE,EAAQ0B,KAAK,aAEb4C,MAApBD,IACGjD,EAAEa,QAAQW,QAAU,KAAOxB,EAAE,QAAQmD,SAAS,eAChDvE,EAAQuD,IAAI,aAAa,QAAUc,EAAmB,MAC9CG,WAAW,kBACXjB,IAAI,kBAAkB,SACtBnB,SAAS,aAEjBpC,EAAQuD,IAAI,aAAa,IACjBzB,KAAK,iBAAkB,GAAIuC,GAC3Bd,IAAI,kBAAkB,IACtBlB,YAAY,eAK5BoC,YAAa,WAET,IAAIC,EAASrD,SAASsD,eAAe,iBAErCC,WAAWC,OAAOH,EAAQ,CACtBI,MAAO,GACPC,QAAS,EAAC,GAAK,GACfC,MAAO,CACHC,IAAK,EACLC,IAAK,OAIb,IAAIC,EAAU9D,SAASsD,eAAe,gBAEtCC,WAAWC,OAAOM,EAAS,CACvBL,MAAO,CAAE,GAAI,IACbC,SAAS,EACTC,MAAO,CACHC,IAAM,EACNC,IAAM,SAOtBrC,aAAe,CACXC,uBAAwBtC,SAAS,WACRY,EAAEN,MAAMwC,YAE7BpD,KAAQkB,EAAEa,QAAQqB,YAAc,EAChCzD,UAAU0D,IAAI,CACVC,UAAY,iBAAmBtD,KAAM,QACrCuD,oBAAoB,iBAAmBvD,KAAM,QAC7CwD,gBAAgB,iBAAmBxD,KAAM,QACzCyD,eAAe,iBAAmBzD,KAAM,WAG7C"} -------------------------------------------------------------------------------- /assets/js/now-ui-kit.min.js: -------------------------------------------------------------------------------- 1 | // ========================================================= 2 | // * Now UI Kit - v1.3.0 3 | // ========================================================= 4 | // 5 | // * Product Page: https://www.creative-tim.com/product/now-ui-kit 6 | // * Copyright 2019 Creative Tim (http://www.creative-tim.com) 7 | // * Licensed under MIT (https://github.com/creativetimofficial/now-ui-kit/blob/master/LICENSE.md) 8 | // 9 | // * Designed by www.invisionapp.com Coded by www.creative-tim.com 10 | // 11 | // ========================================================= 12 | // 13 | // * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 14 | 15 | var big_image,navbar_initialized,nowuiKit,$navbar,scroll_distance,oVal,transparent=!0,transparentDemo=!0,fixedTop=!1,backgroundOrange=!1,toggle_initialized=!1;function debounce(n,e,t){var r;return function(){var a=this,o=arguments;clearTimeout(r),r=setTimeout(function(){r=null,t||n.apply(a,o)},e),t&&!r&&n.apply(a,o)}}function debounce(n,e,t){var r;return function(){var a=this,o=arguments;clearTimeout(r),r=setTimeout(function(){r=null,t||n.apply(a,o)},e),t&&!r&&n.apply(a,o)}}$(document).ready(function(){$('[data-toggle="tooltip"], [rel="tooltip"]').tooltip(),$('[data-toggle="popover"]').each(function(){color_class=$(this).data("color"),$(this).popover({template:''})}),nowuiKit.initNavbarImage(),$navbar=$(".navbar[color-on-scroll]"),scroll_distance=$navbar.attr("color-on-scroll")||500,0!=$(".navbar[color-on-scroll]").length&&(nowuiKit.checkScrollForTransparentNavbar(),$(window).on("scroll",nowuiKit.checkScrollForTransparentNavbar)),$(".form-control").on("focus",function(){$(this).parent(".input-group").addClass("input-group-focus")}).on("blur",function(){$(this).parent(".input-group").removeClass("input-group-focus")}),$(".bootstrap-switch").each(function(){$this=$(this),data_on_label=$this.data("on-label")||"",data_off_label=$this.data("off-label")||"",$this.bootstrapSwitch({onText:data_on_label,offText:data_off_label})}),992<=$(window).width()&&(big_image=$('.page-header-image[data-parallax="true"]'),$(window).on("scroll",nowuiKitDemo.checkScrollForParallax)),$(".carousel").carousel({interval:4e3}),$(".date-picker").each(function(){$(this).datepicker({templates:{leftArrow:'',rightArrow:''}}).on("show",function(){$(".datepicker").addClass("open"),datepicker_color=$(this).data("datepicker-color"),0!=datepicker_color.length&&$(".datepicker").addClass("datepicker-"+datepicker_color)}).on("hide",function(){$(".datepicker").removeClass("open")})})}),nowuiKitDemo={checkScrollForParallax:debounce(function(){$(this).scrollTop();oVal=$(window).scrollTop()/3,big_image.css({transform:"translate3d(0,"+oVal+"px,0)","-webkit-transform":"translate3d(0,"+oVal+"px,0)","-ms-transform":"translate3d(0,"+oVal+"px,0)","-o-transform":"translate3d(0,"+oVal+"px,0)"})},6)},$(window).on("resize",function(){nowuiKit.initNavbarImage()}),$(document).on("click",".navbar-toggler",function(){$toggle=$(this),1==nowuiKit.misc.navbar_menu_visible?($("html").removeClass("nav-open"),nowuiKit.misc.navbar_menu_visible=0,$("#bodyClick").remove(),setTimeout(function(){$toggle.removeClass("toggled")},550)):(setTimeout(function(){$toggle.addClass("toggled")},580),div='
',$(div).appendTo("body").click(function(){$("html").removeClass("nav-open"),nowuiKit.misc.navbar_menu_visible=0,setTimeout(function(){$toggle.removeClass("toggled"),$("#bodyClick").remove()},550)}),$("html").addClass("nav-open"),nowuiKit.misc.navbar_menu_visible=1)}),nowuiKit={misc:{navbar_menu_visible:0},checkScrollForTransparentNavbar:debounce(function(){$(document).scrollTop()>scroll_distance?transparent&&(transparent=!1,$(".navbar[color-on-scroll]").removeClass("navbar-transparent")):transparent||(transparent=!0,$(".navbar[color-on-scroll]").addClass("navbar-transparent"))},17),initNavbarImage:function(){var a=$(".navbar").find(".navbar-translate").siblings(".navbar-collapse"),o=a.data("nav-image");null!=o&&($(window).width()<991||$("body").hasClass("burger-menu")?a.css("background","url('"+o+"')").removeAttr("data-nav-image").css("background-size","cover").addClass("has-image"):a.css("background","").attr("data-nav-image",""+o).css("background-size","").removeClass("has-image"))},initSliders:function(){var a=document.getElementById("sliderRegular");noUiSlider.create(a,{start:40,connect:[!0,!1],range:{min:0,max:100}});var o=document.getElementById("sliderDouble");noUiSlider.create(o,{start:[20,60],connect:!0,range:{min:0,max:100}})}},nowuiKitDemo={checkScrollForParallax:debounce(function(){$(this).scrollTop();oVal=$(window).scrollTop()/3,big_image.css({transform:"translate3d(0,"+oVal+"px,0)","-webkit-transform":"translate3d(0,"+oVal+"px,0)","-ms-transform":"translate3d(0,"+oVal+"px,0)","-o-transform":"translate3d(0,"+oVal+"px,0)"})},6)}; 16 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit.scss: -------------------------------------------------------------------------------- 1 | /*! 2 | 3 | ========================================================= 4 | * Now UI Kit - v1.3.0 5 | ========================================================= 6 | 7 | * Product Page: https://www.creative-tim.com/product/now-ui-kit 8 | * Copyright 2019 Creative Tim (http://www.creative-tim.com) 9 | 10 | * Designed by www.invisionapp.com Coded by www.creative-tim.com 11 | 12 | ========================================================= 13 | 14 | * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 15 | 16 | */ 17 | 18 | @import 'now-ui-kit/variables'; 19 | @import 'now-ui-kit/mixins'; 20 | 21 | // Plugins CSS 22 | @import "now-ui-kit/plugins/plugin-bootstrap-switch"; 23 | @import "now-ui-kit/plugins/plugin-nouislider"; 24 | @import "now-ui-kit/plugins/plugin-datepicker"; 25 | 26 | // Core CSS 27 | @import "now-ui-kit/buttons"; 28 | @import "now-ui-kit/inputs"; 29 | @import "now-ui-kit/checkboxes-radio"; 30 | @import "now-ui-kit/progress"; 31 | @import "now-ui-kit/badges"; 32 | @import "now-ui-kit/pagination"; 33 | @import "now-ui-kit/typography"; 34 | @import "now-ui-kit/misc"; 35 | @import "now-ui-kit/pills"; 36 | 37 | // components 38 | @import "now-ui-kit/nucleo-outline"; 39 | 40 | @import "now-ui-kit/tabs"; 41 | @import "now-ui-kit/navbar"; 42 | @import "now-ui-kit/dropdown"; 43 | @import "now-ui-kit/alerts"; 44 | @import "now-ui-kit/images"; 45 | @import "now-ui-kit/popups"; 46 | @import "now-ui-kit/modals"; 47 | @import "now-ui-kit/carousel"; 48 | @import "now-ui-kit/footers"; 49 | 50 | // Cards 51 | @import "now-ui-kit/cards"; 52 | @import "now-ui-kit/cards/card-plain"; 53 | @import "now-ui-kit/cards/card-signup"; 54 | 55 | // example pages and sections 56 | @import "now-ui-kit/example-pages"; 57 | @import "now-ui-kit/sections"; 58 | 59 | 60 | @import "now-ui-kit/responsive"; 61 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_alerts.scss: -------------------------------------------------------------------------------- 1 | // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. 2 | .alert{ 3 | border: 0; 4 | border-radius: 0; 5 | color: $white-color; 6 | padding-top: .9rem; 7 | padding-bottom: .9rem; 8 | 9 | .alert-link{ 10 | color: $white-color; 11 | opacity: .8; 12 | } 13 | 14 | &.alert-success{ 15 | background-color: $success-color-alert; 16 | } 17 | 18 | &.alert-danger{ 19 | background-color: $danger-color-alert; 20 | } 21 | 22 | &.alert-warning{ 23 | background-color: $warning-color-alert; 24 | } 25 | 26 | &.alert-info{ 27 | background-color: $info-color-alert; 28 | } 29 | 30 | &.alert-primary{ 31 | background-color: $primary-color-alert; 32 | } 33 | 34 | .alert-icon{ 35 | display: block; 36 | float: left; 37 | margin-right: 15px; 38 | margin-top: -1px; 39 | } 40 | 41 | strong{ 42 | text-transform: uppercase; 43 | font-size: 12px; 44 | } 45 | 46 | i.fa, 47 | i.now-ui-icons{ 48 | font-size: 20px; 49 | } 50 | 51 | .close{ 52 | color: $white-color; 53 | opacity: .9; 54 | text-shadow: none; 55 | line-height: 0; 56 | outline: 0; 57 | display: inline-block; 58 | cursor: pointer; 59 | 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_badges.scss: -------------------------------------------------------------------------------- 1 | /* badges */ 2 | .badge{ 3 | border-radius: 8px; 4 | padding: 4px 8px; 5 | text-transform: uppercase; 6 | font-size: $font-size-mini; 7 | line-height: 12px; 8 | background-color: $transparent-bg; 9 | border: $border; 10 | margin-bottom: 5px; 11 | color: $white-color; 12 | border-radius: $border-radius-extreme; 13 | 14 | &:hover, 15 | &:focus{ 16 | text-decoration: none; 17 | } 18 | 19 | } 20 | .badge-icon{ 21 | padding: 0.4em 0.55em; 22 | i{ 23 | font-size: 0.8em; 24 | } 25 | } 26 | .badge-default{ 27 | @include badge-color($default-color); 28 | } 29 | .badge-primary{ 30 | @include badge-color($primary-color); 31 | } 32 | .badge-info{ 33 | @include badge-color($info-color); 34 | } 35 | .badge-success{ 36 | @include badge-color($success-color); 37 | } 38 | .badge-warning{ 39 | @include badge-color($warning-color); 40 | } 41 | .badge-danger{ 42 | @include badge-color($danger-color); 43 | } 44 | .badge-neutral{ 45 | @include badge-color($white-color); 46 | color: inherit !important; 47 | } 48 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_buttons.scss: -------------------------------------------------------------------------------- 1 | .btn, 2 | .navbar .navbar-nav > a.btn{ 3 | border-width: $border-thick; 4 | font-weight: $font-weight-normal; 5 | font-size: $font-size-small; 6 | line-height: $line-height; 7 | margin: 10px 1px; 8 | border: none; 9 | border-radius: $border-radius-small; 10 | padding: $padding-btn-vertical $padding-btn-horizontal; 11 | cursor: pointer; 12 | 13 | @include btn-styles($default-color, $default-states-color); 14 | 15 | &:hover, 16 | &:focus{ 17 | @include opacity(1); 18 | outline: 0 !important; 19 | } 20 | &:active, 21 | &.active, 22 | .open > &.dropdown-toggle { 23 | @include box-shadow(none); 24 | outline: 0 !important; 25 | } 26 | 27 | &.btn-icon { 28 | // see above for color variations 29 | height: $btn-icon-size-regular; 30 | min-width: $btn-icon-size-regular; 31 | width: $btn-icon-size-regular; 32 | padding: 0; 33 | font-size: $btn-icon-font-size-regular; 34 | overflow: hidden; 35 | position: relative; 36 | line-height: normal; 37 | 38 | &[class*="btn-outline-"]{ 39 | padding: 0; 40 | } 41 | 42 | &.btn-sm{ 43 | height: $btn-icon-size-small; 44 | min-width: $btn-icon-size-small; 45 | width: $btn-icon-size-small; 46 | 47 | i.fab, 48 | i.now-ui-icons{ 49 | font-size: $btn-icon-font-size-small; 50 | } 51 | } 52 | 53 | &.btn-lg{ 54 | height: $btn-icon-size-lg; 55 | min-width: $btn-icon-size-lg; 56 | width: $btn-icon-size-lg; 57 | 58 | i.now-ui-icons, 59 | i.fab{ 60 | font-size: $btn-icon-font-size-lg; 61 | } 62 | } 63 | 64 | &:not(.btn-footer) i.now-ui-icons, 65 | &:not(.btn-footer) i.fab{ 66 | position: absolute; 67 | top: 50%; 68 | left: 50%; 69 | transform: translate(-12px, -12px); 70 | line-height: 1.5626rem; 71 | width: 23px; 72 | } 73 | 74 | } 75 | 76 | &:not(.btn-icon) .now-ui-icons{ 77 | position: relative; 78 | top: 1px; 79 | } 80 | } 81 | 82 | // Apply the mixin to the buttons 83 | // .btn-default { @include btn-styles($default-color, $default-states-color); } 84 | .btn-primary { @include btn-styles($primary-color, $primary-states-color); } 85 | .btn-success { @include btn-styles($success-color, $success-states-color); } 86 | .btn-info { @include btn-styles($info-color, $info-states-color); } 87 | .btn-warning { @include btn-styles($warning-color, $warning-states-color); } 88 | .btn-danger { @include btn-styles($danger-color, $danger-states-color); } 89 | .btn-neutral { @include btn-styles($white-color, $white-color); } 90 | 91 | .btn-outline-primary { @include outline-buttons($primary-color, $primary-states-color); } 92 | .btn-outline-success { @include outline-buttons($success-color, $success-states-color); } 93 | .btn-outline-info { @include outline-buttons($info-color, $info-states-color); } 94 | .btn-outline-warning { @include outline-buttons($warning-color, $warning-states-color); } 95 | .btn-outline-danger { @include outline-buttons($danger-color, $danger-states-color); } 96 | .btn-outline-default { @include outline-buttons($default-color, $default-states-color); } 97 | 98 | .btn-round{ 99 | border-width: $border-thin; 100 | border-radius: $btn-round-radius !important; 101 | padding: $padding-btn-vertical $padding-round-horizontal; 102 | 103 | &[class*="btn-outline-"]{ 104 | padding: $padding-btn-vertical - 1 $padding-round-horizontal - 1; 105 | } 106 | } 107 | [class*="btn-outline-"]{ 108 | border: $border; 109 | padding: $padding-btn-vertical - 1 $padding-round-horizontal - 1; 110 | background-color: $transparent-bg; 111 | } 112 | 113 | [class*="btn-outline-"], 114 | .btn-link{ 115 | &.disabled, 116 | &:disabled, 117 | &[disabled], 118 | fieldset[disabled] & { 119 | &, 120 | &:hover, 121 | &:focus, 122 | &.focus, 123 | &:active, 124 | &.active { 125 | background-color: $transparent-bg; 126 | } 127 | } 128 | } 129 | 130 | .btn-lg{ 131 | @include btn-size($padding-large-vertical, $padding-large-horizontal, $font-size-large, $border-radius-large); 132 | } 133 | .btn-sm{ 134 | @include btn-size($padding-small-vertical, $padding-small-horizontal, $font-size-base, $border-radius-small); 135 | } 136 | 137 | .btn-link{ 138 | border: $none; 139 | padding: $padding-base-vertical $padding-base-horizontal; 140 | background-color: $transparent-bg; 141 | } 142 | 143 | .btn-wd { 144 | min-width: 140px; 145 | } 146 | .btn-group.select{ 147 | width: 100%; 148 | } 149 | .btn-group.select .btn{ 150 | text-align: left; 151 | } 152 | .btn-group.select .caret{ 153 | position: absolute; 154 | top: 50%; 155 | margin-top: -1px; 156 | right: 8px; 157 | } 158 | 159 | .btn-facebook { 160 | &, 161 | &:hover, 162 | &focus, 163 | &:active, 164 | &:active:focus { 165 | color: $social-facebook !important; 166 | } 167 | } 168 | 169 | .btn-twitter { 170 | 171 | &, 172 | &:hover, 173 | &focus, 174 | &:active, 175 | &:active:focus { 176 | color: $social-twitter !important; 177 | } 178 | } 179 | 180 | .btn-google { 181 | &, 182 | &:hover, 183 | &focus, 184 | &:active, 185 | &:active:focus { 186 | color: $social-google !important; 187 | } 188 | } 189 | 190 | .btn-github { 191 | &, 192 | &:hover, 193 | &focus, 194 | &:active, 195 | &:active:focus { 196 | color: $social-github !important; 197 | } 198 | } 199 | 200 | .btn-linkedin { 201 | &, 202 | &:hover, 203 | &focus, 204 | &:active, 205 | &:active:focus { 206 | color: $social-linkedin !important; 207 | } 208 | } 209 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_cards.scss: -------------------------------------------------------------------------------- 1 | .card{ 2 | border: 0; 3 | border-radius: $border-radius-small; 4 | display: inline-block; 5 | position: relative; 6 | width: 100%; 7 | margin-bottom: 30px; 8 | box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2); 9 | 10 | .card-header{ 11 | background-color: $transparent-bg; 12 | border-bottom: 0; 13 | background-color: transparent; 14 | border-radius: 0; 15 | padding: 0; 16 | } 17 | 18 | .card-footer{ 19 | padding: 0; 20 | margin-top: 15px; 21 | background-color: $transparent-bg; 22 | border:0; 23 | } 24 | 25 | &[data-background-color="orange"]{ 26 | background-color: $primary-color; 27 | } 28 | 29 | &[data-background-color="red"]{ 30 | background-color: $danger-color; 31 | } 32 | 33 | &[data-background-color="yellow"]{ 34 | background-color: $warning-color; 35 | } 36 | 37 | &[data-background-color="blue"]{ 38 | background-color: $info-color; 39 | } 40 | 41 | &[data-background-color="green"]{ 42 | background-color: darken($success-color, 5%); 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_carousel.scss: -------------------------------------------------------------------------------- 1 | // display flex was causing errors 2 | .carousel-item-next, 3 | .carousel-item-prev, 4 | .carousel-item.active{ 5 | display: block; 6 | } 7 | 8 | .carousel{ 9 | .carousel-inner{ 10 | box-shadow: $box-shadow-raised; 11 | border-radius: $border-radius-small; 12 | } 13 | 14 | .card { 15 | max-width: 650px; 16 | margin: 60px auto; 17 | display: block; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_checkboxes-radio.scss: -------------------------------------------------------------------------------- 1 | .form-check{ 2 | margin-top: .65rem; 3 | padding-left: 0; 4 | } 5 | 6 | .form-check .form-check-label{ 7 | display: inline-block; 8 | position: relative; 9 | cursor: pointer; 10 | padding-left: 35px; 11 | line-height: 26px; 12 | margin-bottom: 0; 13 | -webkit-transition: color 0.3s linear; 14 | -moz-transition: color 0.3s linear; 15 | -o-transition: color 0.3s linear; 16 | -ms-transition: color 0.3s linear; 17 | transition: color 0.3s linear; 18 | } 19 | .radio .form-check-sign{ 20 | padding-left: 28px; 21 | } 22 | 23 | .form-check .form-check-sign::before, 24 | .form-check .form-check-sign::after{ 25 | content: " "; 26 | display: inline-block; 27 | position: absolute; 28 | width: 26px; 29 | height: 26px; 30 | left: 0; 31 | cursor: pointer; 32 | border-radius: 3px; 33 | top: 0; 34 | background-color: transparent; 35 | border: 1px solid $light-gray; 36 | -webkit-transition: opacity 0.3s linear; 37 | -moz-transition: opacity 0.3s linear; 38 | -o-transition: opacity 0.3s linear; 39 | -ms-transition: opacity 0.3s linear; 40 | transition: opacity 0.3s linear; 41 | } 42 | 43 | .form-check .form-check-sign::after{ 44 | font-family: 'Nucleo Outline'; 45 | content: "\ea22"; 46 | top: 0px; 47 | text-align: center; 48 | font-size: 14px; 49 | opacity: 0; 50 | color: $dark-background; 51 | border: 0; 52 | background-color: inherit; 53 | } 54 | 55 | .form-check.disabled .form-check-label, 56 | .form-check.disabled .form-check-label { 57 | color: $dark-gray; 58 | opacity: .5; 59 | cursor: not-allowed; 60 | } 61 | 62 | .form-check input[type="checkbox"], 63 | .radio input[type="radio"]{ 64 | opacity: 0; 65 | position: absolute; 66 | visibility: hidden; 67 | } 68 | .form-check input[type="checkbox"]:checked + .form-check-sign::after{ 69 | opacity: 1; 70 | } 71 | 72 | .form-control input[type="checkbox"]:disabled + .form-check-sign::before, 73 | .checkbox input[type="checkbox"]:disabled + .form-check-sign::after{ 74 | cursor: not-allowed; 75 | } 76 | 77 | .form-check input[type="checkbox"]:disabled + .form-check-sign, 78 | .form-check input[type="radio"]:disabled + .form-check-sign{ 79 | pointer-events: none; 80 | } 81 | 82 | .form-check-radio .form-check-sign::before, 83 | .form-check-radio .form-check-sign::after{ 84 | content: " "; 85 | width: 20px; 86 | height: 20px; 87 | border-radius: 50%; 88 | border: 1px solid $light-gray; 89 | display: inline-block; 90 | position: absolute; 91 | left: 3px; 92 | top: 3px; 93 | padding: 1px; 94 | -webkit-transition: opacity 0.3s linear; 95 | -moz-transition: opacity 0.3s linear; 96 | -o-transition: opacity 0.3s linear; 97 | -ms-transition: opacity 0.3s linear; 98 | transition: opacity 0.3s linear; 99 | } 100 | 101 | .form-check-radio input[type="radio"] + .form-check-sign:after, 102 | .form-check-radio input[type="radio"] { 103 | opacity: 0; 104 | } 105 | .form-check-radio input[type="radio"]:checked + .form-check-sign::after { 106 | width: 4px; 107 | height: 4px; 108 | background-color: $dark-background; 109 | border-color: $dark-background; 110 | top: 11px; 111 | left: 11px; 112 | opacity: 1; 113 | } 114 | 115 | .form-check-radio input[type="radio"]:checked + .form-check-sign::after{ 116 | opacity: 1; 117 | } 118 | 119 | .form-check-radio input[type="radio"]:disabled + .form-check-sign { 120 | color: $dark-gray; 121 | } 122 | 123 | .form-check-radio input[type="radio"]:disabled + .form-check-sign::before, 124 | .form-check-radio input[type="radio"]:disabled + .form-check-sign::after { 125 | color: $dark-gray; 126 | } 127 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_dropdown.scss: -------------------------------------------------------------------------------- 1 | .dropdown-menu{ 2 | border: 0; 3 | box-shadow: 0px 10px 50px 0px rgba(0, 0, 0, 0.2); 4 | border-radius: $border-radius-extra-small; 5 | @include transition($fast-transition-time, $transition-linear); 6 | font-size: $font-size-base; 7 | 8 | &.dropdown-menu-right{ 9 | &:before{ 10 | left:auto; 11 | right: 10px; 12 | } 13 | } 14 | 15 | .dropdown &{ 16 | @include transform-translate-y-dropdown(-25px); 17 | visibility: hidden; 18 | display: block; 19 | @include opacity(0); 20 | top: 100% !important; 21 | } 22 | 23 | .dropdown.show &, 24 | &.open{ 25 | @include opacity(1); 26 | visibility: visible; 27 | @include transform-translate-y-dropdown(0px); 28 | } 29 | 30 | .dropdown-item, 31 | .bootstrap-select &.inner li a{ 32 | font-size: $font-size-small; 33 | padding-top: .6rem; 34 | padding-bottom: .6rem; 35 | margin-top: 5px; 36 | @include transition($fast-transition-time, $transition-linear); 37 | outline: none; 38 | 39 | &:hover, 40 | &:focus{ 41 | background-color: $opacity-gray-3; 42 | } 43 | 44 | &.disabled, 45 | &:disabled{ 46 | color: $default-color-opacity; 47 | 48 | &:hover, 49 | &:focus{ 50 | background-color: transparent; 51 | } 52 | } 53 | } 54 | 55 | &:before{ 56 | display: inline-block; 57 | position: absolute; 58 | width: 0; 59 | height: 0; 60 | vertical-align: middle; 61 | content: ""; 62 | top: -5px; 63 | left: 10px; 64 | right: auto; 65 | color: $white-color; 66 | border-bottom: .4em solid; 67 | border-right: .4em solid transparent; 68 | border-left: .4em solid transparent; 69 | } 70 | 71 | .dropdown-divider{ 72 | background-color: $opacity-gray-5; 73 | } 74 | 75 | .dropdown-header:not([href]):not([tabindex]){ 76 | color: $default-color-opacity; 77 | font-size: $font-size-mini; 78 | text-transform: uppercase; 79 | font-weight: $font-weight-bold; 80 | } 81 | 82 | &.dropdown-primary{ 83 | @include dropdown-colors(darken($primary-color, 3%),$opacity-8,$white-color, $opacity-2); 84 | } 85 | 86 | &.dropdown-info{ 87 | @include dropdown-colors(darken($info-color, 3%),$opacity-8,$white-color, $opacity-2); 88 | } 89 | 90 | &.dropdown-danger{ 91 | @include dropdown-colors(darken($danger-color, 3%),$opacity-8,$white-color, $opacity-2); 92 | } 93 | 94 | &.dropdown-success{ 95 | @include dropdown-colors(darken($success-color, 3%),$opacity-8,$white-color, $opacity-2); 96 | } 97 | 98 | &.dropdown-warning{ 99 | @include dropdown-colors(darken($warning-color, 3%),$opacity-8,$white-color, $opacity-2); 100 | } 101 | } 102 | .button-dropdown{ 103 | padding-right: $padding-base-horizontal; 104 | cursor: pointer; 105 | 106 | & .dropdown-toggle{ 107 | padding-top: $padding-base-vertical; 108 | padding-bottom: $padding-base-vertical; 109 | display: block; 110 | 111 | &:after{ 112 | display: none; 113 | } 114 | } 115 | } 116 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_example-pages.scss: -------------------------------------------------------------------------------- 1 | // style for the landing page 2 | .index-page{ 3 | .page-header{ 4 | height: 125vh; 5 | 6 | .container{ 7 | > .content-center{ 8 | top: 37%; 9 | } 10 | } 11 | 12 | .category-absolute{ 13 | position: absolute; 14 | top: 100vh; 15 | margin-top: -60px; 16 | padding: 0 15px; 17 | width: 100%; 18 | color: rgba(255,255,255,.5); 19 | } 20 | } 21 | } 22 | .landing-page{ 23 | 24 | .header{ 25 | height: 100vh; 26 | position: relative; 27 | 28 | .container{ 29 | padding-top: 26vh; 30 | color: #FFFFFF; 31 | z-index: 2; 32 | position: relative; 33 | } 34 | 35 | .share{ 36 | margin-top: 150px; 37 | } 38 | h1{ 39 | font-weight: 600; 40 | } 41 | .title{ 42 | color: $white-color; 43 | } 44 | } 45 | 46 | .section-team{ 47 | .team .team-player img{ 48 | max-width: 100px; 49 | } 50 | 51 | .team-player{ 52 | margin-bottom: 15px; 53 | } 54 | } 55 | 56 | .section-contact-us{ 57 | .title{ 58 | margin-bottom: 15px; 59 | } 60 | 61 | .description{ 62 | margin-bottom: 30px; 63 | } 64 | 65 | .input-group, 66 | .send-button, 67 | .textarea-container{ 68 | padding: 0 40px; 69 | } 70 | 71 | .textarea-container{ 72 | margin: 40px 0; 73 | } 74 | 75 | a.btn{ 76 | margin-top: 35px; 77 | } 78 | } 79 | } 80 | 81 | // style for the profile page 82 | .profile-page{ 83 | 84 | .page-header{ 85 | min-height: 550px; 86 | } 87 | 88 | .profile-container{ 89 | color: #FFFFFF; 90 | } 91 | .photo-container{ 92 | width: 123px; 93 | height: 123px; 94 | border-radius: 50%; 95 | overflow: hidden; 96 | margin: 0 auto; 97 | box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.3); 98 | } 99 | 100 | .title{ 101 | text-align: center; 102 | margin-top: 30px; 103 | } 104 | 105 | .description, 106 | .category{ 107 | text-align: center; 108 | } 109 | 110 | h5.description{ 111 | max-width: 700px; 112 | margin: 20px auto 75px; 113 | } 114 | 115 | .nav-align-center{ 116 | margin-top: 30px; 117 | } 118 | 119 | .content{ 120 | max-width: 450px; 121 | margin: 0 auto; 122 | 123 | .social-description{ 124 | display: inline-block; 125 | max-width: 150px; 126 | width: 145px; 127 | text-align: center; 128 | margin: 15px 0 0px; 129 | 130 | h2{ 131 | margin-bottom: 15px; 132 | } 133 | } 134 | } 135 | 136 | .button-container{ 137 | text-align: center; 138 | margin-top: -106px; 139 | } 140 | 141 | .collections{ 142 | img{ 143 | margin-bottom: 30px; 144 | } 145 | } 146 | 147 | .gallery{ 148 | margin-top: 45px; 149 | padding-bottom: 50px; 150 | } 151 | } 152 | 153 | .section-full-page{ 154 | 155 | &:after, 156 | &:before{ 157 | display: block; 158 | content: ""; 159 | position: absolute; 160 | width: 100%; 161 | height: 100%; 162 | top: 0; 163 | left: 0; 164 | z-index: 2; 165 | } 166 | 167 | &:before{ 168 | background-color: rgba(0,0,0,.5); 169 | } 170 | 171 | &[filter-color="purple"], 172 | &[filter-color="primary"]{ 173 | &:after{ 174 | @include linear-gradient(rgba($light-gray,.26), rgba($primary-color,.95)); 175 | 176 | } 177 | 178 | } 179 | 180 | &[data-image]:after{ 181 | opacity: .5; 182 | } 183 | 184 | > .content, 185 | > .footer{ 186 | position: relative; 187 | z-index: 4; 188 | } 189 | 190 | > .content{ 191 | min-height: calc(100vh - 80px); 192 | } 193 | 194 | .full-page-background{ 195 | position: absolute; 196 | z-index: 1; 197 | height: 100%; 198 | width: 100%; 199 | display: block; 200 | top: 0; 201 | left: 0; 202 | background-size: cover; 203 | background-position: center center; 204 | 205 | } 206 | 207 | .footer nav > ul a:not(.btn), 208 | .footer, 209 | .footer .copyright a{ 210 | color: $white-color; 211 | } 212 | 213 | } 214 | 215 | .login-page, 216 | .profile-page { 217 | .page-header:before { 218 | position: absolute; 219 | z-index: 0; 220 | width: 100%; 221 | height: 100%; 222 | display: block; 223 | left: 0; 224 | top: 0; 225 | content: ""; 226 | background-color: rgba(0, 0, 0, 0.5); 227 | } 228 | } 229 | 230 | .login-page{ 231 | 232 | 233 | 234 | .card-login{ 235 | border-radius: $border-radius-large; 236 | padding-bottom: $padding-base-horizontal; 237 | max-width: 320px; 238 | 239 | .btn-wd{ 240 | min-width: 180px; 241 | } 242 | 243 | .logo-container{ 244 | width: 65px; 245 | margin: 0 auto; 246 | margin-bottom: 55px; 247 | 248 | img{ 249 | width: 100%; 250 | } 251 | } 252 | 253 | .input-group:last-child{ 254 | margin-bottom: 40px; 255 | } 256 | 257 | &.card-plain{ 258 | @include input-coloured-bg($opacity-5, $white-color, $white-color, $transparent-bg, $opacity-1, $opacity-2); 259 | 260 | .input-group-text, 261 | .form-group.no-border .input-group-text, 262 | .input-group.no-border .input-group-text{ 263 | color: $opacity-8; 264 | } 265 | } 266 | } 267 | 268 | .link{ 269 | font-size: 10px; 270 | color: $white-color; 271 | text-decoration: none; 272 | } 273 | } 274 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_footers.scss: -------------------------------------------------------------------------------- 1 | .footer{ 2 | padding: 24px 0; 3 | 4 | &.footer-default{ 5 | background-color: #f2f2f2; 6 | } 7 | 8 | nav{ 9 | display: inline-block; 10 | float: left; 11 | } 12 | 13 | ul{ 14 | margin-bottom: 0; 15 | padding: 0; 16 | list-style: none; 17 | 18 | li{ 19 | display: inline-block; 20 | 21 | a{ 22 | color: inherit; 23 | padding: $padding-base-vertical; 24 | font-size: $font-size-small; 25 | text-transform: uppercase; 26 | text-decoration: none; 27 | 28 | &:hover{ 29 | text-decoration: none; 30 | } 31 | } 32 | } 33 | } 34 | 35 | .copyright{ 36 | font-size: $font-size-small; 37 | } 38 | 39 | &:after{ 40 | display: table; 41 | clear: both; 42 | content: " "; 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_images.scss: -------------------------------------------------------------------------------- 1 | img{ 2 | max-width: 100%; 3 | border-radius: 1px; 4 | } 5 | .img-raised{ 6 | box-shadow: $box-shadow-raised; 7 | } 8 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_inputs.scss: -------------------------------------------------------------------------------- 1 | @include form-control-placeholder($default-color, .8); 2 | 3 | .form-control { 4 | background-color: $transparent-bg; 5 | border: 1px solid $light-gray; 6 | border-radius: $btn-round-radius; 7 | color: $black-color; 8 | height: auto; 9 | line-height: normal; 10 | font-size: $font-size-small; 11 | @include transition-input-focus-color(); 12 | @include box-shadow(none); 13 | 14 | .has-success &{ 15 | border-color: $light-gray; 16 | } 17 | 18 | &:focus{ 19 | border: 1px solid $primary-color; 20 | @include box-shadow(none); 21 | outline: 0 !important; 22 | color: $black-color; 23 | 24 | & + .input-group-text, 25 | & ~ .input-group-text{ 26 | border: 1px solid $primary-color; 27 | border-left: none; 28 | background-color: $transparent-bg; 29 | } 30 | } 31 | 32 | .has-success &, 33 | .has-error &, 34 | .has-success &:focus, 35 | .has-error &:focus{ 36 | @include box-shadow(none); 37 | } 38 | 39 | .has-success &:focus{ 40 | border-color: lighten($success-color, 5%); 41 | } 42 | 43 | 44 | .has-danger &, 45 | .has-success &{ 46 | &.form-control-success, 47 | &.form-control-danger{ 48 | background-image: none; 49 | } 50 | } 51 | 52 | .has-danger &{ 53 | border-color: lighten($danger-color, 30%); 54 | color: $danger-color; 55 | background-color: rgba(222,222,222, .1); 56 | 57 | &:focus{ 58 | background-color: $white-color; 59 | } 60 | } 61 | 62 | & + .form-control-feedback{ 63 | border-radius: $border-radius-large; 64 | font-size: $font-size-base; 65 | margin-top: -7px; 66 | position: absolute; 67 | right: 10px; 68 | top: 50%; 69 | vertical-align: middle; 70 | } 71 | 72 | .open &{ 73 | border-radius: $border-radius-large $border-radius-large 0 0; 74 | border-bottom-color: transparent; 75 | } 76 | 77 | // & + .input-group-text{ 78 | // background-color: $white-bg; 79 | // } 80 | } 81 | 82 | .has-success, 83 | .has-danger{ 84 | &:after{ 85 | font-family: 'Nucleo Outline'; 86 | content: "\ea22"; 87 | display: inline-block; 88 | position: absolute; 89 | right: 20px; 90 | top: 12px; 91 | color: $success-color; 92 | font-size: 11px; 93 | } 94 | 95 | &.input-lg{ 96 | &:after{ 97 | font-size: 13px; 98 | top: 13px; 99 | } 100 | } 101 | } 102 | 103 | .has-danger{ 104 | &:after{ 105 | content: "\ea53"; 106 | color: $danger-color; 107 | } 108 | } 109 | 110 | @include input-lg-padding($padding-large-vertical, $padding-input-horizontal); 111 | @include input-base-padding($padding-input-vertical, $padding-input-horizontal); 112 | 113 | .form-group.no-border, 114 | .input-group.no-border{ 115 | .form-control, 116 | .form-control + .input-group-text{ 117 | background-color: $opacity-gray-3; 118 | border: medium none; 119 | &:focus, 120 | &:active, 121 | &:active{ 122 | border: medium none; 123 | background-color: $opacity-gray-5; 124 | } 125 | } 126 | 127 | .form-control{ 128 | &:focus{ 129 | & + .input-group-text{ 130 | background-color: $opacity-gray-5; 131 | } 132 | } 133 | } 134 | .input-group-prepend{ 135 | .input-group-text{ 136 | background-color: $opacity-gray-3; 137 | border: none; 138 | border-left: transparent !important; 139 | } 140 | } 141 | 142 | &.input-group-focus{ 143 | &.no-border{ 144 | .input-group-text{ 145 | background-color: $opacity-gray-5; 146 | } 147 | } 148 | } 149 | } 150 | 151 | .has-error{ 152 | .form-control-feedback, .control-label{ 153 | color: $danger-color; 154 | } 155 | } 156 | .has-success{ 157 | .form-control-feedback, .control-label{ 158 | color: $success-color; 159 | } 160 | } 161 | 162 | .input-group-text { 163 | background-color: $white-bg; 164 | border: 1px solid $light-gray; 165 | border-radius: $btn-round-radius; 166 | color: $dark-background; 167 | 168 | @include transition-input-focus-color(); 169 | 170 | .input-group-focus &{ 171 | background-color: $white-bg; 172 | border-color: $primary-color; 173 | } 174 | 175 | .has-success &, 176 | .has-danger &{ 177 | background-color: $white-color; 178 | } 179 | .has-danger .form-control:focus + &{ 180 | color: $danger-color; 181 | } 182 | .has-success .form-control:focus + &{ 183 | color: $success-color; 184 | } 185 | 186 | & + .form-control, 187 | & ~ .form-control{ 188 | @include input-size($padding-base-vertical - 1, $padding-base-horizontal); 189 | padding-left: 18px; 190 | } 191 | 192 | i{ 193 | width: 17px; 194 | } 195 | } 196 | 197 | .input-group, 198 | .form-group{ 199 | margin-bottom: 10px; 200 | position: relative; 201 | } 202 | .input-group[disabled]{ 203 | .input-group-text{ 204 | background-color: $light-gray; 205 | } 206 | } 207 | 208 | .input-group, 209 | .form-group{ 210 | .input-group-prepend{ 211 | margin-right: 0; 212 | 213 | .input-group-text { 214 | border-left: 1px solid #E3E3E3; 215 | } 216 | } 217 | .input-group-append .input-group-text { 218 | border-right: 1px solid #E3E3E3; 219 | padding: 10px 18px 10px 0; 220 | } 221 | 222 | &.input-group-focus { 223 | .input-group-prepend .input-group-text { 224 | border-left: 1px solid #f96332; 225 | } 226 | .input-group-append .input-group-text { 227 | border-right: 1px solid #f96332; 228 | } 229 | &.no-border{ 230 | .input-group-prepend .input-group-text{ 231 | border-left: transparent; 232 | } 233 | } 234 | } 235 | } 236 | 237 | .input-group .form-control:first-child, 238 | .input-group-text:first-child, 239 | .input-group-btn:first-child > .dropdown-toggle, 240 | .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) { 241 | border-right: 0 none; 242 | } 243 | .input-group .form-control:last-child, 244 | .input-group-text:last-child, 245 | .input-group-btn:last-child > .dropdown-toggle, 246 | .input-group-btn:first-child > .btn:not(:first-child) { 247 | border-left: 0 none; 248 | } 249 | .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { 250 | background-color: $light-gray; 251 | color: $default-color; 252 | cursor: not-allowed; 253 | } 254 | 255 | .input-group-btn .btn{ 256 | border-width: $border-thin; 257 | padding: $padding-btn-vertical $padding-base-horizontal; 258 | } 259 | .input-group-btn .btn-default:not(.btn-fill){ 260 | border-color: $medium-gray; 261 | } 262 | 263 | .input-group-btn:last-child > .btn{ 264 | margin-left: 0; 265 | } 266 | textarea.form-control{ 267 | max-width: 100%; 268 | max-height: 80px; 269 | padding: 10px 10px 0 0; 270 | resize: none; 271 | border: none; 272 | border-bottom: 1px solid $light-gray; 273 | border-radius: 0; 274 | line-height: 2; 275 | 276 | &:focus, 277 | &:active{ 278 | border-left: none; 279 | border-top: none; 280 | border-right: none; 281 | } 282 | } 283 | 284 | .has-success, 285 | .has-danger{ 286 | 287 | &.form-group .form-control, 288 | &.form-group.no-border .form-control{ 289 | padding-right: $padding-input-horizontal + 21; 290 | } 291 | } 292 | 293 | .form.form-newsletter .form-group{ 294 | float: left; 295 | width: 78%; 296 | margin-right: 2%; 297 | margin-top: 9px; 298 | } 299 | 300 | .input-group .input-group-btn{ 301 | padding: 0 12px; 302 | } 303 | 304 | // Input files - hide actual input - requires specific markup in the sample. 305 | .form-group input[type=file] { 306 | opacity: 0; 307 | position: absolute; 308 | top: 0; 309 | right: 0; 310 | bottom: 0; 311 | left: 0; 312 | width: 100%; 313 | height: 100%; 314 | z-index: 100; 315 | } 316 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_misc.scss: -------------------------------------------------------------------------------- 1 | body{ 2 | color: $black-color; 3 | font-size: $font-size-base; 4 | font-family: $sans-serif-family; 5 | overflow-x: hidden; 6 | -moz-osx-font-smoothing: grayscale; 7 | -webkit-font-smoothing: antialiased; 8 | } 9 | 10 | .main{ 11 | position: relative; 12 | background: $white-color; 13 | } 14 | /* Animations */ 15 | .nav-pills .nav-link, 16 | .nav-item .nav-link, 17 | .navbar, 18 | .nav-tabs .nav-link, 19 | .tag, 20 | .tag [data-role="remove"]{ 21 | @include transition($general-transition-time, $transition-ease); 22 | } 23 | 24 | //transition for dropdown caret 25 | .card a, 26 | .bootstrap-switch-label:before{ 27 | @include transition($fast-transition-time, $transition-ease); 28 | } 29 | 30 | .dropdown-toggle:after, 31 | [data-toggle="collapse"][data-parent="#accordion"] i{ 32 | @include transition-on-prop(transform, $fast-transition-time, $transition-ease); 33 | } 34 | 35 | .dropdown-toggle[aria-expanded="true"]:after, 36 | [data-toggle="collapse"][data-parent="#accordion"][aria-expanded="true"] i{ 37 | @include rotate-180(); 38 | } 39 | 40 | .button-bar{ 41 | display: block; 42 | position: relative; 43 | width: 22px; 44 | height: 1px; 45 | border-radius: 1px; 46 | background: $white-bg; 47 | 48 | & + .button-bar{ 49 | margin-top: 7px; 50 | } 51 | 52 | &:nth-child(2){ 53 | width: 17px; 54 | } 55 | } 56 | 57 | .separator-line{ 58 | height: 2px; 59 | width: 44px; 60 | background-color: $default-color; 61 | margin: 20px auto; 62 | 63 | &.separator-primary{ 64 | background-color: $primary-color; 65 | } 66 | } 67 | 68 | .section-space{ 69 | height: 62px; 70 | display: block; 71 | } 72 | 73 | .pull-left{ 74 | float: left; 75 | } 76 | .pull-right{ 77 | float: right; 78 | } 79 | 80 | .title-up{ 81 | text-transform: uppercase; 82 | } 83 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_mixins.scss: -------------------------------------------------------------------------------- 1 | //Utilities 2 | @import "mixins/transparency"; 3 | 4 | //Components 5 | @import "mixins/buttons"; 6 | @import "mixins/vendor-prefixes"; 7 | @import "mixins/inputs"; 8 | @import "mixins/dropdown"; 9 | @import "mixins/badges"; 10 | @import "mixins/navbar"; 11 | @import "mixins/popovers"; 12 | @import "mixins/modals"; 13 | @import "mixins/pages"; 14 | @import "mixins/datepicker"; 15 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_modals.scss: -------------------------------------------------------------------------------- 1 | // 2 | // Modals 3 | // Now Ui Kit Design element Dialogs 4 | // -------------------------------------------------- 5 | .modal-content { 6 | 7 | border-radius: $border-radius-small; 8 | border: none; 9 | box-shadow: 0px 10px 50px 0px rgba(0, 0, 0, 0.5); 10 | // Modal header 11 | // Top section of the modal w/ title and dismiss 12 | .modal-header { 13 | border-bottom: none; 14 | padding-top: 24px; 15 | padding-right: 24px; 16 | padding-bottom: 0; 17 | padding-left: 24px; 18 | 19 | & button{ 20 | position: absolute; 21 | right: 27px; 22 | top: 30px; 23 | outline: 0; 24 | } 25 | .title{ 26 | margin-top: 5px; 27 | margin-bottom: 0; 28 | } 29 | } 30 | // Modal body 31 | // Where all modal content resides (sibling of .modal-header and .modal-footer) 32 | .modal-body { 33 | padding-top: 24px; 34 | padding-right: 24px; 35 | padding-bottom: 16px; 36 | padding-left: 24px; 37 | line-height: 1.9; 38 | } 39 | // Footer (for actions) 40 | .modal-footer { 41 | border-top: none; 42 | padding-right: 24px; 43 | padding-bottom: 16px; 44 | padding-left: 24px; 45 | -webkit-justify-content: space-between; /* Safari 6.1+ */ 46 | justify-content: space-between; 47 | 48 | button { 49 | margin: 0; 50 | padding-left: 16px; 51 | padding-right: 16px; 52 | width: auto; 53 | &.pull-left { 54 | padding-left: 5px; 55 | padding-right: 5px; 56 | position: relative; 57 | left: -5px; 58 | } 59 | } 60 | 61 | } 62 | .modal-body + .modal-footer { 63 | padding-top: 0; 64 | } 65 | } 66 | .modal-backdrop { 67 | background: rgba(0,0,0,0.3); 68 | } 69 | 70 | .modal{ 71 | 72 | &.modal-mini{ 73 | p{ 74 | text-align: center; 75 | } 76 | 77 | .modal-dialog{ 78 | max-width: 255px; 79 | margin: 0 auto; 80 | } 81 | 82 | .modal-profile{ 83 | width: 70px; 84 | height: 70px; 85 | background-color: $white-color; 86 | border-radius: 50%; 87 | text-align: center; 88 | line-height: 5.7; 89 | box-shadow: 0px 5px 50px 0px rgba(0, 0, 0, 0.3); 90 | 91 | i{ 92 | color: $primary-color; 93 | font-size: 21px; 94 | } 95 | 96 | &[class*="modal-profile-"]{ 97 | i{ 98 | color: $white-color; 99 | } 100 | } 101 | 102 | &.modal-profile-primary{ 103 | background-color: $primary-color; 104 | } 105 | 106 | &.modal-profile-danger{ 107 | background-color: $danger-color; 108 | } 109 | 110 | &.modal-profile-warning{ 111 | background-color: $warning-color; 112 | } 113 | 114 | &.modal-profile-success{ 115 | background-color: $success-color; 116 | } 117 | 118 | &.modal-profile-info{ 119 | background-color: $info-color; 120 | } 121 | } 122 | 123 | .modal-footer{ 124 | button{ 125 | text-transform: uppercase; 126 | 127 | &:first-child{ 128 | opacity: .5; 129 | } 130 | } 131 | } 132 | } 133 | 134 | &.modal-default{ 135 | @include modal-colors($white-color, $black-color); 136 | } 137 | 138 | &.modal-primary{ 139 | @include modal-colors($primary-color, $white-color); 140 | } 141 | 142 | &.modal-danger{ 143 | @include modal-colors($danger-color, $white-color); 144 | } 145 | 146 | &.modal-warning{ 147 | @include modal-colors($warning-color, $white-color); 148 | } 149 | 150 | &.modal-success{ 151 | @include modal-colors($success-color, $white-color); 152 | } 153 | 154 | &.modal-info{ 155 | @include modal-colors($info-color, $white-color); 156 | } 157 | 158 | &.show.modal-mini .modal-dialog{ 159 | -webkit-transform: translate(0,30%); 160 | -o-transform: translate(0,30%); 161 | transform: translate(0,30%); 162 | } 163 | 164 | .modal-header .close{ 165 | color: $danger-color; 166 | text-shadow: none; 167 | 168 | &:hover, 169 | &:focus{ 170 | opacity: 1; 171 | } 172 | } 173 | } 174 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_navbar.scss: -------------------------------------------------------------------------------- 1 | .navbar{ 2 | padding-top: $navbar-padding-base; 3 | padding-bottom: $navbar-padding-base; 4 | min-height: 53px; 5 | margin-bottom: 20px; 6 | box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15); 7 | 8 | a{ 9 | vertical-align: middle; 10 | 11 | &:not(.btn):not(.dropdown-item){ 12 | color: $white-color; 13 | } 14 | } 15 | 16 | p{ 17 | display: inline-block; 18 | margin: 0; 19 | line-height: 21px; 20 | font-weight: inherit; 21 | font-size: inherit; 22 | } 23 | 24 | .navbar-nav{ 25 | &.navbar-logo{ 26 | position: absolute; 27 | left: 0; 28 | right: 0; 29 | margin: 0 auto; 30 | width: 49px; 31 | top: -4px; 32 | } 33 | 34 | .nav-link.btn{ 35 | padding: $padding-btn-vertical $padding-btn-horizontal; 36 | 37 | &.btn-lg{ 38 | padding: $padding-large-vertical $padding-large-horizontal; 39 | } 40 | 41 | &.btn-sm{ 42 | padding: $padding-small-vertical $padding-small-horizontal; 43 | } 44 | } 45 | 46 | .nav-link:not(.btn){ 47 | text-transform: uppercase; 48 | font-size: $font-size-mini; 49 | padding: $padding-base-vertical $padding-base-horizontal; 50 | line-height: $line-height-nav-link; 51 | 52 | i.fab + p, 53 | i.now-ui-icons + p{ 54 | margin-left: 3px; 55 | } 56 | 57 | i.fab, 58 | i.now-ui-icons{ 59 | font-size: 18px; 60 | position: relative; 61 | top: 3px; 62 | text-align: center; 63 | width: 21px; 64 | } 65 | 66 | i.now-ui-icons{ 67 | top: 4px; 68 | font-size: 16px; 69 | } 70 | 71 | &.profile-photo{ 72 | .profile-photo-small{ 73 | width: 27px; 74 | height: 27px; 75 | } 76 | } 77 | 78 | &.disabled{ 79 | opacity: .5; 80 | color: $white-color; 81 | } 82 | } 83 | 84 | .nav-item.active .nav-link:not(.btn), 85 | .nav-item .nav-link:not(.btn):focus, 86 | .nav-item .nav-link:not(.btn):hover, 87 | .nav-item .nav-link:not(.btn):active{ 88 | background-color: $opacity-2; 89 | border-radius: $border-radius-small; 90 | } 91 | } 92 | 93 | .logo-container{ 94 | width: 27px; 95 | height: 27px; 96 | overflow: hidden; 97 | margin: 0 auto; 98 | border-radius: 50%; 99 | border: 1px solid transparent; 100 | } 101 | 102 | .navbar-brand{ 103 | text-transform: uppercase; 104 | font-size: $font-size-small; 105 | padding-top: $padding-base-vertical; 106 | padding-bottom: $padding-base-vertical; 107 | line-height: $line-height-nav-link; 108 | } 109 | 110 | .navbar-toggler{ 111 | width: 37px; 112 | height: 27px; 113 | outline: 0; 114 | cursor: pointer; 115 | 116 | &.navbar-toggler-left{ 117 | position: relative; 118 | left: 0; 119 | padding-left: 0; 120 | } 121 | 122 | .navbar-toggler-bar.middle-bar{ 123 | width: 17px; 124 | transition: width .2s linear; 125 | } 126 | 127 | &:hover{ 128 | & .navbar-toggler-bar.middle-bar{ 129 | width: 22px; 130 | } 131 | } 132 | } 133 | 134 | .button-dropdown{ 135 | .navbar-toggler-bar:nth-child(2){ 136 | width: 17px; 137 | } 138 | } 139 | 140 | &.navbar-transparent{ 141 | background-color: $transparent-bg !important; 142 | box-shadow: none; 143 | color: $white-color; 144 | padding-top: 20px !important; 145 | } 146 | 147 | &.bg-white:not(.navbar-transparent){ 148 | a:not(.dropdown-item):not(.btn){ 149 | color: $default-color; 150 | 151 | &.disabled{ 152 | opacity: .5; 153 | color: $default-color; 154 | } 155 | } 156 | 157 | .button-bar{ 158 | background: $default-color; 159 | } 160 | 161 | .nav-item.active .nav-link:not(.btn), 162 | .nav-item .nav-link:not(.btn):focus, 163 | .nav-item .nav-link:not(.btn):hover, 164 | .nav-item .nav-link:not(.btn):active{ 165 | background-color: $opacity-gray-3; 166 | } 167 | 168 | .logo-container{ 169 | border: 1px solid $default-color; 170 | } 171 | } 172 | } 173 | 174 | .bg-default{ 175 | background-color: $default-color !important; 176 | } 177 | 178 | .bg-primary{ 179 | background-color: $primary-color !important; 180 | } 181 | 182 | .bg-info{ 183 | background-color: $info-color !important; 184 | } 185 | 186 | .bg-success{ 187 | background-color: $success-color !important; 188 | } 189 | 190 | .bg-danger{ 191 | background-color: $danger-color !important; 192 | } 193 | 194 | .bg-warning{ 195 | background-color: $warning-color !important; 196 | } 197 | 198 | .bg-white{ 199 | background-color: $white-color !important; 200 | } 201 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_pagination.scss: -------------------------------------------------------------------------------- 1 | .pagination{ 2 | 3 | .page-item .page-link{ 4 | border: 0; 5 | border-radius: 30px !important; 6 | transition: all .3s; 7 | padding: 0px 11px; 8 | margin: 0 3px; 9 | min-width: 30px; 10 | text-align: center; 11 | box-shadow: none; 12 | height: 30px; 13 | line-height: 30px; 14 | color: $black-color; 15 | cursor: pointer; 16 | font-size: $font-size-base; 17 | text-transform: uppercase; 18 | background: transparent; 19 | 20 | &:hover, 21 | &:focus{ 22 | color: $black-color; 23 | background-color: $opacity-gray-3; 24 | border: none; 25 | } 26 | } 27 | 28 | .arrow-margin-left, 29 | .arrow-margin-right{ 30 | position: absolute; 31 | } 32 | 33 | .arrow-margin-right{ 34 | right: 0; 35 | } 36 | 37 | .arrow-margin-left{ 38 | left: 0; 39 | } 40 | 41 | .page-item.active > .page-link{ 42 | color: $light-gray; 43 | box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2); 44 | 45 | &, 46 | &:focus, 47 | &:hover{ 48 | background-color: $default-color; 49 | border-color: $default-color; 50 | color: $white-color; 51 | } 52 | } 53 | 54 | .page-item.disabled > .page-link{ 55 | opacity: .5; 56 | background-color: rgba(255,255,255, .2); 57 | color: $white-color; 58 | } 59 | 60 | // Colors 61 | &.pagination-info{ 62 | .page-item.active > .page-link{ 63 | &, 64 | &:focus, 65 | &:hover{ 66 | background-color: $brand-info; 67 | border-color: $brand-info; 68 | } 69 | } 70 | } 71 | 72 | &.pagination-success{ 73 | .page-item.active > .page-link{ 74 | &, 75 | &:focus, 76 | &:hover{ 77 | background-color: $brand-success; 78 | border-color: $brand-success; 79 | } 80 | } 81 | } 82 | 83 | &.pagination-primary{ 84 | .page-item.active > .page-link{ 85 | &, 86 | &:focus, 87 | &:hover{ 88 | background-color: $brand-primary; 89 | border-color: $brand-primary; 90 | } 91 | } 92 | } 93 | 94 | &.pagination-warning{ 95 | .page-item.active > .page-link{ 96 | &, 97 | &:focus, 98 | &:hover{ 99 | background-color: $brand-warning; 100 | border-color: $brand-warning; 101 | } 102 | } 103 | } 104 | 105 | &.pagination-danger{ 106 | .page-item.active > .page-link{ 107 | &, 108 | &:focus, 109 | &:hover{ 110 | background-color: $brand-danger; 111 | border-color: $brand-danger; 112 | } 113 | } 114 | } 115 | 116 | &.pagination-neutral{ 117 | .page-item > .page-link{ 118 | color: $white-color; 119 | 120 | &:focus, 121 | &:hover{ 122 | background-color: $opacity-2; 123 | color: $white-color; 124 | } 125 | } 126 | 127 | .page-item.active > .page-link{ 128 | &, 129 | &:focus, 130 | &:hover{ 131 | background-color: $white-bg; 132 | border-color: $white-bg; 133 | color: $brand-primary; 134 | } 135 | } 136 | } 137 | 138 | } 139 | 140 | .pagination-container{ 141 | display: flex; 142 | align-items: center; 143 | } 144 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_pills.scss: -------------------------------------------------------------------------------- 1 | .nav-pills{ 2 | 3 | &.nav-pills-just-icons{ 4 | .nav-item .nav-link{ 5 | text-align: center; 6 | border-radius: 50%; 7 | height: 80px; 8 | width: 80px; 9 | padding: 0; 10 | max-width: 80px; 11 | min-width: auto; 12 | margin-bottom: 4px; 13 | 14 | i{ 15 | line-height: 80px; 16 | } 17 | } 18 | } 19 | 20 | &:not(.flex-column) .nav-item { 21 | &:not(:last-child) .nav-link{ 22 | margin-right: 19px; 23 | } 24 | } 25 | 26 | .nav-item { 27 | .nav-link{ 28 | padding: $padding-btn-vertical - 1 $padding-round-horizontal; 29 | background-color: $opacity-gray-3; 30 | min-width: 100px; 31 | font-weight: $font-weight-normal; 32 | text-align: center; 33 | color: $light-black; 34 | 35 | 36 | &:hover{ 37 | background-color: $opacity-gray-3; 38 | } 39 | 40 | &.active{ 41 | &, 42 | &:focus, 43 | &:hover{ 44 | background-color: $dark-gray; 45 | color: $white-color; 46 | box-shadow: 0px 5px 35px 0px rgba(0, 0, 0, 0.3); 47 | } 48 | } 49 | 50 | &.disabled, 51 | &:disabled, 52 | &[disabled]{ 53 | opacity: .5; 54 | } 55 | } 56 | 57 | i{ 58 | display: block; 59 | line-height: 60px; 60 | font-size: 24px; 61 | } 62 | } 63 | 64 | &.nav-pills-neutral{ 65 | .nav-item { 66 | .nav-link{ 67 | background-color: $opacity-2; 68 | color: $white-color; 69 | 70 | &.active{ 71 | &, 72 | &:focus, 73 | &:hover{ 74 | background-color: $white-color; 75 | color: $primary-color; 76 | } 77 | } 78 | } 79 | } 80 | } 81 | 82 | &.nav-pills-primary{ 83 | .nav-item { 84 | .nav-link.active{ 85 | &, 86 | &:focus, 87 | &:hover{ 88 | background-color: $brand-primary; 89 | } 90 | } 91 | } 92 | } 93 | 94 | &.nav-pills-info{ 95 | .nav-item { 96 | .nav-link.active{ 97 | &, 98 | &:focus, 99 | &:hover{ 100 | background-color: $brand-info; 101 | } 102 | } 103 | } 104 | } 105 | 106 | &.nav-pills-success{ 107 | .nav-item { 108 | .nav-link.active{ 109 | &, 110 | &:focus, 111 | &:hover{ 112 | background-color: $brand-success; 113 | } 114 | } 115 | } 116 | } 117 | 118 | &.nav-pills-warning{ 119 | .nav-item { 120 | .nav-link.active{ 121 | &, 122 | &:focus, 123 | &:hover{ 124 | background-color: $brand-warning; 125 | } 126 | } 127 | } 128 | } 129 | 130 | &.nav-pills-danger{ 131 | .nav-item { 132 | .nav-link.active{ 133 | &, 134 | &:focus, 135 | &:hover{ 136 | background-color: $brand-danger; 137 | } 138 | } 139 | } 140 | } 141 | } 142 | .tab-space{ 143 | padding: 20px 0 50px 0px; 144 | } 145 | 146 | .nav-align-center{ 147 | text-align: center; 148 | 149 | .nav-pills{ 150 | display: inline-flex; 151 | } 152 | } 153 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_popups.scss: -------------------------------------------------------------------------------- 1 | .popover{ 2 | font-size: $font-size-base; 3 | box-shadow: 0px 10px 50px 0px rgba(0, 0, 0, 0.2); 4 | border: none; 5 | line-height: 1.7; 6 | max-width: 240px; 7 | 8 | &.bs-popover-top .arrow:before, 9 | &.bs-popover-left .arrow:before, 10 | &.bs-popover-right .arrow:before, 11 | &.bs-popover-bottom .arrow:before,{ 12 | border-top-color: transparent; 13 | border-left-color: transparent; 14 | border-right-color: transparent; 15 | border-bottom-color: transparent; 16 | } 17 | 18 | .popover-header{ 19 | color: $default-color-opacity; 20 | font-size: $font-size-base; 21 | text-transform: capitalize; 22 | font-weight: $font-weight-semi; 23 | margin: 0; 24 | margin-top: 5px; 25 | border: none; 26 | background-color: transparent; 27 | } 28 | 29 | &:before{ 30 | display: none; 31 | } 32 | 33 | &.bs-tether-element-attached-top:after{ 34 | border-bottom-color:$white-color; 35 | top: -9px; 36 | } 37 | 38 | &.popover-primary{ 39 | @include popover-color($primary-color, $white-color); 40 | } 41 | 42 | &.popover-info{ 43 | @include popover-color($info-color, $white-color); 44 | } 45 | 46 | &.popover-warning{ 47 | @include popover-color($warning-color, $white-color); 48 | } 49 | 50 | &.popover-danger{ 51 | @include popover-color($danger-color, $white-color); 52 | } 53 | 54 | &.popover-success{ 55 | @include popover-color($success-color, $white-color); 56 | } 57 | } 58 | 59 | 60 | .tooltip{ 61 | &.bs-tooltip-right .arrow:before{ 62 | border-right-color:$white-color; 63 | } 64 | 65 | &.bs-tooltip-top .arrow:before{ 66 | border-top-color:$white-color; 67 | } 68 | 69 | &.bs-tooltip-bottom .arrow:before{ 70 | border-bottom-color:$white-color; 71 | } 72 | 73 | &.bs-tooltip-left .arrow:before{ 74 | border-left-color:$white-color; 75 | } 76 | } 77 | 78 | .tooltip-inner{ 79 | padding: $padding-base-vertical $padding-base-horizontal; 80 | min-width: 130px; 81 | background-color: $white-color; 82 | font-size: $font-size-base; 83 | color: inherit; 84 | box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.2); 85 | } 86 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_progress.scss: -------------------------------------------------------------------------------- 1 | // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. 2 | .progress-container{ 3 | position: relative; 4 | 5 | & + .progress-container, 6 | & ~ .progress-container{ 7 | margin-top: $margin-base-vertical; 8 | } 9 | .progress-badge{ 10 | color: $default-color; 11 | font-size: $font-size-small; 12 | text-transform: uppercase; 13 | 14 | } 15 | 16 | .progress { 17 | height: 1px; 18 | border-radius: 0; 19 | box-shadow: none; 20 | background: $opacity-gray-8; 21 | margin-top: 14px; 22 | 23 | .progress-bar { 24 | box-shadow: none; 25 | background-color: $default-color; 26 | } 27 | 28 | .progress-value{ 29 | position: absolute; 30 | top: 2px; 31 | right: 0; 32 | color: $default-color; 33 | font-size: $font-size-small; 34 | } 35 | } 36 | 37 | &.progress-neutral{ 38 | .progress{ 39 | background: rgba(255, 255, 255, .3); 40 | } 41 | 42 | .progress-bar{ 43 | background: $white-bg; 44 | } 45 | 46 | .progress-value, 47 | .progress-badge{ 48 | color: $white-color; 49 | } 50 | } 51 | 52 | &.progress-primary{ 53 | .progress{ 54 | background: $primary-color-opacity; 55 | } 56 | 57 | .progress-bar{ 58 | background: $brand-primary; 59 | } 60 | 61 | .progress-value, 62 | .progress-badge{ 63 | color: $brand-primary; 64 | } 65 | } 66 | 67 | &.progress-info{ 68 | .progress{ 69 | background: $info-color-opacity; 70 | } 71 | 72 | .progress-bar{ 73 | background: $brand-info; 74 | } 75 | 76 | .progress-value, 77 | .progress-badge{ 78 | color: $brand-info; 79 | } 80 | } 81 | 82 | &.progress-success{ 83 | .progress{ 84 | background: $success-color-opacity; 85 | } 86 | 87 | .progress-bar{ 88 | background: $brand-success; 89 | } 90 | 91 | .progress-value, 92 | .progress-badge{ 93 | color: $brand-success; 94 | } 95 | } 96 | 97 | &.progress-warning{ 98 | .progress{ 99 | background: $warning-color-opacity; 100 | } 101 | 102 | .progress-bar{ 103 | background: $brand-warning; 104 | } 105 | 106 | .progress-value, 107 | .progress-badge{ 108 | color: $brand-warning; 109 | } 110 | } 111 | 112 | &.progress-danger{ 113 | .progress{ 114 | background: $danger-color-opacity; 115 | } 116 | 117 | .progress-bar{ 118 | background: $brand-danger; 119 | } 120 | 121 | .progress-value, 122 | .progress-badge{ 123 | color: $brand-danger; 124 | } 125 | } 126 | } 127 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_sections.scss: -------------------------------------------------------------------------------- 1 | .section{ 2 | padding: 70px 0; 3 | position: relative; 4 | background: $white-color; 5 | 6 | .row + .category{ 7 | margin-top: $margin-base-vertical; 8 | } 9 | } 10 | .section-navbars{ 11 | padding-bottom: 0; 12 | } 13 | 14 | .section-full-screen{ 15 | height: 100vh; 16 | } 17 | .section-signup{ 18 | padding-top: 20vh; 19 | } 20 | 21 | .page-header{ 22 | min-height: 100vh; 23 | max-height: 999px; 24 | padding: 0; 25 | color: $white-color; 26 | position: relative; 27 | overflow: hidden; 28 | 29 | & > .content{ 30 | margin-top: 12%; 31 | text-align: center; 32 | margin-bottom: 50px; 33 | } 34 | 35 | &.page-header-small{ 36 | min-height: 60vh; 37 | max-height: 440px; 38 | } 39 | 40 | &:before{ 41 | background-color: rgba(0,0,0,.3); 42 | } 43 | 44 | > .container{ 45 | z-index: 2; 46 | padding-top: 12vh; 47 | padding-bottom: 40px; 48 | } 49 | 50 | .page-header-image{ 51 | position: absolute; 52 | background-size: cover; 53 | background-position: center center; 54 | width: 100%; 55 | height: 100%; 56 | z-index: -1; 57 | } 58 | 59 | .content-center{ 60 | position: absolute; 61 | top: 50%; 62 | left: 50%; 63 | z-index: 2; 64 | -ms-transform: translate(-50%, -50%); 65 | -webkit-transform: translate(-50%, -50%); 66 | transform: translate(-50%, -50%); 67 | text-align: center; 68 | color: #FFFFFF; 69 | padding: 0 15px; 70 | width: 100%; 71 | max-width: 880px; 72 | 73 | } 74 | 75 | footer{ 76 | position: absolute; 77 | bottom: 0; 78 | width: 100%; 79 | } 80 | .container{ 81 | height: 100%; 82 | z-index: 1; 83 | text-align: center; 84 | position: relative; 85 | } 86 | 87 | .category, 88 | .description{ 89 | color: $opacity-8; 90 | } 91 | 92 | &:after, 93 | &:before{ 94 | position: absolute; 95 | z-index: 0; 96 | width: 100%; 97 | height: 100%; 98 | display: block; 99 | left: 0; 100 | top: 0; 101 | content: ""; 102 | } 103 | } 104 | 105 | .clear-filter{ 106 | &:after, 107 | &:before{ 108 | display: none; 109 | } 110 | 111 | &[filter-color="orange"]{ 112 | @include linear-gradient(rgba($black-color,.20), rgba(224, 23, 3, 0.6)); 113 | } 114 | } 115 | 116 | .section-story-overview{ 117 | padding: 50px 0; 118 | 119 | .image-container{ 120 | height: 335px; 121 | position: relative; 122 | background-position: center center; 123 | background-size: cover; 124 | box-shadow: $box-shadow-raised; 125 | border-radius: .25rem; 126 | 127 | & + .category{ 128 | padding-top: 15px; 129 | } 130 | 131 | &.image-right{ 132 | z-index: 2; 133 | 134 | + h3.title{ 135 | margin-top: 120px; 136 | } 137 | } 138 | 139 | &.image-left{ 140 | z-index: 1; 141 | } 142 | 143 | &:nth-child(2){ 144 | margin-top: 420px; 145 | margin-left: -105px; 146 | } 147 | } 148 | 149 | p.blockquote{ 150 | width: 220px; 151 | min-height: 180px; 152 | text-align: left; 153 | position: absolute; 154 | top: 376px; 155 | right: 155px; 156 | z-index: 0; 157 | } 158 | } 159 | 160 | .section-nucleo-icons{ 161 | .nucleo-container img{ 162 | width: auto; 163 | left: 0; 164 | top: 0; 165 | height: 100%; 166 | position: absolute; 167 | } 168 | 169 | .nucleo-container{ 170 | height: 335px; 171 | position: relative; 172 | } 173 | 174 | h5{ 175 | margin-bottom: 35px; 176 | } 177 | 178 | .icons-container{ 179 | position: relative; 180 | max-width: 450px; 181 | height: 300px; 182 | max-height: 300px; 183 | margin: 0 auto; 184 | 185 | } 186 | .icons-container i{ 187 | font-size: 34px; 188 | position: absolute; 189 | left: 0; 190 | top: 0; 191 | } 192 | 193 | .icons-container i:nth-child(1){ 194 | top: 5%; 195 | left: 7%; 196 | } 197 | 198 | .icons-container i:nth-child(2){ 199 | top: 28%; 200 | left: 24%; 201 | } 202 | 203 | .icons-container i:nth-child(3){ 204 | top: 40%; 205 | } 206 | 207 | .icons-container i:nth-child(4){ 208 | top: 18%; 209 | left: 62%; 210 | } 211 | 212 | .icons-container i:nth-child(5){ 213 | top: 74%; 214 | left: 3%; 215 | } 216 | 217 | .icons-container i:nth-child(6){ 218 | top: 36%; 219 | left: 44%; 220 | font-size: 65px; 221 | color: #f96332; 222 | padding: 1px; 223 | } 224 | 225 | .icons-container i:nth-child(7){ 226 | top: 59%; 227 | left: 26%; 228 | } 229 | 230 | .icons-container i:nth-child(8){ 231 | top: 60%; 232 | left: 69%; 233 | } 234 | 235 | .icons-container i:nth-child(9){ 236 | top: 72%; 237 | left: 47%; 238 | } 239 | 240 | .icons-container i:nth-child(10){ 241 | top: 88%; 242 | left: 27%; 243 | } 244 | 245 | .icons-container i:nth-child(11){ 246 | top: 31%; 247 | left: 80%; 248 | } 249 | 250 | .icons-container i:nth-child(12){ 251 | top: 88%; 252 | left: 68%; 253 | } 254 | 255 | .icons-container i:nth-child(13){ 256 | top: 5%; 257 | left: 81%; 258 | } 259 | 260 | .icons-container i:nth-child(14){ 261 | top: 58%; 262 | left: 90%; 263 | } 264 | 265 | .icons-container i:nth-child(15){ 266 | top: 6%; 267 | left: 40%; 268 | } 269 | } 270 | 271 | .section-images{ 272 | max-height: 670px; 273 | height: 670px; 274 | 275 | .hero-images-container, 276 | .hero-images-container-1, 277 | .hero-images-container-2{ 278 | margin-top: -38vh; 279 | } 280 | 281 | .hero-images-container{ 282 | max-width: 670px; 283 | } 284 | 285 | .hero-images-container-1{ 286 | max-width: 390px; 287 | position: absolute; 288 | top: 55%; 289 | right: 18%; 290 | 291 | } 292 | 293 | .hero-images-container-2{ 294 | max-width: 225px; 295 | position: absolute; 296 | top: 68%; 297 | right: 12%; 298 | } 299 | } 300 | 301 | 302 | [data-background-color="orange"]{ 303 | background-color: $orange-bg; 304 | } 305 | [data-background-color="black"]{ 306 | background-color: $black-color; 307 | } 308 | 309 | [data-background-color]:not([data-background-color="gray"]){ 310 | color: $white-color; 311 | 312 | .title, 313 | .social-description h2, 314 | p, 315 | p.blockquote, 316 | p.blockquote small{ 317 | color: $white-color; 318 | } 319 | 320 | .separator{ 321 | background-color: $white-color; 322 | } 323 | 324 | .navbar.bg-white p{ 325 | color: $default-color; 326 | } 327 | 328 | h1,h2,h3,h4,h5,h6,a:not(.btn):not(.dropdown-item), 329 | .icons-container{ 330 | color: $white-color; 331 | } 332 | 333 | .input-group-text, 334 | .form-group.no-border .input-group-text, 335 | .input-group.no-border .input-group-text{ 336 | color: $opacity-8; 337 | } 338 | 339 | .description, 340 | .social-description p{ 341 | color: $opacity-8; 342 | } 343 | 344 | p.blockquote{ 345 | border-color: $opacity-2; 346 | } 347 | 348 | //radio and checkboxes 349 | .checkbox label::before, 350 | .checkbox label::after, 351 | .radio label::before, 352 | .radio label::after{ 353 | border-color: $opacity-2; 354 | } 355 | 356 | .checkbox label::after, 357 | .checkbox label, 358 | .radio label{ 359 | color: $white-color; 360 | } 361 | 362 | .checkbox input[type="checkbox"]:disabled + label, 363 | .radio input[type="radio"]:disabled + label { 364 | color: $white-color; 365 | } 366 | 367 | .radio input[type="radio"]:not(:disabled):hover + label::after, 368 | .radio input[type="radio"]:checked + label::after { 369 | background-color: $white-color; 370 | border-color: $white-color; 371 | } 372 | 373 | //inputs 374 | @include input-coloured-bg($opacity-5, $white-color, $white-color, $transparent-bg, $opacity-1, $opacity-2); 375 | 376 | //buttons 377 | .btn[class*="btn-outline-"] { 378 | background-color: $transparent-bg; 379 | border-color: $opacity-5; 380 | color: $white-color; 381 | 382 | &:hover, 383 | &:focus, 384 | &:not(:disabled):not(.disabled):active, 385 | &:not(:disabled):not(.disabled).active, 386 | &:not(:disabled):not(.disabled):active:focus, 387 | &:not(:disabled):not(.disabled).active:focus, 388 | &:active:hover, 389 | &.active:hover, 390 | .show > &.dropdown-toggle, 391 | .show > &.dropdown-toggle:focus, 392 | .show > &.dropdown-toggle:hover { 393 | background-color: $transparent-bg; 394 | border-color: $white-color; 395 | color: $white-color; 396 | } 397 | } 398 | 399 | //tabs 400 | .nav-tabs{ 401 | > .nav-item{ 402 | >.nav-link{ 403 | i.now-ui-icons{ 404 | color: $white-color; 405 | } 406 | } 407 | } 408 | } 409 | 410 | &.section-nucleo-icons .icons-container i:nth-child(6){ 411 | color: $white-color; 412 | } 413 | } 414 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_tabs.scss: -------------------------------------------------------------------------------- 1 | // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. 2 | 3 | .nav-tabs { 4 | border: 0; 5 | padding: $padding-large-vertical $padding-base-horizontal; 6 | 7 | &:not(.nav-tabs-neutral) > .nav-item > .nav-link.active{ 8 | box-shadow: 0px 5px 35px 0px rgba(0, 0, 0, 0.3); 9 | } 10 | 11 | .card &{ 12 | border-top-right-radius: $border-radius-small; 13 | border-top-left-radius: $border-radius-small; 14 | } 15 | 16 | > .nav-item{ 17 | > .nav-link{ 18 | color: $default-color; 19 | margin: 0; 20 | margin-right: 5px; 21 | background-color: $transparent-bg; 22 | border: 1px solid $transparent-bg; 23 | border-radius: 30px; 24 | font-size: $font-size-base; 25 | padding: $padding-btn-vertical $padding-round-horizontal; 26 | line-height: $line-height-general; 27 | 28 | &:hover { 29 | background-color: $transparent-bg; 30 | } 31 | 32 | &.active{ 33 | background-color: $light-black; 34 | border-radius: 30px; 35 | color: $white-color; 36 | } 37 | 38 | i.now-ui-icons{ 39 | font-size: 14px; 40 | position: relative; 41 | top: 1px; 42 | margin-right: 3px; 43 | } 44 | } 45 | 46 | &.disabled > .nav-link, 47 | &.disabled > .nav-link:hover { 48 | color: rgba(255,255,255,0.5); 49 | } 50 | } 51 | 52 | &.nav-tabs-neutral{ 53 | > .nav-item{ 54 | > .nav-link{ 55 | color: $white-color; 56 | 57 | &.active{ 58 | background-color: $opacity-2; 59 | color: $white-color; 60 | } 61 | } 62 | } 63 | } 64 | 65 | &.nav-tabs-primary{ 66 | > .nav-item{ 67 | > .nav-link{ 68 | &.active{ 69 | background-color: $primary-color; 70 | } 71 | } 72 | } 73 | } 74 | 75 | &.nav-tabs-info{ 76 | > .nav-item{ 77 | > .nav-link{ 78 | &.active{ 79 | background-color: $info-color; 80 | } 81 | } 82 | } 83 | } 84 | 85 | &.nav-tabs-danger{ 86 | > .nav-item{ 87 | > .nav-link{ 88 | &.active{ 89 | background-color: $danger-color; 90 | } 91 | } 92 | } 93 | } 94 | 95 | &.nav-tabs-warning{ 96 | > .nav-item{ 97 | > .nav-link{ 98 | &.active{ 99 | background-color: $warning-color; 100 | } 101 | } 102 | } 103 | } 104 | 105 | &.nav-tabs-success{ 106 | > .nav-item{ 107 | > .nav-link{ 108 | &.active{ 109 | background-color: $success-color; 110 | } 111 | } 112 | } 113 | } 114 | 115 | } 116 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/_typography.scss: -------------------------------------------------------------------------------- 1 | button, 2 | input, 3 | optgroup, 4 | select, 5 | textarea{ 6 | font-family: $sans-serif-family; 7 | } 8 | h1,h2,h3,h4,h5,h6{ 9 | font-weight: $font-weight-normal; 10 | } 11 | 12 | small{ 13 | font-size: 60%; 14 | } 15 | 16 | a{ 17 | color: $primary-color; 18 | &:hover, 19 | &:focus{ 20 | color: $primary-color; 21 | } 22 | } 23 | h1, .h1 { 24 | font-size: $font-size-h1; 25 | line-height: 1.15; 26 | margin-bottom: $margin-base-vertical * 2; 27 | 28 | small{ 29 | font-weight: $font-weight-bold; 30 | text-transform: uppercase; 31 | opacity: .8; 32 | } 33 | } 34 | h2, .h2{ 35 | font-size: $font-size-h2; 36 | margin-bottom: $margin-base-vertical * 2; 37 | } 38 | h3, .h3{ 39 | font-size: $font-size-h3; 40 | margin-bottom: $margin-base-vertical * 2; 41 | line-height: 1.4em; 42 | } 43 | h4, .h4{ 44 | font-size: $font-size-h4; 45 | line-height: 1.45em; 46 | margin-top: $margin-base-vertical * 2; 47 | margin-bottom: $margin-base-vertical; 48 | 49 | & + .category, 50 | &.title + .category{ 51 | margin-top: -5px; 52 | } 53 | } 54 | h5, .h5 { 55 | font-size: $font-size-h5; 56 | line-height: 1.4em; 57 | margin-bottom: 15px; 58 | 59 | &.category{ 60 | font-weight: 400; 61 | } 62 | } 63 | h6, .h6{ 64 | font-size: $font-size-h6; 65 | font-weight: $font-weight-bold; 66 | text-transform: uppercase; 67 | } 68 | p{ 69 | line-height: 1.61em; 70 | font-weight: 300; 71 | font-size: 1.2em; 72 | } 73 | 74 | .title{ 75 | font-weight: $font-weight-bold; 76 | padding-top: 30px; 77 | 78 | 79 | &.title-up{ 80 | text-transform: uppercase; 81 | 82 | a{ 83 | color: $black-color; 84 | text-decoration: none; 85 | } 86 | } 87 | & + .category{ 88 | margin-top: -25px; 89 | } 90 | } 91 | 92 | .description, 93 | .card-description, 94 | .footer-big p{ 95 | color: $dark-gray; 96 | font-weight: $font-weight-light; 97 | } 98 | .category{ 99 | text-transform: capitalize; 100 | font-weight: $font-weight-bold; 101 | color: $dark-gray; 102 | } 103 | .text-primary { 104 | color: $brand-primary !important; 105 | } 106 | .text-info { 107 | color: $brand-info !important; 108 | } 109 | .text-success { 110 | color: $brand-success !important; 111 | } 112 | .text-warning { 113 | color: $brand-warning !important; 114 | } 115 | .text-danger { 116 | color: $brand-danger !important; 117 | } 118 | .text-black{ 119 | color: $light-black; 120 | } 121 | 122 | .blockquote{ 123 | border-left: none; 124 | border: 1px solid $default-color; 125 | padding: 20px; 126 | font-size: $font-size-blockquote; 127 | line-height: 1.8; 128 | 129 | small{ 130 | color: $default-color; 131 | font-size: $font-size-small; 132 | text-transform: uppercase; 133 | } 134 | 135 | &.blockquote-primary{ 136 | border-color: $primary-color; 137 | color: $primary-color; 138 | 139 | small{ 140 | color: $primary-color; 141 | } 142 | } 143 | 144 | &.blockquote-danger{ 145 | border-color: $danger-color; 146 | color: $danger-color; 147 | 148 | small{ 149 | color: $danger-color; 150 | } 151 | } 152 | 153 | &.blockquote-white{ 154 | border-color: $opacity-8; 155 | color: $white-color; 156 | 157 | small{ 158 | color: $opacity-8; 159 | } 160 | } 161 | } 162 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/cards/_card-plain.scss: -------------------------------------------------------------------------------- 1 | .card-plain{ 2 | background: transparent; 3 | box-shadow: none; 4 | 5 | .card-body, 6 | .card-header{ 7 | padding-left: 5px; 8 | padding-right: 5px; 9 | } 10 | 11 | .card-header:after{ 12 | width: 100%; 13 | left: 0; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/cards/_card-signup.scss: -------------------------------------------------------------------------------- 1 | .card-signup{ 2 | max-width: 350px; 3 | margin: 0 auto; 4 | 5 | .card-header{ 6 | margin:0 20px; 7 | padding: 30px 0; 8 | } 9 | 10 | .card-title{ 11 | margin-top: 15px; 12 | margin-bottom: 15px; 13 | } 14 | 15 | .card-footer { 16 | margin-bottom: 10px; 17 | margin-top: 24px; 18 | padding: 24px 0; 19 | } 20 | 21 | .card-body{ 22 | padding-top: 0px; 23 | padding-bottom: 0px; 24 | min-height: auto; 25 | } 26 | 27 | .form-check, 28 | .form-check.form-check-radio{ 29 | margin-top: 20px; 30 | 31 | label{ 32 | margin-left: 11px; 33 | color: initial; 34 | padding-left: 40px; 35 | } 36 | } 37 | 38 | .card-description{ 39 | margin-top: 15px; 40 | margin-bottom: 20px; 41 | } 42 | 43 | .social-line{ 44 | margin-top: 20px; 45 | text-align: center; 46 | 47 | .btn.btn-icon , 48 | .btn.btn-icon .btn-icon{ 49 | margin-left: 5px; 50 | margin-right: 5px; 51 | margin-top: 0; 52 | margin-bottom: 0; 53 | box-shadow: 0px 5px 50px 0px rgba(0, 0, 0, 0.2); 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_badges.scss: -------------------------------------------------------------------------------- 1 | @mixin badge-color($color) { 2 | 3 | &, 4 | &[href]:focus, 5 | &[href]:hover{ 6 | border-color: $color; 7 | background-color: $color; 8 | color: $white-color; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_buttons.scss: -------------------------------------------------------------------------------- 1 | // Mixin for generating new styles 2 | @mixin btn-styles($btn-color, $btn-states-color) { 3 | background-color: $btn-color; 4 | 5 | 6 | 7 | &:hover, 8 | &:focus, 9 | &:not(:disabled):not(.disabled):active, 10 | &:not(:disabled):not(.disabled).active, 11 | &:not(:disabled):not(.disabled):active:focus, 12 | &:not(:disabled):not(.disabled).active:focus, 13 | &:active:hover, 14 | &.active:hover, 15 | .show > &.dropdown-toggle, 16 | .show > &.dropdown-toggle:focus, 17 | .show > &.dropdown-toggle:hover { 18 | background-color: $btn-states-color; 19 | color: $white-color; 20 | box-shadow: none; 21 | } 22 | 23 | &:hover{ 24 | box-shadow: 0 3px 8px 0 rgba(0,0,0, 0.17); 25 | } 26 | 27 | &.disabled, 28 | &:disabled, 29 | &[disabled], 30 | fieldset[disabled] & { 31 | &, 32 | &:hover, 33 | &:focus, 34 | &.focus, 35 | &:active, 36 | &.active { 37 | background-color: $btn-color; 38 | border-color: $btn-color; 39 | } 40 | } 41 | 42 | // btn-neutral style 43 | @if $btn-color == $white-color{ 44 | color: $primary-color; 45 | 46 | 47 | &.btn-danger{ 48 | color: $danger-color; 49 | 50 | &:hover, 51 | &:focus, 52 | &:active{ 53 | color: $danger-states-color !important; 54 | } 55 | } 56 | 57 | &.btn-primary{ 58 | color: $primary-color; 59 | 60 | &:hover, 61 | &:focus, 62 | &:active{ 63 | color: $primary-states-color !important; 64 | } 65 | } 66 | 67 | &.btn-info{ 68 | color: $info-color; 69 | 70 | &:hover, 71 | &:focus, 72 | &:active{ 73 | color: $info-states-color !important; 74 | } 75 | } 76 | 77 | &.btn-warning{ 78 | color: $warning-color; 79 | 80 | &:hover, 81 | &:focus, 82 | &:active{ 83 | color: $warning-states-color !important; 84 | } 85 | } 86 | 87 | &.btn-success{ 88 | color: $success-color; 89 | 90 | &:hover, 91 | &:focus, 92 | &:active{ 93 | color: $success-states-color !important; 94 | } 95 | } 96 | 97 | &.btn-default{ 98 | color: $default-color; 99 | 100 | &:hover, 101 | &:focus, 102 | &:active{ 103 | color: $default-states-color !important; 104 | } 105 | } 106 | 107 | &:hover, 108 | &:focus, 109 | &:not(:disabled):not(.disabled):active, 110 | &:not(:disabled):not(.disabled).active, 111 | &:not(:disabled):not(.disabled):active:focus, 112 | &:not(:disabled):not(.disabled).active:focus, 113 | &:active:hover, 114 | &.active:hover, 115 | .show > &.dropdown-toggle, 116 | .show > &.dropdown-toggle:focus, 117 | .show > &.dropdown-toggle:hover { 118 | background-color: $white-color; 119 | color: $primary-states-color; 120 | box-shadow: none; 121 | } 122 | 123 | &:hover, 124 | &:focus{ 125 | color: $primary-states-color !important; 126 | 127 | &:not(.nav-link){ 128 | box-shadow: none; 129 | } 130 | 131 | } 132 | 133 | } @else { 134 | color: $white-color; 135 | } 136 | 137 | &.btn-simple{ 138 | color: $btn-color; 139 | border-color: $btn-color; 140 | 141 | &:hover, 142 | &:focus, 143 | &:not(:disabled):not(.disabled):active, 144 | &:not(:disabled):not(.disabled).active, 145 | &:not(:disabled):not(.disabled):active:focus, 146 | &:not(:disabled):not(.disabled).active:focus, 147 | &:active:hover, 148 | &.active:hover, 149 | .show > &.dropdown-toggle, 150 | .show > &.dropdown-toggle:focus, 151 | .show > &.dropdown-toggle:hover{ 152 | background-color: $transparent-bg; 153 | color: $btn-states-color; 154 | border-color: $btn-states-color; 155 | box-shadow: none; 156 | } 157 | } 158 | 159 | &.btn-link{ 160 | color: $btn-color; 161 | 162 | &:hover, 163 | &:focus, 164 | &:not(:disabled):not(.disabled):active, 165 | &:not(:disabled):not(.disabled).active, 166 | &:not(:disabled):not(.disabled):active:focus, 167 | &:not(:disabled):not(.disabled).active:focus, 168 | &:active:hover, 169 | &.active:hover, 170 | .show > &.dropdown-toggle, 171 | .show > &.dropdown-toggle:focus, 172 | .show > &.dropdown-toggle:hover{ 173 | background-color: $transparent-bg; 174 | color: $btn-states-color; 175 | text-decoration: none; 176 | box-shadow: none; 177 | } 178 | } 179 | } 180 | 181 | @mixin outline-buttons($btn-color, $btn-states-color) { 182 | color: $btn-color; 183 | border-color: $btn-color; 184 | 185 | &:hover, 186 | &:focus, 187 | &:not(:disabled):not(.disabled):active, 188 | &:not(:disabled):not(.disabled).active, 189 | &:not(:disabled):not(.disabled):active:focus, 190 | &:not(:disabled):not(.disabled).active:focus, 191 | &:active:hover, 192 | &.active:hover, 193 | .show > &.dropdown-toggle, 194 | .show > &.dropdown-toggle:focus, 195 | .show > &.dropdown-toggle:hover { 196 | background-color: $transparent-bg; 197 | color: $btn-states-color; 198 | border-color: $btn-states-color; 199 | box-shadow: none; 200 | } 201 | } 202 | 203 | 204 | @mixin btn-size($padding-vertical, $padding-horizontal, $font-size, $border){ 205 | font-size: $font-size; 206 | border-radius: $border; 207 | padding: $padding-vertical $padding-horizontal; 208 | 209 | &[class*="btn-outline-"] { 210 | padding: $padding-vertical - 1 $padding-horizontal - 1; 211 | } 212 | 213 | } 214 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_cards.scss: -------------------------------------------------------------------------------- 1 | @mixin icon-color($color) { 2 | box-shadow: 0px 9px 30px -6px $color; 3 | color: $color; 4 | } 5 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_datepicker.scss: -------------------------------------------------------------------------------- 1 | @mixin datepicker-colors($color) { 2 | background-color: $color; 3 | 4 | th, 5 | .day div, 6 | table tr td span{ 7 | color: $white-color; 8 | } 9 | 10 | &:after{ 11 | border-bottom-color: $color; 12 | } 13 | 14 | &.datepicker-orient-top:after{ 15 | border-top-color: $color; 16 | } 17 | 18 | .dow{ 19 | color: $datepicker-color-days; 20 | } 21 | 22 | table tr td.old div, 23 | table tr td.new div, 24 | table tr td span.old, 25 | table tr td span.new{ 26 | color: $datepicker-color-old-new-days; 27 | } 28 | 29 | table tr td span:hover, 30 | table tr td span.focused{ 31 | background:$opacity-1; 32 | } 33 | 34 | .datepicker-switch:hover, 35 | .prev:hover, 36 | .next:hover, 37 | tfoot tr th:hover { 38 | background: $opacity-2; 39 | } 40 | 41 | table tr td.active div, 42 | table tr td.active:hover div, 43 | table tr td.active.disabled div, 44 | table tr td.active.disabled:hover div { 45 | 46 | background-color: $white-color; 47 | color: $color; 48 | } 49 | 50 | table tr td.day:hover div, 51 | table tr td.day.focused div { 52 | background: $opacity-2; 53 | } 54 | 55 | table tr td.active:hover div, 56 | table tr td.active:hover:hover div, 57 | table tr td.active.disabled:hover div, 58 | table tr td.active.disabled:hover:hover div, 59 | table tr td.active:active div, 60 | table tr td.active:hover:active div, 61 | table tr td.active.disabled:active div, 62 | table tr td.active.disabled:hover:active div, 63 | table tr td.active.active div, 64 | table tr td.active:hover.active div, 65 | table tr td.active.disabled.active div, 66 | table tr td.active.disabled:hover.active div, 67 | table tr td.active.disabled div, 68 | table tr td.active:hover.disabled div, 69 | table tr td.active.disabled.disabled div, 70 | table tr td.active.disabled:hover.disabled div, 71 | table tr td.active[disabled] div, 72 | table tr td.active:hover[disabled] div, 73 | table tr td.active.disabled[disabled] div, 74 | table tr td.active.disabled:hover[disabled] div, 75 | table tr td span.active:hover, 76 | table tr td span.active:hover:hover, 77 | table tr td span.active.disabled:hover, 78 | table tr td span.active.disabled:hover:hover, 79 | table tr td span.active:active, 80 | table tr td span.active:hover:active, 81 | table tr td span.active.disabled:active, 82 | table tr td span.active.disabled:hover:active, 83 | table tr td span.active.active, 84 | table tr td span.active:hover.active, 85 | table tr td span.active.disabled.active, 86 | table tr td span.active.disabled:hover.active, 87 | table tr td span.active.disabled, 88 | table tr td span.active:hover.disabled, 89 | table tr td span.active.disabled.disabled, 90 | table tr td span.active.disabled:hover.disabled, 91 | table tr td span.active[disabled], 92 | table tr td span.active:hover[disabled], 93 | table tr td span.active.disabled[disabled], 94 | table tr td span.active.disabled:hover[disabled]{ 95 | background-color: $white-color; 96 | } 97 | 98 | table tr td span.active:hover, 99 | table tr td span.active:hover:hover, 100 | table tr td span.active.disabled:hover, 101 | table tr td span.active.disabled:hover:hover, 102 | table tr td span.active:active, 103 | table tr td span.active:hover:active, 104 | table tr td span.active.disabled:active, 105 | table tr td span.active.disabled:hover:active, 106 | table tr td span.active.active, 107 | table tr td span.active:hover.active, 108 | table tr td span.active.disabled.active, 109 | table tr td span.active.disabled:hover.active, 110 | table tr td span.active.disabled, 111 | table tr td span.active:hover.disabled, 112 | table tr td span.active.disabled.disabled, 113 | table tr td span.active.disabled:hover.disabled, 114 | table tr td span.active[disabled], 115 | table tr td span.active:hover[disabled], 116 | table tr td span.active.disabled[disabled], 117 | table tr td span.active.disabled:hover[disabled]{ 118 | color: $color; 119 | } 120 | 121 | } 122 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_dropdown.scss: -------------------------------------------------------------------------------- 1 | @mixin dropdown-colors($brand-color, $dropdown-header-color, $dropdown-color, $background-color ) { 2 | background-color: $brand-color; 3 | 4 | &:before{ 5 | color: $brand-color; 6 | } 7 | 8 | .dropdown-header:not([href]):not([tabindex]){ 9 | color: $dropdown-header-color; 10 | } 11 | 12 | .dropdown-item{ 13 | color: $dropdown-color; 14 | 15 | &:hover, 16 | &:focus{ 17 | background-color: $background-color; 18 | } 19 | } 20 | 21 | .dropdown-divider{ 22 | background-color: $background-color; 23 | } 24 | } 25 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_inputs.scss: -------------------------------------------------------------------------------- 1 | @mixin input-size($padding-vertical, $padding-horizontal){ 2 | padding: $padding-vertical $padding-horizontal; 3 | } 4 | 5 | @mixin form-control-placeholder($color, $opacity){ 6 | .form-control::-moz-placeholder{ 7 | color: $color; 8 | @include opacity($opacity); 9 | } 10 | .form-control:-moz-placeholder{ 11 | color: $color; 12 | @include opacity($opacity); 13 | } 14 | .form-control::-webkit-input-placeholder{ 15 | color: $color; 16 | @include opacity($opacity); 17 | } 18 | .form-control:-ms-input-placeholder{ 19 | color: $color; 20 | @include opacity($opacity); 21 | } 22 | } 23 | 24 | @mixin light-form(){ 25 | border-radius: 0; 26 | border:0; 27 | padding: 0; 28 | background-color: transparent; 29 | 30 | } 31 | 32 | 33 | @mixin input-lg-padding($padding-vertical, $padding-horizontal) { 34 | .form-group.no-border.input-lg, 35 | .input-group.no-border.input-lg{ 36 | .input-group-text{ 37 | padding: $padding-vertical 0 $padding-vertical $padding-horizontal; 38 | } 39 | 40 | .form-control{ 41 | padding: $padding-vertical $padding-horizontal; 42 | 43 | & + .input-group-text{ 44 | padding: $padding-vertical $padding-horizontal $padding-vertical 0; 45 | } 46 | } 47 | } 48 | 49 | .form-group.input-lg, 50 | .input-group.input-lg{ 51 | .form-control{ 52 | padding: $padding-vertical - 1 $padding-horizontal - 1; 53 | 54 | & + .input-group-text{ 55 | padding: $padding-vertical - 1 $padding-horizontal - 1 $padding-vertical - 1 0; 56 | } 57 | } 58 | 59 | .input-group-text{ 60 | padding: $padding-vertical - 1 0 $padding-vertical $padding-horizontal - 1; 61 | 62 | & + .form-control{ 63 | padding: $padding-vertical $padding-horizontal - 1 $padding-vertical $padding-horizontal - 3; 64 | } 65 | } 66 | } 67 | } 68 | 69 | 70 | 71 | @mixin input-base-padding($padding-vertical, $padding-horizontal) { 72 | .form-group.no-border, 73 | .input-group.no-border{ 74 | .form-control{ 75 | padding: $padding-vertical $padding-horizontal; 76 | 77 | & + .input-group-text{ 78 | padding: $padding-vertical $padding-horizontal $padding-vertical 0; 79 | } 80 | } 81 | 82 | .input-group-text{ 83 | padding: $padding-vertical 0 $padding-vertical $padding-horizontal; 84 | } 85 | } 86 | 87 | .form-group, 88 | .input-group{ 89 | .form-control{ 90 | padding: $padding-vertical - 1 $padding-horizontal - 1 $padding-vertical - 1 $padding-horizontal - 1; 91 | 92 | & + .input-group-text{ 93 | padding: $padding-vertical - 1 $padding-horizontal - 1 $padding-vertical - 1 0; 94 | } 95 | } 96 | 97 | .input-group-text{ 98 | padding: $padding-vertical - 1 0 $padding-vertical - 1 $padding-horizontal - 1; 99 | 100 | & + .form-control, 101 | & ~ .form-control{ 102 | padding:$padding-vertical - 1 $padding-horizontal $padding-vertical $padding-horizontal - 3; 103 | } 104 | } 105 | } 106 | } 107 | 108 | 109 | //color1 = $opacity-5 110 | //color2 = $opacity-8 111 | //color3 = $white-color 112 | //color4 = $transparent-bg 113 | //color5 = $opacity-1 114 | //color6 = $opacity-2 115 | 116 | 117 | @mixin input-coloured-bg($color1, $color2, $color3, $color4, $color5, $color6) { 118 | @include form-control-placeholder(darken($color2, 8%), 1); 119 | 120 | .form-control{ 121 | border-color: $color1; 122 | color: $color2; 123 | 124 | &:focus{ 125 | border-color: $color3; 126 | background-color: $color4; 127 | color: $color3; 128 | } 129 | } 130 | 131 | .has-success, 132 | .has-danger{ 133 | &:after{ 134 | color: $color3; 135 | } 136 | } 137 | 138 | .has-danger{ 139 | .form-control{ 140 | background-color: $color4; 141 | } 142 | } 143 | 144 | .input-group-text{ 145 | background-color: $color4; 146 | border-color: $color1; 147 | color: $color2; 148 | } 149 | 150 | .input-group-focus{ 151 | .input-group-text{ 152 | background-color: $color4; 153 | border-color: $color3; 154 | color: $color3; 155 | } 156 | } 157 | 158 | .form-group.no-border, 159 | .input-group.no-border{ 160 | .form-control{ 161 | background-color: $color5; 162 | color: $color2; 163 | 164 | &:focus, 165 | &:active, 166 | &:active{ 167 | background-color: $color6; 168 | color: $color3; 169 | } 170 | } 171 | 172 | .form-control + .input-group-text{ 173 | background-color: $color5; 174 | 175 | &:focus, 176 | &:active, 177 | &:active{ 178 | background-color: $color6; 179 | color: $color3; 180 | } 181 | } 182 | 183 | .form-control{ 184 | &:focus{ 185 | & + .input-group-text{ 186 | background-color: $color6; 187 | color: $color3; 188 | } 189 | } 190 | } 191 | 192 | .input-group-text{ 193 | background-color: $color5; 194 | border: none; 195 | color: $color2; 196 | } 197 | 198 | &.input-group-focus{ 199 | .input-group-text{ 200 | background-color: $color6; 201 | color: $color3; 202 | } 203 | } 204 | } 205 | } 206 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_modals.scss: -------------------------------------------------------------------------------- 1 | @mixin modal-colors($bg-color, $color) { 2 | .modal-content{ 3 | background-color: $bg-color; 4 | color: $color; 5 | } 6 | 7 | .modal-header .close{ 8 | color: $color; 9 | } 10 | 11 | 12 | } 13 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_navbar.scss: -------------------------------------------------------------------------------- 1 | @mixin navbar-responsive() { 2 | &.menu-on-left .navbar-translate { 3 | flex-direction: row-reverse; 4 | } 5 | 6 | .navbar{ 7 | .navbar-nav{ 8 | margin-top: 53px; 9 | position: relative; 10 | max-height: calc(100vh - 75px); 11 | min-height: 100%; 12 | overflow: auto; 13 | 14 | &.navbar-logo{ 15 | top: 0; 16 | height: 53px; 17 | } 18 | } 19 | 20 | .dropdown.show .dropdown-menu, 21 | .dropdown .dropdown-menu{ 22 | background-color: transparent; 23 | border: 0; 24 | transition: none; 25 | -webkit-box-shadow: none; 26 | box-shadow: none; 27 | width: auto; 28 | margin: 0 1rem; 29 | margin-bottom: 15px; 30 | padding-top: 0; 31 | height: 125px; 32 | overflow-y: scroll; 33 | 34 | &:before{ 35 | display: none; 36 | } 37 | } 38 | 39 | .dropdown{ 40 | .dropdown-item{ 41 | padding-left: 2.5rem; 42 | } 43 | 44 | .dropdown-menu{ 45 | display: none; 46 | } 47 | 48 | &.show .dropdown-menu{ 49 | display: block; 50 | } 51 | } 52 | 53 | .dropdown-menu .dropdown-item:focus, 54 | .dropdown-menu .dropdown-item:hover{ 55 | color: $white-color; 56 | border-radius: $border-radius-small; 57 | } 58 | 59 | .navbar-translate{ 60 | width: 100%; 61 | position: relative; 62 | display: flex; 63 | -ms-flex-pack: justify!important; 64 | justify-content: space-between!important; 65 | -ms-flex-align: center; 66 | align-items: center; 67 | @include transform-translate-x(0px); 68 | @include transition (0.50s, cubic-bezier(0.685, 0.0473, 0.346, 1)); 69 | } 70 | 71 | .navbar-toggler-bar{ 72 | display: block; 73 | position: relative; 74 | width: 22px; 75 | height: 1px; 76 | border-radius: 1px; 77 | background: $white-bg; 78 | 79 | & + .navbar-toggler-bar{ 80 | margin-top: 7px; 81 | } 82 | 83 | &.bar2{ 84 | width: 17px; 85 | transition: width .2s linear; 86 | } 87 | } 88 | 89 | &.bg-white:not(.navbar-transparent) .navbar-toggler-bar{ 90 | background: $default-color; 91 | } 92 | 93 | } 94 | 95 | // .bar1, 96 | // .bar2, 97 | // .bar3 { 98 | // outline: 1px solid transparent; 99 | // } 100 | // .bar1 { 101 | // top: 0px; 102 | // @include bar-animation($topbar-back); 103 | // } 104 | // .bar2 { 105 | // opacity: 1; 106 | // } 107 | // .bar3 { 108 | // bottom: 0px; 109 | // @include bar-animation($bottombar-back); 110 | // } 111 | // .toggled .bar1 { 112 | // top: 6px; 113 | // @include bar-animation($topbar-x); 114 | // } 115 | // .toggled .bar2 { 116 | // opacity: 0; 117 | // } 118 | // .toggled .bar3 { 119 | // bottom: 6px; 120 | // @include bar-animation($bottombar-x); 121 | // } 122 | 123 | .top-bar { 124 | transform: rotate(0); 125 | } 126 | .middle-bar { 127 | opacity: 1; 128 | } 129 | .bottom-bar { 130 | transform: rotate(0); 131 | } 132 | 133 | .top-bar, 134 | .middle-bar, 135 | .bottom-bar{ 136 | transition: all 0.2s; 137 | } 138 | 139 | 140 | 141 | .toggled { 142 | .top-bar { 143 | transform: rotate(45deg); 144 | transform-origin: 0%; 145 | } 146 | .bottom-bar { 147 | transform: rotate(-45deg); 148 | transform-origin: 0%; 149 | } 150 | .middle-bar { 151 | opacity: 0; 152 | } 153 | } 154 | 155 | 156 | 157 | // 158 | // @include topbar-x-rotation(); 159 | // @include topbar-back-rotation(); 160 | // @include bottombar-x-rotation(); 161 | // @include bottombar-back-rotation(); 162 | // 163 | // @-webkit-keyframes fadeIn { 164 | // 0% {opacity: 0;} 165 | // 100% {opacity: 1;} 166 | // } 167 | // @-moz-keyframes fadeIn { 168 | // 0% {opacity: 0;} 169 | // 100% {opacity: 1;} 170 | // } 171 | // @keyframes fadeIn { 172 | // 0% {opacity: 0;} 173 | // 100% {opacity: 1;} 174 | // } 175 | } 176 | 177 | @mixin navbar-collapse() { 178 | .navbar-collapse{ 179 | position: fixed; 180 | display: block !important; 181 | top: 0; 182 | height: 100% !important; 183 | width: 300px; 184 | right: 0; 185 | z-index: 1032; 186 | visibility: visible; 187 | background-color: #999; 188 | overflow-y: visible; 189 | border-top: none; 190 | text-align: left; 191 | 192 | max-height: none !important; 193 | 194 | @include transform-translate-x(300px); 195 | @include transition (0.50s, cubic-bezier(0.685, 0.0473, 0.346, 1)); 196 | 197 | &:before{ 198 | background: $brand-primary; /* For browsers that do not support gradients */ 199 | background: -webkit-linear-gradient($brand-primary 0%, #000 80%); /* For Safari 5.1 to 6.0 */ 200 | background: -o-linear-gradient($brand-primary 0%, #000 80%); /* For Opera 11.1 to 12.0 */ 201 | background: -moz-linear-gradient($brand-primary 0%, #000 80%); /* For Firefox 3.6 to 15 */ 202 | background: linear-gradient($brand-primary 0%, #000 80%); /* Standard syntax (must be last) */ 203 | @include opacity(.76); 204 | 205 | display: block; 206 | content: ""; 207 | position: absolute; 208 | width: 100%; 209 | height: 100%; 210 | top: 0; 211 | left: 0; 212 | z-index: -1; 213 | } 214 | 215 | .navbar-nav:not(.navbar-logo){ 216 | .nav-link { 217 | margin: 0 1rem; 218 | margin-top: 0.3125rem; 219 | 220 | &:not(.btn){ 221 | color: $white-color !important; 222 | } 223 | } 224 | } 225 | 226 | .dropdown-menu .dropdown-item{ 227 | color: $white-color; 228 | } 229 | } 230 | 231 | @include navbar-responsive(); 232 | 233 | 234 | [class*="navbar-expand-"] .navbar-collapse{ 235 | width: 300px; 236 | } 237 | 238 | .wrapper{ 239 | @include transition (0.50s, cubic-bezier(0.685, 0.0473, 0.346, 1)); 240 | } 241 | 242 | #bodyClick{ 243 | height: 100%; 244 | width: 100%; 245 | position: fixed; 246 | opacity: 1; 247 | top: 0; 248 | left: auto; 249 | right: 300px; 250 | content: ""; 251 | z-index: 9999; 252 | overflow-x: hidden; 253 | background-color: transparent; 254 | @include transition (0.50s, cubic-bezier(0.685, 0.0473, 0.346, 1)); 255 | } 256 | 257 | } 258 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_pages.scss: -------------------------------------------------------------------------------- 1 | @mixin linear-gradient($color1, $color2){ 2 | background: $color1; /* For browsers that do not support gradients */ 3 | background: -webkit-linear-gradient(90deg, $color1 , $color2); /* For Safari 5.1 to 6.0 */ 4 | background: -o-linear-gradient(90deg, $color1, $color2); /* For Opera 11.1 to 12.0 */ 5 | background: -moz-linear-gradient(90deg, $color1, $color2); /* For Firefox 3.6 to 15 */ 6 | background: linear-gradient(0deg, $color1 , $color2); /* Standard syntax */ 7 | } 8 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_popovers.scss: -------------------------------------------------------------------------------- 1 | @mixin popover-color($color, $text-color) { 2 | background-color: $color; 3 | 4 | .popover-body{ 5 | color: $text-color; 6 | } 7 | 8 | 9 | &.bs-popover-right .arrow:after{ 10 | border-right-color:$color; 11 | } 12 | 13 | &.bs-popover-top .arrow:after{ 14 | border-top-color:$color; 15 | } 16 | 17 | &.bs-popover-bottom .arrow:after{ 18 | border-bottom-color:$color; 19 | } 20 | 21 | &.bs-popover-left .arrow:after{ 22 | border-left-color:$color; 23 | } 24 | 25 | .popover-header{ 26 | color: $text-color; 27 | opacity: .6; 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_transparency.scss: -------------------------------------------------------------------------------- 1 | // Opacity 2 | 3 | @mixin opacity($opacity) { 4 | opacity: $opacity; 5 | // IE8 filter 6 | $opacity-ie: ($opacity * 100); 7 | filter: #{alpha(opacity=$opacity-ie)}; 8 | } 9 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/mixins/_vendor-prefixes.scss: -------------------------------------------------------------------------------- 1 | @mixin box-shadow($shadow...) { 2 | -webkit-box-shadow: $shadow; // iOS <4.3 & Android <4.1 3 | box-shadow: $shadow; 4 | } 5 | 6 | @mixin transition-input-focus-color() { 7 | -webkit-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out; 8 | -moz-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out; 9 | -o-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out; 10 | -ms-transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out; 11 | transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out, background-color 0.3s ease-in-out; 12 | } 13 | 14 | 15 | @mixin transition($time, $type){ 16 | -webkit-transition: all $time $type; 17 | -moz-transition: all $time $type; 18 | -o-transition: all $time $type; 19 | -ms-transition: all $time $type; 20 | transition: all $time $type; 21 | } 22 | 23 | @mixin transition-on-prop($prop ,$time, $type){ 24 | -webkit-transition: $prop $time $type; 25 | -moz-transition: $prop $time $type; 26 | -o-transition: $prop $time $type; 27 | -ms-transition: all $time $type; 28 | transition: $prop $time $type; 29 | } 30 | 31 | @mixin rotate-180(){ 32 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); 33 | -webkit-transform: rotate(180deg); 34 | -ms-transform: rotate(180deg); 35 | transform: rotate(180deg); 36 | } 37 | 38 | @mixin transform-scale($value){ 39 | -webkit-transform: scale($value); 40 | -moz-transform: scale($value); 41 | -o-transform: scale($value); 42 | -ms-transform: scale($value); 43 | transform: scale($value); 44 | } 45 | 46 | @mixin transform-translate-x($value){ 47 | -webkit-transform: translate3d($value, 0, 0); 48 | -moz-transform: translate3d($value, 0, 0); 49 | -o-transform: translate3d($value, 0, 0); 50 | -ms-transform: translate3d($value, 0, 0); 51 | transform: translate3d($value, 0, 0); 52 | } 53 | 54 | @mixin transform-translate-y-dropdown($value) { 55 | -webkit-transform: translate3d(0,$value,0) !important; 56 | -moz-transform: translate3d(0,$value,0) !important; 57 | -o-transform: translate3d(0,$value,0) !important; 58 | -ms-transform: translate3d(0,$value,0) !important; 59 | transform: translate3d(0,$value,0) !important; 60 | } 61 | 62 | @mixin transform-translate-y($value){ 63 | -webkit-transform: translate3d(0,$value,0); 64 | -moz-transform: translate3d(0,$value,0); 65 | -o-transform: translate3d(0,$value,0); 66 | -ms-transform: translate3d(0,$value,0); 67 | transform: translate3d(0,$value,0); 68 | } 69 | 70 | @mixin bar-animation($type){ 71 | -webkit-animation: $type 500ms linear 0s; 72 | -moz-animation: $type 500ms linear 0s; 73 | animation: $type 500ms 0s; 74 | -webkit-animation-fill-mode: forwards; 75 | -moz-animation-fill-mode: forwards; 76 | animation-fill-mode: forwards; 77 | } 78 | 79 | @mixin topbar-x-rotation(){ 80 | @keyframes topbar-x { 81 | 0% {top: 0px; transform: rotate(0deg); } 82 | 45% {top: 6px; transform: rotate(145deg); } 83 | 75% {transform: rotate(130deg); } 84 | 100% {transform: rotate(135deg); } 85 | } 86 | @-webkit-keyframes topbar-x { 87 | 0% {top: 0px; -webkit-transform: rotate(0deg); } 88 | 45% {top: 6px; -webkit-transform: rotate(145deg); } 89 | 75% {-webkit-transform: rotate(130deg); } 90 | 100% { -webkit-transform: rotate(135deg); } 91 | } 92 | @-moz-keyframes topbar-x { 93 | 0% {top: 0px; -moz-transform: rotate(0deg); } 94 | 45% {top: 6px; -moz-transform: rotate(145deg); } 95 | 75% {-moz-transform: rotate(130deg); } 96 | 100% { -moz-transform: rotate(135deg); } 97 | } 98 | } 99 | 100 | @mixin topbar-back-rotation(){ 101 | @keyframes topbar-back { 102 | 0% { top: 6px; transform: rotate(135deg); } 103 | 45% { transform: rotate(-10deg); } 104 | 75% { transform: rotate(5deg); } 105 | 100% { top: 0px; transform: rotate(0); } 106 | } 107 | 108 | @-webkit-keyframes topbar-back { 109 | 0% { top: 6px; -webkit-transform: rotate(135deg); } 110 | 45% { -webkit-transform: rotate(-10deg); } 111 | 75% { -webkit-transform: rotate(5deg); } 112 | 100% { top: 0px; -webkit-transform: rotate(0); } 113 | } 114 | 115 | @-moz-keyframes topbar-back { 116 | 0% { top: 6px; -moz-transform: rotate(135deg); } 117 | 45% { -moz-transform: rotate(-10deg); } 118 | 75% { -moz-transform: rotate(5deg); } 119 | 100% { top: 0px; -moz-transform: rotate(0); } 120 | } 121 | } 122 | 123 | @mixin bottombar-x-rotation(){ 124 | @keyframes bottombar-x { 125 | 0% {bottom: 0px; transform: rotate(0deg);} 126 | 45% {bottom: 6px; transform: rotate(-145deg);} 127 | 75% {transform: rotate(-130deg);} 128 | 100% {transform: rotate(-135deg);} 129 | } 130 | @-webkit-keyframes bottombar-x { 131 | 0% {bottom: 0px; -webkit-transform: rotate(0deg);} 132 | 45% {bottom: 6px; -webkit-transform: rotate(-145deg);} 133 | 75% {-webkit-transform: rotate(-130deg);} 134 | 100% {-webkit-transform: rotate(-135deg);} 135 | } 136 | @-moz-keyframes bottombar-x { 137 | 0% {bottom: 0px; -moz-transform: rotate(0deg);} 138 | 45% {bottom: 6px; -moz-transform: rotate(-145deg);} 139 | 75% {-moz-transform: rotate(-130deg);} 140 | 100% {-moz-transform: rotate(-135deg);} 141 | } 142 | } 143 | 144 | @mixin bottombar-back-rotation{ 145 | @keyframes bottombar-back { 146 | 0% { bottom: 6px;transform: rotate(-135deg);} 147 | 45% { transform: rotate(10deg);} 148 | 75% { transform: rotate(-5deg);} 149 | 100% { bottom: 0px;transform: rotate(0);} 150 | } 151 | @-webkit-keyframes bottombar-back { 152 | 0% {bottom: 6px;-webkit-transform: rotate(-135deg);} 153 | 45% {-webkit-transform: rotate(10deg);} 154 | 75% {-webkit-transform: rotate(-5deg);} 155 | 100% {bottom: 0px;-webkit-transform: rotate(0);} 156 | } 157 | @-moz-keyframes bottombar-back { 158 | 0% {bottom: 6px;-moz-transform: rotate(-135deg);} 159 | 45% {-moz-transform: rotate(10deg);} 160 | 75% {-moz-transform: rotate(-5deg);} 161 | 100% {bottom: 0px;-moz-transform: rotate(0);} 162 | } 163 | 164 | } 165 | 166 | 167 | @mixin nc-rotate($degrees, $rotation) { 168 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}); 169 | -webkit-transform: rotate($degrees); 170 | -moz-transform: rotate($degrees); 171 | -ms-transform: rotate($degrees); 172 | -o-transform: rotate($degrees); 173 | transform: rotate($degrees); 174 | } 175 | 176 | @mixin nc-flip($horiz, $vert, $rotation) { 177 | filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=#{$rotation}); 178 | -webkit-transform: scale($horiz, $vert); 179 | -moz-transform: scale($horiz, $vert); 180 | -ms-transform: scale($horiz, $vert); 181 | -o-transform: scale($horiz, $vert); 182 | transform: scale($horiz, $vert); 183 | } 184 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/plugins/_plugin-nouislider.scss: -------------------------------------------------------------------------------- 1 | /*! nouislider - 13.1.4 */ 2 | /* Functional styling; 3 | * These styles are required for noUiSlider to function. 4 | * You don't need to change these rules to apply your design. 5 | */ 6 | .noUi-target, 7 | .noUi-target * { 8 | -webkit-touch-callout: none; 9 | -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 10 | -webkit-user-select: none; 11 | -ms-touch-action: none; 12 | touch-action: none; 13 | -ms-user-select: none; 14 | -moz-user-select: none; 15 | user-select: none; 16 | -moz-box-sizing: border-box; 17 | box-sizing: border-box; 18 | } 19 | .noUi-target { 20 | position: relative; 21 | direction: ltr; 22 | } 23 | .noUi-base, 24 | .noUi-connects { 25 | width: 100%; 26 | height: 100%; 27 | position: relative; 28 | z-index: 1; 29 | } 30 | /* Wrapper for all connect elements. 31 | */ 32 | .noUi-connects { 33 | overflow: hidden; 34 | z-index: 0; 35 | } 36 | .noUi-connect, 37 | .noUi-origin { 38 | will-change: transform; 39 | position: absolute; 40 | z-index: 1; 41 | top: 0; 42 | left: 0; 43 | height: 100%; 44 | width: 100%; 45 | -ms-transform-origin: 0 0; 46 | -webkit-transform-origin: 0 0; 47 | transform-origin: 0 0; 48 | } 49 | /* Offset direction 50 | */ 51 | html:not([dir="rtl"]) .noUi-horizontal .noUi-origin { 52 | left: auto; 53 | right: 0; 54 | } 55 | /* Give origins 0 height/width so they don't interfere with clicking the 56 | * connect elements. 57 | */ 58 | .noUi-vertical .noUi-origin { 59 | width: 0; 60 | } 61 | .noUi-horizontal .noUi-origin { 62 | height: 0; 63 | } 64 | .noUi-handle { 65 | position: absolute; 66 | } 67 | .noUi-state-tap .noUi-connect, 68 | .noUi-state-tap .noUi-origin { 69 | -webkit-transition: transform 0.3s; 70 | transition: transform 0.3s; 71 | } 72 | .noUi-state-drag * { 73 | cursor: inherit !important; 74 | } 75 | /* Slider size and handle placement; 76 | */ 77 | .noUi-horizontal { 78 | height: 1px; 79 | } 80 | .noUi-horizontal .noUi-handle { 81 | border-radius: 50%; 82 | background-color: $white-color; 83 | box-shadow: 0 1px 13px 0 rgba(0, 0, 0, 0.2); 84 | height:15px; 85 | width:15px; 86 | cursor:pointer; 87 | margin-top: -7px; 88 | outline: none; 89 | } 90 | .noUi-vertical { 91 | width: 18px; 92 | } 93 | .noUi-vertical .noUi-handle { 94 | width: 28px; 95 | height: 34px; 96 | left: -6px; 97 | top: -17px; 98 | } 99 | html:not([dir="rtl"]) .noUi-horizontal .noUi-handle { 100 | right: -15px; 101 | left: auto; 102 | } 103 | /* Styling; 104 | * Giving the connect element a border radius causes issues with using transform: scale 105 | */ 106 | .noUi-target { 107 | background-color: rgba(182, 182, 182, .3); 108 | border-radius: 3px; 109 | } 110 | .noUi-connects { 111 | border-radius: 3px; 112 | } 113 | .noUi-connect { 114 | background: $default-color; 115 | border-radius: 3px; 116 | -webkit-transition: background 450ms; 117 | transition: background 450ms; 118 | } 119 | /* Handles and cursors; 120 | */ 121 | .noUi-draggable { 122 | cursor: ew-resize; 123 | } 124 | .noUi-vertical .noUi-draggable { 125 | cursor: ns-resize; 126 | } 127 | .noUi-handle { 128 | // border: 1px solid #D9D9D9; 129 | border-radius: 3px; 130 | background: #FFF; 131 | cursor: default; 132 | box-shadow: inset 0 0 1px #FFF, 133 | inset 0 1px 7px #EBEBEB, 134 | 0 3px 6px -3px #BBB; 135 | -webkit-transition: $general-transition-time $transition-ease; 136 | -moz-transition: $general-transition-time $transition-ease; 137 | -ms-transition: $general-transition-time $transition-ease; 138 | -o-transform: $general-transition-time $transition-ease; 139 | transition: $general-transition-time $transition-ease; 140 | } 141 | .noUi-active { 142 | -webkit-transform: scale3d(1.5,1.5,1); 143 | -moz-transform: scale3d(1.5,1.5,1); 144 | -ms-transform: scale3d(1.5,1.5,1); 145 | -o-transform: scale3d(1.5,1.5,1); 146 | transform: scale3d(1.5,1.5,1); 147 | } 148 | /* Handle stripes; 149 | */ 150 | .noUi-handle:before, 151 | .noUi-handle:after { 152 | display: none; 153 | } 154 | .noUi-handle:after { 155 | left: 17px; 156 | } 157 | .noUi-vertical .noUi-handle:before, 158 | .noUi-vertical .noUi-handle:after { 159 | width: 14px; 160 | height: 1px; 161 | left: 6px; 162 | top: 14px; 163 | } 164 | .noUi-vertical .noUi-handle:after { 165 | top: 17px; 166 | } 167 | /* Disabled state; 168 | */ 169 | [disabled] .noUi-connect { 170 | background: #B8B8B8; 171 | } 172 | [disabled].noUi-target, 173 | [disabled].noUi-handle, 174 | [disabled] .noUi-handle { 175 | cursor: not-allowed; 176 | } 177 | /* Base; 178 | * 179 | */ 180 | .noUi-pips, 181 | .noUi-pips * { 182 | -moz-box-sizing: border-box; 183 | box-sizing: border-box; 184 | } 185 | .noUi-pips { 186 | position: absolute; 187 | color: #999; 188 | } 189 | /* Values; 190 | * 191 | */ 192 | .noUi-value { 193 | position: absolute; 194 | white-space: nowrap; 195 | text-align: center; 196 | } 197 | .noUi-value-sub { 198 | color: #ccc; 199 | font-size: 10px; 200 | } 201 | /* Markings; 202 | * 203 | */ 204 | .noUi-marker { 205 | position: absolute; 206 | background: #CCC; 207 | } 208 | .noUi-marker-sub { 209 | background: #AAA; 210 | } 211 | .noUi-marker-large { 212 | background: #AAA; 213 | } 214 | /* Horizontal layout; 215 | * 216 | */ 217 | .noUi-pips-horizontal { 218 | padding: 10px 0; 219 | height: 80px; 220 | top: 100%; 221 | left: 0; 222 | width: 100%; 223 | } 224 | .noUi-value-horizontal { 225 | -webkit-transform: translate(-50%, 50%); 226 | transform: translate(-50%, 50%); 227 | } 228 | .noUi-rtl .noUi-value-horizontal { 229 | -webkit-transform: translate(50%, 50%); 230 | transform: translate(50%, 50%); 231 | } 232 | .noUi-marker-horizontal.noUi-marker { 233 | margin-left: -1px; 234 | width: 2px; 235 | height: 5px; 236 | } 237 | .noUi-marker-horizontal.noUi-marker-sub { 238 | height: 10px; 239 | } 240 | .noUi-marker-horizontal.noUi-marker-large { 241 | height: 15px; 242 | } 243 | /* Vertical layout; 244 | * 245 | */ 246 | .noUi-pips-vertical { 247 | padding: 0 10px; 248 | height: 100%; 249 | top: 0; 250 | left: 100%; 251 | } 252 | .noUi-value-vertical { 253 | -webkit-transform: translate(0, -50%); 254 | transform: translate(0, -50%, 0); 255 | padding-left: 25px; 256 | } 257 | .noUi-rtl .noUi-value-vertical { 258 | -webkit-transform: translate(0, 50%); 259 | transform: translate(0, 50%); 260 | } 261 | .noUi-marker-vertical.noUi-marker { 262 | width: 5px; 263 | height: 2px; 264 | margin-top: -1px; 265 | } 266 | .noUi-marker-vertical.noUi-marker-sub { 267 | width: 10px; 268 | } 269 | .noUi-marker-vertical.noUi-marker-large { 270 | width: 15px; 271 | } 272 | .noUi-tooltip { 273 | display: block; 274 | position: absolute; 275 | border: 1px solid #D9D9D9; 276 | border-radius: 3px; 277 | background: #fff; 278 | color: #000; 279 | padding: 5px; 280 | text-align: center; 281 | white-space: nowrap; 282 | } 283 | .noUi-horizontal .noUi-tooltip { 284 | -webkit-transform: translate(-50%, 0); 285 | transform: translate(-50%, 0); 286 | left: 50%; 287 | bottom: 120%; 288 | } 289 | .noUi-vertical .noUi-tooltip { 290 | -webkit-transform: translate(0, -50%); 291 | transform: translate(0, -50%); 292 | top: 50%; 293 | right: 120%; 294 | } 295 | 296 | .slider { 297 | 298 | &.slider-neutral{ 299 | & .noUi-connect, 300 | &.noUi-connect{ 301 | background-color: $white-color; 302 | } 303 | 304 | &.noUi-target{ 305 | background-color: rgba(255,255,255, .3); 306 | } 307 | 308 | & .noUi-handle{ 309 | background-color: $white-color; 310 | } 311 | } 312 | 313 | &.slider-primary{ 314 | & .noUi-connect, 315 | &.noUi-connect{ 316 | background-color: $primary-color; 317 | } 318 | 319 | &.noUi-target{ 320 | background-color: $primary-color-opacity; 321 | } 322 | 323 | & .noUi-handle{ 324 | background-color: $brand-primary; 325 | } 326 | } 327 | 328 | &.slider-info{ 329 | & .noUi-connect, 330 | &.noUi-connect{ 331 | background-color: $brand-info; 332 | } 333 | 334 | &.noUi-target{ 335 | background-color: $info-color-opacity; 336 | } 337 | 338 | & .noUi-handle{ 339 | background-color: $brand-info; 340 | } 341 | } 342 | &.slider-success{ 343 | & .noUi-connect, 344 | &.noUi-connect{ 345 | background-color: $brand-success; 346 | } 347 | 348 | &.noUi-target{ 349 | background-color: $success-color-opacity; 350 | } 351 | 352 | & .noUi-handle{ 353 | background-color: $brand-success; 354 | } 355 | } 356 | &.slider-warning{ 357 | & .noUi-connect, 358 | &.noUi-connect{ 359 | background-color: $brand-warning; 360 | } 361 | 362 | &.noUi-target{ 363 | background-color: $warning-color-opacity; 364 | } 365 | 366 | & .noUi-handle{ 367 | background-color: $brand-warning; 368 | } 369 | } 370 | &.slider-danger{ 371 | & .noUi-connect, 372 | &.noUi-connect{ 373 | background-color: $brand-danger; 374 | } 375 | 376 | &.noUi-target{ 377 | background-color: $danger-color-opacity; 378 | } 379 | 380 | & .noUi-handle{ 381 | background-color: $brand-danger; 382 | } 383 | } 384 | 385 | } 386 | -------------------------------------------------------------------------------- /assets/scss/now-ui-kit/plugins/_plugin-perfect-scrollbar.scss: -------------------------------------------------------------------------------- 1 | /* perfect-scrollbar v0.6.13 */ 2 | .ps-container { 3 | -ms-touch-action: auto; 4 | touch-action: auto; 5 | overflow: hidden !important; 6 | -ms-overflow-style: none; } 7 | @supports (-ms-overflow-style: none) { 8 | .ps-container { 9 | overflow: auto !important; } } 10 | @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 11 | .ps-container { 12 | overflow: auto !important; } } 13 | .ps-container.ps-active-x > .ps-scrollbar-x-rail, 14 | .ps-container.ps-active-y > .ps-scrollbar-y-rail { 15 | display: block; 16 | background-color: transparent; } 17 | .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail { 18 | background-color: #eee; 19 | opacity: 0.9; } 20 | .ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x { 21 | background-color: #999; 22 | height: 11px; } 23 | .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail { 24 | background-color: #eee; 25 | opacity: 0.9; } 26 | .ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y { 27 | background-color: #999; 28 | width: 11px; } 29 | .ps-container > .ps-scrollbar-x-rail { 30 | display: none; 31 | position: absolute; 32 | /* please don't change 'position' */ 33 | opacity: 0; 34 | -webkit-transition: background-color .2s linear, opacity .2s linear; 35 | -o-transition: background-color .2s linear, opacity .2s linear; 36 | -moz-transition: background-color .2s linear, opacity .2s linear; 37 | transition: background-color .2s linear, opacity .2s linear; 38 | bottom: 0px; 39 | /* there must be 'bottom' for ps-scrollbar-x-rail */ 40 | height: 15px; } 41 | .ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x { 42 | position: absolute; 43 | /* please don't change 'position' */ 44 | background-color: #aaa; 45 | -webkit-border-radius: 6px; 46 | -moz-border-radius: 6px; 47 | border-radius: 6px; 48 | -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out; 49 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out; 50 | -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; 51 | -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out; 52 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; 53 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out; 54 | bottom: 2px; 55 | /* there must be 'bottom' for ps-scrollbar-x */ 56 | height: 6px; } 57 | .ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x, .ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x { 58 | height: 11px; } 59 | .ps-container > .ps-scrollbar-y-rail { 60 | display: none; 61 | position: absolute; 62 | /* please don't change 'position' */ 63 | opacity: 0; 64 | -webkit-transition: background-color .2s linear, opacity .2s linear; 65 | -o-transition: background-color .2s linear, opacity .2s linear; 66 | -moz-transition: background-color .2s linear, opacity .2s linear; 67 | transition: background-color .2s linear, opacity .2s linear; 68 | right: 0; 69 | /* there must be 'right' for ps-scrollbar-y-rail */ 70 | width: 15px; } 71 | .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y { 72 | position: absolute; 73 | /* please don't change 'position' */ 74 | background-color: #aaa; 75 | -webkit-border-radius: 6px; 76 | -moz-border-radius: 6px; 77 | border-radius: 6px; 78 | -webkit-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out; 79 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, -webkit-border-radius .2s ease-in-out; 80 | -o-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; 81 | -moz-transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out; 82 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out; 83 | transition: background-color .2s linear, height .2s linear, width .2s ease-in-out, border-radius .2s ease-in-out, -webkit-border-radius .2s ease-in-out, -moz-border-radius .2s ease-in-out; 84 | right: 2px; 85 | /* there must be 'right' for ps-scrollbar-y */ 86 | width: 6px; } 87 | .ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y, .ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y { 88 | width: 11px; } 89 | .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail { 90 | background-color: #eee; 91 | opacity: 0.9; } 92 | .ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x { 93 | background-color: #999; 94 | height: 11px; } 95 | .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail { 96 | background-color: #eee; 97 | opacity: 0.9; } 98 | .ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y { 99 | background-color: #999; 100 | width: 11px; } 101 | .ps-container:hover > .ps-scrollbar-x-rail, 102 | .ps-container:hover > .ps-scrollbar-y-rail { 103 | opacity: 0.6; } 104 | .ps-container:hover > .ps-scrollbar-x-rail:hover { 105 | background-color: #eee; 106 | opacity: 0.9; } 107 | .ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x { 108 | background-color: #999; } 109 | .ps-container:hover > .ps-scrollbar-y-rail:hover { 110 | background-color: #eee; 111 | opacity: 0.9; } 112 | .ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y { 113 | background-color: #999; } 114 | -------------------------------------------------------------------------------- /docs/documentation.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | Components Documentation - Now UI Kit by Creative Tim 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 61 | 62 |
63 |
64 |
65 |
66 |
67 |

68 | Now UI Kit 69 |

70 |

Documentation v1.3.0

71 |
72 | View documentation 73 |
74 |
75 |
76 |
77 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 | 118 | 119 | 120 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /examples/login-page.html: -------------------------------------------------------------------------------- 1 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | Now UI Kit by Creative Tim 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 101 | 102 |
103 |
104 |
105 |
106 |
107 | 147 |
148 |
149 |
150 | 181 |
182 | 183 | 184 | 185 | 186 | 187 | 188 | 189 | 190 | 191 | 192 | 193 | 194 | 195 | 196 | 197 | 198 | -------------------------------------------------------------------------------- /genezio.yaml: -------------------------------------------------------------------------------- 1 | # The name of the project. 2 | name: now-ui-kit 3 | # The region where the project is deployed. 4 | region: us-east-1 5 | # The version of the Genezio YAML configuration to parse. 6 | yamlVersion: 2 7 | # Information about the frontend, including the path, language, and publish directory. 8 | # It is optional. It can also be an array if there are multiple frontends you want to deploy. 9 | frontend: 10 | # The folder where the frontend scripts will run. 11 | path: ./ 12 | # The directory that will be published to the CDN. It is relative to the path. 13 | publish: ./ 14 | -------------------------------------------------------------------------------- /gulpfile.js: -------------------------------------------------------------------------------- 1 | var gulp = require('gulp'); 2 | var path = require('path'); 3 | var sass = require('gulp-sass'); 4 | var autoprefixer = require('gulp-autoprefixer'); 5 | var sourcemaps = require('gulp-sourcemaps'); 6 | var open = require('gulp-open'); 7 | 8 | var Paths = { 9 | HERE: './', 10 | DIST: 'dist/', 11 | CSS: './assets/css/', 12 | SCSS_TOOLKIT_SOURCES: './assets/scss/now-ui-kit.scss', 13 | SCSS: './assets/scss/**/**' 14 | }; 15 | 16 | gulp.task('compile-scss', function() { 17 | return gulp.src(Paths.SCSS_TOOLKIT_SOURCES) 18 | .pipe(sourcemaps.init()) 19 | .pipe(sass().on('error', sass.logError)) 20 | .pipe(autoprefixer()) 21 | .pipe(sourcemaps.write(Paths.HERE)) 22 | .pipe(gulp.dest(Paths.CSS)); 23 | }); 24 | 25 | gulp.task('watch', function() { 26 | gulp.watch(Paths.SCSS, ['compile-scss']); 27 | }); 28 | 29 | gulp.task('open', function() { 30 | gulp.src('index.html') 31 | .pipe(open()); 32 | }); 33 | 34 | gulp.task('open-app', ['open', 'watch']); -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "now-ui-kit", 3 | "description": "Bootstrap 4 Now UI Design", 4 | "version": "1.3.0", 5 | "homepage": "http://creative-tim.com/product/now-ui-kit", 6 | "author": "Creative Tim", 7 | "license": "Creative Tim License ", 8 | "devDependencies": { 9 | "gulp": "^3.9.1", 10 | "gulp-autoprefixer": "^5.0.0", 11 | "gulp-clean": "^0.4.0", 12 | "gulp-install": "^1.1.0", 13 | "gulp-sass": "^4.0.1", 14 | "gulp-sourcemaps": "^2.6.4", 15 | "gulp-open": "^3.0.1" 16 | } 17 | } 18 | --------------------------------------------------------------------------------