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   margin-left: $menu-width;
  37
  38   .title-page {
  39     color: #000;
  40     font-size: 16px;
  41     display: inline-block;
  42     margin-right: 55px;
  43     font-weight: $font-semibold;
  44     @include disable-default-a-behaviour;
  45
  46     &.active, &.title-page-single {
  47       border-bottom: 2px solid $orange-color;
  48       font-weight: $font-bold;
  49       margin-top: 30px;
  50       margin-bottom: 25px;
  51     }
  52   }
  53
  54   .margin-content {
  55     margin-left: $not-expanded-horizontal-margins;
  56     margin-right: $not-expanded-horizontal-margins;
  57   }
  58
  59   .sub-menu {
  60     background-color: #F7F7F7;
  61     width: 100%;
  62     height: 81px;
  63     margin-bottom: 30px;
  64     display: flex;
  65     align-items: center;
  66     padding-left: $not-expanded-horizontal-margins;
  67   }
  68
  69   // Override some properties if the main content is expanded (no menu on the left)
  70   &.expanded {
  71     margin-left: 0;
  72
  73     .margin-content {
  74       margin-left: $expanded-horizontal-margins;
  75       margin-right: $expanded-horizontal-margins;
  76     }
  77
  78     .sub-menu {
  79       padding-left: $expanded-horizontal-margins;
  80     }
  81   }
  82 }
  83
  84 // On small screen, menu is absolute and displayed over the page
  85 @media screen and (max-width: 500px) {
  86   .title-menu-left {
  87     width: 120px;
  88     position: absolute !important;
  89     z-index: 10000;
  90   }
  91
  92   .main-col {
  93     width: 100% !important;
  94   }
  95
  96   .fake-menu {
  97     display: none;
  98   }
  99 }
 100
 101 // Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
 102 .glyphicon-refresh-animate {
 103   -animation: spin .7s infinite linear;
 104   -ms-animation: spin .7s infinite linear;
 105   -webkit-animation: spinw .7s infinite linear;
 106   -moz-animation: spinm .7s infinite linear;
 107 }
 108
 109 @keyframes spin {
 110   from { transform: scale(1) rotate(0deg);}
 111   to { transform: scale(1) rotate(360deg);}
 112 }
 113
 114 @-webkit-keyframes spinw {
 115   from { -webkit-transform: rotate(0deg);}
 116   to { -webkit-transform: rotate(360deg);}
 117 }
 118
 119 @-moz-keyframes spinm {
 120   from { -moz-transform: rotate(0deg);}
 121   to { -moz-transform: rotate(360deg);}
 122 }
 123
 124 /* ngprime data table customizations */
 125 p-datatable {
 126   .action-cell {
 127     text-align: center;
 128
 129     .glyphicon {
 130       cursor: pointer;
 131     }
 132   }
 133 }