client/src/app/app.component.scss

   1 .main-row {
   2   min-height: calc(100vh - #{$header-height} - #{$footer-height} - #{$footer-margin});
   3 }
   4
   5 .sub-header-container {
   6   margin-top: $header-height;
   7 }
   8
   9 .title-menu-left {
  10   position: fixed;
  11   height: calc(100vh - #{$header-height});
  12   padding: 0;
  13   width: $menu-width;
  14
  15   .title-menu-left-block.menu {
  16     height: 100%;
  17   }
  18 }
  19
  20 .header {
  21   height: $header-height;
  22   position: fixed;
  23   top: 0;
  24   width: 100%;
  25   background-color: #fff;
  26   z-index: 1000;
  27   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.16);
  28   display: flex;
  29
  30   .top-left-block {
  31     width: $menu-width;
  32     z-index: 1001;
  33     height: $header-height;
  34     display: flex;
  35     align-items: center;
  36
  37     .icon {
  38       cursor: pointer;
  39       width: 22px;
  40       height: 22px;
  41       display: inline-block;
  42       background-size: contain;
  43
  44       &.icon-menu {
  45         background-image: url('../assets/header/menu.svg');
  46         margin: 0 18px 0 24px;
  47       }
  48     }
  49
  50     #peertube-title {
  51       font-size: 20px;
  52       font-weight: $font-bold;
  53       color: inherit !important;
  54       display: flex;
  55       align-items: center;
  56
  57       @include disable-default-a-behaviour;
  58
  59       .icon.icon-logo {
  60         display: inline-block;
  61         background: url('../assets/logo.svg') no-repeat;
  62         width: 20px;
  63         height: 24px;
  64       }
  65     }
  66
  67     @media screen and (max-width: 500px) {
  68       #peertube-title {
  69         display: none;
  70       }
  71     }
  72   }
  73
  74   .header-right {
  75     height: $header-height;
  76     display: flex;
  77     align-items: center;
  78     flex-grow: 1;
  79     justify-content: flex-end;
  80   }
  81 }
  82
  83 footer {
  84   border-top: 1px solid $footer-border-color;
  85   padding: 10px 0;
  86   text-align: center;
  87   font-size: 11px;
  88   margin-top: $footer-margin;
  89   height: $footer-height;
  90 }