www.aleph1.co.uk Git - yaffs-website/blob - web/core/themes/seven/css/theme/maintenance-page.css

   1 /**
   2  * @file
   3  * Maintenance theming.
   4  */
   5
   6 .maintenance-page {
   7   background-color: #e0e0d8;
   8   background-image: -webkit-radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
   9   background-image: radial-gradient(hsl(203, 2%, 90%), hsl(203, 2%, 95%));
  10   background-repeat: repeat;
  11   background-position: left top, 50% 50%; /* LTR */
  12   min-height: 100%;
  13 }
  14 [dir="rtl"] .maintenance-page {
  15   background-position: right top, 50% 50%;
  16 }
  17
  18 .page-title {
  19   font-size: 2em;
  20   line-height: 1.2em;
  21   color: #0074bd;
  22   word-wrap: break-word;
  23 }
  24
  25 /**
  26  * Task list & step indicator
  27  */
  28 @media all and (max-width: 48em) { /* 768px */
  29   header[role="banner"] {
  30     position: relative;
  31   }
  32   .step-indicator {
  33     display: block;
  34     font-size: 1.385em;
  35     position: absolute;
  36     top: 0.2em;
  37     right: 0.5em; /* LTR */
  38   }
  39   [dir="rtl"] .step-indicator {
  40     left: 0.5em;
  41     right: auto;
  42   }
  43   .task-list {
  44     display: none;
  45   }
  46 }
  47
  48 @media all and (min-width: 48em) { /* 768px */
  49   .step-indicator {
  50     display: none;
  51   }
  52   .task-list {
  53     margin-left: 0; /* LTR */
  54     list-style-type: none;
  55     padding-left: 0; /* LTR */
  56     padding-bottom: 1em;
  57   }
  58   [dir="rtl"] .task-list {
  59     margin-right: 0;
  60     padding-right: 0;
  61   }
  62   .task-list li {
  63     padding: 0.5em 1em 0.5em 3.85em; /* LTR */
  64     color: #1a1a1a;
  65   }
  66   [dir="rtl"] .task-list li {
  67     padding: 0.5em 3.85em 0.5em 1em;
  68   }
  69   .task-list .is-active {
  70     background: #ebeae4;
  71     position: relative;
  72     font-weight: normal;
  73   }
  74   .task-list .is-active:after {
  75     left: 100%; /* LTR */
  76     border: solid transparent;
  77     border-color: rgba(235, 234, 228, 0);
  78     border-left-color: #ebeae4; /* LTR */
  79     border-width: 1.35em;
  80     content: " ";
  81     height: 0;
  82     width: 0;
  83     position: absolute;
  84     pointer-events: none;
  85     top: 50%;
  86     margin-top: -1.32em;
  87   }
  88   [dir="rtl"] .task-list .is-active:after {
  89     left: auto;
  90     right: 100%;
  91     border-left-color: transparent;
  92     border-right-color: #ebeae4;
  93   }
  94   .task-list .done {
  95     color: #adadad;
  96   }
  97 }
  98
  99 /**
 100  * Layout
 101  */
 102 .layout-container {
 103   background: #fff;
 104   width: auto;
 105   margin-left: 1.25em;
 106   margin-right: 1.25em;
 107 }
 108 .layout-container:after { /* no reason for a clearfix in the markup */
 109   content: "";
 110   display: table;
 111   clear: both;
 112 }
 113 @media all and (max-width: 48em) { /* 768px */
 114   .layout-container {
 115     margin: 1.25em;
 116     padding: 10px 20px;
 117   }
 118   .page-title {
 119     margin-right: 2em; /* LTR */
 120     margin-bottom: 0.725em;
 121   }
 122   [dir="rtl"] .page-title {
 123     margin-right: 0;
 124     margin-left: 2em;
 125   }
 126 }
 127
 128 @media all and (min-width: 48em) { /* 768px */
 129   html {
 130     display: table;
 131   }
 132   .install-page,
 133   .maintenance-page {
 134     display: table-cell;
 135     padding: 1em 0;
 136     vertical-align: middle;
 137   }
 138   html,
 139   .install-page,
 140   .maintenance-page {
 141     margin: 0;
 142     width: 100%;
 143     height: 100%;
 144   }
 145   .layout-container {
 146     margin: 0 auto;
 147     width: 75%;
 148     max-width: 770px;
 149     border-radius: 5px;
 150     box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
 151     padding: 20px 0 40px 0;
 152   }
 153
 154   /* Positioning sidebar & content */
 155   main {
 156     box-sizing: border-box;
 157     clear: none;
 158     float: left; /* LTR */
 159     padding-left: 3.85em;
 160     padding-right: 3.85em;
 161     width: 65%;
 162   }
 163   [dir="rtl"] main {
 164     float: right;
 165   }
 166   ul {
 167     padding: 15px;
 168     margin: 0.25em 0;
 169   }
 170   [dir="rtl"] ul {
 171     margin-right: 0; /* Overrides default [dir="rtl"] ul margin */
 172   }
 173   .layout-sidebar-first {
 174     float: left; /* LTR */
 175     width: 35%;
 176   }
 177   [dir="rtl"] .layout-sidebar-first {
 178     float: right;
 179   }
 180
 181   /* Margins for sitename */
 182   .page-title {
 183     margin: 0.75em 1.9em;
 184   }
 185 }
 186
 187 /**
 188  * Status report customization for install and update page.
 189  */
 190 .system-status-report__status-title {
 191   float: none;
 192   width: 100%;
 193 }
 194 .system-status-report__entry__value {
 195   float: none;
 196   width: 100%;
 197   padding-left: 3em; /* LTR */
 198   padding-top: 0;
 199 }
 200 [dir="rtl"] .system-status-report__entry__value {
 201   padding-left: 1em;
 202   padding-right: 3em;
 203 }