向下载的引导模板添加样式

时间:2018-11-25 21:46:13

标签: html twitter-bootstrap templates sass

我下载了一个引导程序模板,但是我不知道如何将scss文件添加到html代码中。不知何故它不起作用,我尝试过的所有“正常”方式都不起作用。我知道scss的工作原理与css不同,并且互联网上说我必须将所有的scss转换为css文件,但是由于它是模板,因此我认为它应该以某种方式工作?有人可以帮忙吗?

这是模板: https://github.com/puikinsh/Adminator-admin-dashboard/tree/master/src

这是index.html中包含的样式

<style>
  #loader {
    transition: all 0.3s ease-in-out;
    opacity: 1;
    visibility: visible;
    position: fixed;
    height: 100vh;
    width: 100%;
    background: #fff;
    z-index: 90000;
  }

  #loader.fadeOut {
    opacity: 0;
    visibility: hidden;
  }

  .spinner {
    width: 40px;
    height: 40px;
    position: absolute;
    top: calc(50% - 20px);
    left: calc(50% - 20px);
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
  }

  @-webkit-keyframes sk-scaleout {
    0% { -webkit-transform: scale(0) }
    100% {
      -webkit-transform: scale(1.0);
      opacity: 0;
    }
  }

  @keyframes sk-scaleout {
    0% {
      -webkit-transform: scale(0);
      transform: scale(0);
    } 100% {
      -webkit-transform: scale(1.0);
      transform: scale(1.0);
      opacity: 0;
    }
  }
</style>

这是index.scss

@import 'spec/settings/index';
@import 'spec/tools/index';
@import "~bootstrap/scss/bootstrap";
@import 'spec/index';
@import 'vendor/index';

0 个答案:

没有答案