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: 10px;
  56     margin-right: 10px;
  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   }
  67
  68   // Override some properties if the main content is expanded (no menu on the left)
  69   &.expanded {
  70     margin-left: 0;
  71
  72     .margin-content {
  73       margin-left: $expanded-horizontal-margins;
  74       margin-right: $expanded-horizontal-margins;
  75     }
  76
  77     .sub-menu {
  78       padding-left: $expanded-horizontal-margins;
  79     }
  80   }
  81 }
  82
  83 // On small screen, menu is absolute and displayed over the page
  84 @media screen and (max-width: 500px) {
  85   .title-menu-left {
  86     width: 120px;
  87     position: absolute !important;
  88     z-index: 10000;
  89   }
  90
  91   .main-col {
  92     width: 100% !important;
  93   }
  94
  95   .fake-menu {
  96     display: none;
  97   }
  98 }
  99
 100 // Thanks https://gist.github.com/alexandrevicenzi/680147013e902a4eaa5d
 101 .glyphicon-refresh-animate {
 102   -animation: spin .7s infinite linear;
 103   -ms-animation: spin .7s infinite linear;
 104   -webkit-animation: spinw .7s infinite linear;
 105   -moz-animation: spinm .7s infinite linear;
 106 }
 107
 108 @keyframes spin {
 109   from { transform: scale(1) rotate(0deg);}
 110   to { transform: scale(1) rotate(360deg);}
 111 }
 112
 113 @-webkit-keyframes spinw {
 114   from { -webkit-transform: rotate(0deg);}
 115   to { -webkit-transform: rotate(360deg);}
 116 }
 117
 118 @-moz-keyframes spinm {
 119   from { -moz-transform: rotate(0deg);}
 120   to { -moz-transform: rotate(360deg);}
 121 }
 122
 123 /* ngprime data table customizations */
 124 p-datatable {
 125   .action-cell {
 126     text-align: center;
 127
 128     .glyphicon {
 129       cursor: pointer;
 130     }
 131   }
 132 }