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, .install-page, .maintenance-page {
 139     margin: 0;
 140     width: 100%;
 141     height: 100%;
 142   }
 143   .layout-container {
 144     margin: 0 auto;
 145     width: 75%;
 146     max-width: 770px;
 147     border-radius: 5px;
 148     box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
 149     padding: 20px 0 40px 0;
 150   }
 151
 152   /* Positioning sidebar & content */
 153   main {
 154     box-sizing: border-box;
 155     clear: none;
 156     float: left; /* LTR */
 157     padding-left: 3.85em;
 158     padding-right: 3.85em;
 159     width: 65%;
 160   }
 161   [dir="rtl"] main {
 162     float: right;
 163   }
 164   ul {
 165     padding: 15px;
 166     margin: 0.25em 0;
 167   }
 168   [dir="rtl"] ul {
 169     margin-right: 0; /* Overrides default [dir="rtl"] ul margin */
 170   }
 171   .layout-sidebar-first {
 172     float: left; /* LTR */
 173     width: 35%;
 174   }
 175   [dir="rtl"] .layout-sidebar-first {
 176     float: right;
 177   }
 178
 179   /* Margins for sitename */
 180   .page-title {
 181     margin: 0.75em 1.9em;
 182   }
 183 }
 184
 185 /**
 186  * Status report customization for install and update page.
 187  */
 188 .system-status-report__status-title {
 189   float: none;
 190   width: 100%;
 191 }
 192 .system-status-report__entry__value {
 193   float: none;
 194   width: 100%;
 195   padding-left: 3em; /* LTR */
 196   padding-top: 0;
 197 }
 198 [dir="rtl"] .system-status-report__entry__value {
 199   padding-left: 1em;
 200   padding-right: 3em;
 201 }