client/src/app/modal/welcome-modal.component.scss

   1 @import '_mixins';
   2 @import '_variables';
   3
   4 .modal-body {
   5   font-size: 15px;
   6 }
   7
   8 .two-columns {
   9   display: flex;
  10   align-items: center;
  11   justify-content: center;
  12   margin-top: 50px;
  13 }
  14
  15 .mascot {
  16   display: block;
  17   min-width: 170px;
  18 }
  19
  20 .subtitle {
  21   font-weight: $font-semibold;
  22   margin-bottom: 10px;
  23   font-size: 16px;
  24 }
  25
  26 .block-documentation {
  27   .subtitle {
  28     margin-bottom: 20px;
  29   }
  30 }
  31
  32 li {
  33   margin-bottom: 10px;
  34 }
  35
  36 .configure-instance {
  37   text-align: center;
  38   font-weight: 600;
  39   font-size: 18px;
  40   margin: 20px 0 40px 0;
  41 }
  42
  43 .columns {
  44   display: flex;
  45
  46   .link-block {
  47     @include disable-default-a-behaviour;
  48
  49     color: var(--mainForegroundColor);
  50     padding: 10px;
  51     transition: background-color 0.2s ease-in;
  52
  53     &:hover {
  54       background-color: rgba(0, 0, 0, 0.05);
  55     }
  56
  57     .link-title {
  58       font-size: 16px;
  59       font-weight: $font-semibold;
  60       display: flex;
  61       justify-content: center;
  62       margin-bottom: 5px;
  63     }
  64
  65     .link-title,
  66     div {
  67       text-align: center;
  68     }
  69   }
  70 }
  71
  72 .configure-instance-button {
  73   @include peertube-button;
  74   @include orange-button;
  75
  76   display: inline-block;
  77 }
  78
  79 .action-button-understood {
  80   @include peertube-button;
  81   @include grey-button;
  82 }