client/src/sass/application.scss

   1 $FontPathSourceSansPro: "../fonts/source-sans-pro";
   2 @import '~source-sans-pro/source-sans-pro';
   3 @import '~primeng/resources/themes/bootstrap/theme.css';
   4 @import '~primeng/resources/primeng.css';
   5 @import '~video.js/dist/video-js.css';
   6 @import './video-js-custom.scss';
   7
   8 [hidden] {
   9   display: none !important;
  10 }
  11
  12 body {
  13   font-family: 'Source Sans Pro';
  14   font-weight: $font-regular;
  15   color: #000;
  16 }
  17
  18 input.readonly {
  19   /* Force blank on readonly inputs */
  20   background-color: #fff !important;
  21 }
  22
  23 .form-control, .btn {
  24   border-radius: 0;
  25 }
  26
  27 .dropdown-menu {
  28   border-radius: 0;
  29 }
  30
  31 .glyphicon-black {
  32   color: black;
  33 }
  34
  35 .main-col {
  36   padding: 30px;
  37
  38   .title-page {
  39     font-size: 16px;
  40     font-weight: $font-bold;
  41     display: inline-block;
  42     border-bottom: 2px solid $orange-color;
  43     margin-bottom: 25px;
  44   }
  45 }
  46
  47 // On small screen, menu is absolute and displayed over the page
  48 @media screen and (max-width: 500px) {
  49   .title-menu-left {
  50     width: 120px;
  51     position: absolute !important;
  52     z-index: 10000;
  53   }
  54
  55   .main-col {
  56     width: 100% !important;
  57   }
  58
  59   .fake-menu {
  60     display: none;
  61   }
  62 }
  63
  64 // Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
  65 .glyphicon-refresh-animate {
  66   -animation: spin .7s infinite linear;
  67   -ms-animation: spin .7s infinite linear;
  68   -webkit-animation: spinw .7s infinite linear;
  69   -moz-animation: spinm .7s infinite linear;
  70 }
  71
  72 @keyframes spin {
  73   from { transform: scale(1) rotate(0deg);}
  74   to { transform: scale(1) rotate(360deg);}
  75 }
  76
  77 @-webkit-keyframes spinw {
  78   from { -webkit-transform: rotate(0deg);}
  79   to { -webkit-transform: rotate(360deg);}
  80 }
  81
  82 @-moz-keyframes spinm {
  83   from { -moz-transform: rotate(0deg);}
  84   to { -moz-transform: rotate(360deg);}
  85 }
  86
  87 /* ngprime data table customizations */
  88 p-datatable {
  89   .action-cell {
  90     text-align: center;
  91
  92     .glyphicon {
  93       cursor: pointer;
  94     }
  95   }
  96 }