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     flex-basis: 33%;
  53
  54     &:hover {
  55       background-color: rgba(0, 0, 0, 0.05);
  56     }
  57
  58     .link-title {
  59       font-size: 16px;
  60       font-weight: $font-semibold;
  61       display: flex;
  62       justify-content: center;
  63       margin-bottom: 5px;
  64     }
  65
  66     .link-title,
  67     div {
  68       text-align: center;
  69     }
  70   }
  71 }
  72
  73 .configure-instance-button {
  74   @include peertube-button;
  75   @include orange-button;
  76
  77   display: inline-block;
  78 }
  79
  80 .action-button-understood {
  81   @include peertube-button;
  82   @include grey-button;
  83 }