setup/res/template.css

   1 body {
   2   background: #eee;
   3 }
   4 /* Header */
   5 .civicrm-setup-header{
   6   height: 300px;
   7   width: 100%;
   8   display: block;
   9 }
  10
  11 .civicrm-setup-header .title{
  12   width: 25%;
  13   position: absolute;
  14   overflow: hidden;
  15   float: left;
  16   margin-left: 10%;
  17   margin-top: 50px;
  18   margin-right: 20%;
  19   display: inline-flex;
  20 }
  21
  22 .civicrm-setup-header h1{
  23   line-height: 35px;
  24   color: #ddd;
  25   position: relative;
  26   left: 400px;
  27   -webkit-animation: slide 1s forwards;
  28   -webkit-animation-delay: 0.5s;
  29   animation: slide 1s forwards;
  30   animation-delay: 0.5s;
  31
  32 }
  33
  34 @-webkit-keyframes slide{
  35     100% { left: 0; color:#555;}
  36 }
  37
  38 @keyframes slide{
  39     100% { left: 0; color: #555;}
  40 }
  41
  42
  43 .civicrm-setup-header hr{
  44   border-bottom: 2px solid #fff;
  45   border-top: 2px solid #ddd;
  46 }
  47
  48 .civicrm-setup-body .civicrm-logo {
  49   float: right;
  50   width: 30%;
  51   display: grid;
  52   margin-top: 50px;
  53   margin-right: 10%;
  54 }
  55
  56 .civicrm-setup-body .civicrm-logo img{
  57   width: 100%;
  58 }
  59
  60
  61 /* Header End */
  62
  63 .civicrm-setup-body #All {
  64   font-family: Arial, sans-serif;
  65   width: auto;
  66   margin: 0.5em auto;
  67   padding: 1em;
  68   border: 1px #ccc solid;
  69   border-radius: 10px;
  70   background: #fff;
  71   max-width: 1200px;
  72 }
  73
  74 .civicrm-setup-body form {
  75   margin: 3%;
  76 }
  77
  78 .civicrm-setup-body h2 {
  79   margin-top: 0;
  80   display: inline-block;
  81 }
  82
  83 .civicrm-setup-body li {
  84   padding-bottom: 1.5em;
  85 }
  86
  87 .civicrm-setup-block-components label span {
  88   float: left;
  89   width: 120px;
  90 }
  91
  92 .civicrm-setup-body p.error {
  93   padding: 0.5em;
  94   background-color: #c00;
  95   border: 1px #700 solid;
  96   color: white;
  97   clear: both;
  98 }
  99
 100 .civicrm-setup-body p.warning {
 101   padding: 0.5em;
 102   background-color: #e70;
 103   border: 1px #a70 solid;
 104   color: white;
 105   clear: both;
 106 }
 107
 108 .civicrm-setup-body p.good {
 109   padding: 0.5em;
 110   background-color: #0c0;
 111   border: 1px #070 solid;
 112   color: white;
 113   clear: both;
 114 }
 115
 116 .civicrm-setup-body p.error a {
 117   color: #FFF;
 118   font-weight: bold;
 119 }
 120
 121 .civicrm-setup-body p.tip {
 122   background: #ffb;
 123   padding: 0.5em;
 124   margin: 1em auto;
 125   width: 50%
 126 }
 127
 128 .civicrm-setup-body .advancedTip {
 129   border-collapse: collapse;
 130   font-size: 80%;
 131 }
 132
 133 .civicrm-setup-body .install-validate-ok {
 134   display: none;
 135 }
 136
 137 .civicrm-setup-body .install-validate-bad {
 138 }
 139
 140 .civicrm-setup-body .reqTable {
 141   border-collapse: collapse;
 142   width: 100%;
 143 }
 144
 145 .civicrm-setup-body .reqTable td {
 146   border: 1px #ccc solid;
 147 }
 148
 149 .civicrm-setup-body .reqSeverity-info { color: green; }
 150 .civicrm-setup-body .reqSeverity-warning { color: #a70; }
 151 .civicrm-setup-body .reqSeverity-error { color: #c00; }
 152
 153 .civicrm-setup-body .settingsTable {
 154   border-collapse: collapse;
 155   margin: 2em
 156 }
 157
 158 .civicrm-setup-body th, .civicrm-setup-body td {
 159   text-align: left;
 160   padding: 0.25em;
 161   vertical-align: top;
 162 }
 163
 164 .civicrm-setup-body .comp-box {
 165   height: 3.5em;
 166   width: 30%;
 167   display: inline-block;
 168   padding: 0.5em;
 169   padding-top: 15px;
 170   margin: 0.25em;
 171   border: 1px dashed #aaa;
 172   background: #eee;
 173   text-align: center;
 174 }
 175 .civicrm-setup-body .comp-box:hover { background: #ddd; cursor: hand; }
 176 .civicrm-setup-body .comp-box > span {  width: 100%;  }
 177 .civicrm-setup-body .comp-label {  font-size: 1.5em; }
 178 .civicrm-setup-body .comp-desc { font-style: italic; }
 179 .civicrm-setup-body .comp-cb:checked + label { background: #dfd; }
 180 .civicrm-setup-body .comp-cb:checked + label:hover { background: #cec; }
 181
 182 .civicrm-setup-body .optin-box {
 183   height: 3.5em;
 184   width: 45%;
 185   display: inline-block;
 186   padding: 0.5em;
 187   margin: 0.75em;
 188   border: 1px dashed #aaa;
 189   background: #eee;
 190   text-align: center;
 191 }
 192 .civicrm-setup-body .optin-box:hover { background: #ddd; cursor: hand; }
 193 .civicrm-setup-body .optin-box > span {  width: 100%; }
 194 .civicrm-setup-body .optin-label {  font-size: 1.5em; }
 195 .civicrm-setup-body .optin-desc { font-style: italic; }
 196 .civicrm-setup-body .optin-cb:checked + label { background: #dfd; }
 197 .civicrm-setup-body .optin-cb:checked + label:hover { background: #cec; }
 198
 199 .civicrm-setup-body .sr-only {
 200   position: absolute;
 201   width: 1px;
 202   height: 1px;
 203   padding: 0;
 204   margin: -1px;
 205   overflow: hidden;
 206   clip: rect(0, 0, 0, 0);
 207   border: 0;
 208 }
 209
 210 .civicrm-setup-body.has-errors .if-no-errors {display: none;}
 211 .civicrm-setup-body.has-warnings .if-no-warnings {display: none;}
 212 .civicrm-setup-body.has-problems .if-no-problems {display: none;}
 213 .civicrm-setup-body.has-no-problems .if-problems {display: none;}
 214
 215 .civicrm-setup-body .action-box {
 216   width: 100%;
 217   text-align: center;
 218   margin: 2em 0.5em;
 219 }
 220 .civicrm-setup-body button[type=submit] {
 221   padding:15px 25px;
 222   background:#82C459;
 223   color: white;
 224   border:0 none;
 225   cursor:pointer;
 226   -webkit-border-radius: 5px;
 227   border-radius: 5px;
 228   font-size: 20px;
 229 }
 230 .civicrm-setup-body button[type=submit]:hover {
 231   background: #60A237;
 232 }
 233 .civicrm-setup-body button[type=submit]:disabled {
 234   background: #888;
 235   cursor: not-allowed;
 236 }
 237
 238 .civicrm-setup-body .settingsTable input[type=text] { width: 80%; }
 239
 240
 241
 242 @media only screen and (max-width: 801px){
 243   .civicrm-setup-body .comp-box{
 244     width: 45%;
 245   }
 246 }
 247
 248 @media only screen and (max-width: 635px){
 249   .civicrm-setup-header .title{
 250     width: 45%;
 251     margin-left: 5%;
 252     margin-top: 30px;
 253   }
 254
 255   .civicrm-setup-body .settingsTable{
 256     display: block;
 257     overflow-x: auto;
 258     white-space: nowrap;
 259     width: 95%;
 260     margin: 10px 2% 10px 2%;
 261   }
 262
 263 }
 264
 265 @media only screen and (max-width: 503px){
 266   .civicrm-setup-body .comp-box{
 267     width: 95%;
 268   }
 269 }