production/example_apps/zippy_maps/webroot/css/cake.css

   1 .disabled a,
   2 a.disabled {
   3     pointer-events: none;
   4 }
   5
   6 a:hover {
   7     color: #15848F;
   8 }
   9
  10 a {
  11     color: #1798A5;
  12 }
  13
  14 .side-nav li a:not(.button) {
  15     color: #15848F;
  16 }
  17
  18 .side-nav li a:not(.button):hover {
  19     color: #15848F;
  20 }
  21
  22 header {
  23     background-color: #D33C44;
  24     color: #ffffff;
  25     font-size: 30px;
  26     height: 84px;
  27     line-height: 64px;
  28     padding: 16px 0px;
  29     box-shadow: 0px 1px rgba(0, 0, 0, 0.24);
  30 }
  31
  32 header .header-title {
  33     padding-left:80px
  34 }
  35
  36 legend {
  37     color:#15848F;
  38 }
  39
  40 .row {
  41     max-width: 80rem;
  42 }
  43
  44 .actions.columns {
  45     margin-top:1rem;
  46     border-left: 5px solid #15848F;
  47     padding-left: 15px;
  48     padding: 32px 20px;
  49 }
  50
  51 .actions.columns h3 {
  52     color:#15848F;
  53 }
  54
  55 .related table {
  56     border: 0;
  57     width: 100%;
  58     table-layout: fixed;
  59 }
  60
  61 .index table thead {
  62     height: 3.5rem;
  63 }
  64
  65 .header-help {
  66     float: right;
  67     margin-right:2rem;
  68     margin-top: -80px;
  69     font-size:16px;
  70 }
  71
  72 .header-help span {
  73     font-weight: normal;
  74     text-align: center;
  75     text-decoration: none;
  76     line-height: 1;
  77     white-space: nowrap;
  78     display: inline-block;
  79     padding: 0.25rem 0.5rem 0.375rem;
  80     font-size: 0.8rem;
  81     background-color: #0097a7;
  82     color: #FFF;
  83     border-radius: 1000px;
  84 }
  85
  86 .header-help a {
  87     color: #fff;
  88 }
  89
  90 ul.pagination li a {
  91     color: rgba(0, 0 ,0 , 0.54);
  92 }
  93
  94 ul.pagination li.active a {
  95     background-color: #DCE47E;
  96     color: #FFF;
  97     font-weight: bold;
  98     cursor: default;
  99 }
 100 ul.pagination .disabled:hover a {
 101     background: none;
 102 }
 103
 104 .paginator {
 105     text-align: center;
 106 }
 107
 108 .paginator ul.pagination li {
 109     float: none;
 110     display: inline-block;
 111 }
 112
 113 .paginator p {
 114     text-align: right;
 115     color: rgba(0, 0 ,0 , 0.54);
 116 }
 117
 118 .asc:after {
 119     content: " \2193";
 120 }
 121 .desc:after {
 122     content: " \2191";
 123 }
 124
 125 .form .error-message {
 126     display: block;
 127     padding: 0.375rem 0.5625rem 0.5625rem;
 128     margin-top: -1px;
 129     margin-bottom: 1rem;
 130     font-size: 0.75rem;
 131     font-weight: normal;
 132     font-style: italic;
 133     color: rgba(0, 0, 0, 0.54);
 134 }
 135
 136 .required > label {
 137     font-weight: bold;
 138 }
 139 .required > label:after {
 140     content: ' *';
 141     color: #C3232D;
 142 }
 143
 144 select[multiple] {
 145     min-height:150px;
 146     background: none;
 147 }
 148 input[type=checkbox],
 149 input[type=radio] {
 150     margin-right: 0.5em;
 151 }
 152
 153 .date select,
 154 .time select,
 155 .datetime select {
 156     display: inline;
 157     width: auto;
 158     margin-right: 10px;
 159 }
 160
 161 .error label,
 162 .error label.error {
 163     color: #C3232D;
 164 }
 165
 166 .view h2 {
 167     color: #6F6F6F;
 168 }
 169
 170 .view .columns.strings {
 171     border-radius: 3px;
 172     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 173     margin-right:0.7rem;
 174 }
 175
 176 .view .numbers {
 177     background-color: #B7E3EC;
 178     color: #FFF;
 179     border-radius: 3px;
 180     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 181     margin-right: 0.7rem;
 182 }
 183
 184 .view .columns.dates {
 185     border-radius: 3px;
 186     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 187     margin-right:0.7rem;
 188     background-color:#DCE47E;
 189     color: #fff;
 190 }
 191
 192 .view .columns.booleans {
 193     border-radius: 3px;
 194     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 195     margin-right:0.7rem;
 196     background-color: #8D6E65;
 197     color: #fff;
 198 }
 199
 200 .view .strings p {
 201     border-bottom: 1px solid #eee;
 202 }
 203 .view .numbers .subheader, .view .dates .subheader {
 204     color:#747474;
 205 }
 206 .view .booleans .subheader {
 207     color: #E9E9E9
 208 }
 209
 210 .view .texts .columns {
 211     margin-top:1.2rem;
 212     border-bottom: 1px solid #eee;
 213 }
 214
 215 /** Notices and Errors **/
 216 .cake-error,
 217 .cake-debug,
 218 .notice,
 219 p.error,
 220 p.notice {
 221     display: block;
 222     clear: both;
 223     background-repeat: repeat-x;
 224     margin-bottom: 18px;
 225     padding: 7px 14px;
 226     border-radius: 3px;
 227     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 228 }
 229
 230 .cake-debug,
 231 .notice,
 232 p.notice {
 233     color: #000000;
 234     background: #ffcc00;
 235 }
 236
 237 .cake-error,
 238 p.error {
 239     color: #fff;
 240     background: #C3232D;
 241 }
 242
 243 pre {
 244     background: none repeat scroll 0% 0% #FFF;
 245     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 246     margin: 15px 0px;
 247     color: rgba(0, 0 ,0 , 0.74);
 248     padding:5px;
 249 }
 250
 251 .cake-error .cake-stack-trace {
 252     margin-top:10px;
 253 }
 254
 255 .cake-stack-trace code {
 256     background: inherit;
 257     border:0;
 258 }
 259
 260 .cake-code-dump .code-highlight {
 261     display: block;
 262     background-color: #FFC600;
 263 }
 264
 265 .cake-error a,
 266 .cake-error a:hover {
 267     color:#fff;
 268     text-decoration: underline;
 269 }
 270
 271 .checks {
 272     padding:30px;
 273     color: #626262;
 274     background-color: #B7E3EC;
 275     border-radius: 3px;
 276     box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.24);
 277     margin-bottom: 2em;
 278 }
 279
 280 .checks h4 {
 281     margin-bottom: 1.5rem;
 282 }
 283
 284 .checks hr {
 285     border: 0;
 286     height: 0;
 287     border-top: 1px solid rgba(0, 0, 0, 0.1);
 288     border-bottom: 1px solid rgba(255, 255, 255, 0.3);
 289 }
 290
 291 .checks .success,
 292 .checks .problem {
 293     margin-left: 10px;
 294 }
 295 .checks .success:before,
 296 .checks .problem:before {
 297     line-height: 0px;
 298     font-size: 28px;
 299     height: 12px;
 300     width: 12px;
 301     border-radius: 15px;
 302     text-align: center;
 303     vertical-align: middle;
 304     display: inline-block;
 305     position: relative;
 306     left: -11px;
 307 }
 308
 309 .checks .success:before {
 310     content: "✓";
 311     color: green;
 312     margin-right: 9px;
 313 }
 314
 315 .checks .problem:before {
 316     content: "✘";
 317     color: red;
 318     margin-right: 9px;
 319 }
 320
 321 .top-bar.expanded .title-area {
 322     background: #01545b;
 323 }
 324
 325 .top-bar.expanded, .top-bar,.top-bar-section ul li,.top-bar-section li:not(.has-form) a:not(.button) {
 326     background: #116d76;
 327 }
 328
 329 .top-bar-section li:not(.has-form) a:not(.button):hover {
 330     background-color: #308e97;
 331     background: #308e97;
 332 }
 333
 334 .side-nav li.heading {
 335     color: #1798A5;
 336     font-size: 0.875rem;
 337     font-weight: bold;
 338     text-transform: uppercase;
 339     padding: 0.4375rem 0.875rem;
 340 }
 341
 342 #actions-sidebar {
 343     background: #fafafa;
 344 }
 345
 346 .index table {
 347     margin-top: 0rem;
 348     border: 0;
 349     width: 100%;
 350     table-layout: fixed;
 351 }
 352
 353 table {
 354     background: #fff;
 355     margin-bottom: 1.25rem;
 356     border: none;
 357     table-layout: fixed;
 358     width: 100%;
 359 }
 360
 361 table thead {
 362     background: none;
 363 }
 364
 365 table tr {
 366     border-bottom: 1px solid #ebebec;
 367 }
 368
 369 table thead tr {
 370     border-bottom: 1px solid #1798A5;
 371 }
 372
 373 table tr th {
 374     padding: 0.5625rem 0.625rem;
 375     font-size: 0.875rem;
 376     color: #1798A5;
 377     text-align: left;
 378     border-bottom: 2px solid #1798A5;
 379 }
 380
 381 table tr:nth-of-type(even) {
 382     background: none;
 383 }
 384
 385 fieldset {
 386     border: none;
 387     padding: 1.25rem;
 388     margin: 1.125rem 0;
 389 }
 390
 391 fieldset legend {
 392     border-bottom: 2px solid #1798A5;
 393     width: 100%;
 394     line-height: 2rem;
 395 }
 396
 397 .form button[type="submit"] {
 398     float: right;
 399     text-transform: uppercase;
 400     box-shadow: none;
 401 }
 402
 403 .form button:hover, .form button:focus {
 404     background: #BE840B;
 405     box-shadow: none;
 406 }
 407
 408 button {
 409     background: #966600;
 410 }
 411
 412 div.message {
 413     text-align: center;
 414     cursor: pointer;
 415     display: block;
 416     font-weight: normal;
 417     padding: 0 1.5rem 0 1.5rem;
 418     transition: height 300ms ease-out 0s;
 419     background-color: #a0d3e8;
 420     color: #626262;
 421     top: 15px;
 422     right: 15px;
 423     z-index: 999;
 424     overflow: hidden;
 425     height: 50px;
 426     line-height: 2.5em;
 427     box-radius: 5px;
 428 }
 429
 430 div.message:before {
 431     line-height: 0px;
 432     font-size: 20px;
 433     height: 12px;
 434     width: 12px;
 435     border-radius: 15px;
 436     text-align: center;
 437     vertical-align: middle;
 438     display: inline-block;
 439     position: relative;
 440     left: -11px;
 441     background-color: #FFF;
 442     padding: 12px 14px 12px 10px;
 443     content: "i";
 444     color: #a0d3e8;
 445 }
 446
 447 div.message.error {
 448     background-color: #C3232D;
 449     color: #FFF;
 450 }
 451
 452 div.message.error:before {
 453     padding: 11px 16px 14px 7px;
 454     color: #C3232D;
 455     content: "x";
 456 }
 457 div.message.hidden {
 458     height: 0;
 459 }
 460
 461
 462 .vertical-table th {
 463     padding: 0.5625rem 0.625rem;
 464     font-size: 0.875rem;
 465     color: #1798A5;
 466     border: none;
 467     text-align: left;
 468 }
 469
 470 .vertical-table {
 471     vertical-align: middle;
 472 }
 473
 474 .vertical-table td {
 475     text-align: right;
 476 }
 477
 478 .content {
 479     padding: 2rem;
 480 }
 481
 482 /* Use 'one true layout' methods to get equal height columns */
 483 .container {
 484     overflow: hidden;
 485     min-height: 92%; /* full height almost always */
 486 }
 487
 488 /* Force equal height by overflowing */
 489 .content,
 490 #actions-sidebar {
 491     margin-bottom: -99999px;
 492     padding-bottom: 99999px;
 493 }
 494 @media(max-width: 640px) {
 495     #actions-sidebar {
 496         padding-bottom: 2rem;
 497         margin-bottom: 0;
 498     }
 499 }
 500
 501 .content h3 {
 502     color: #be140b;
 503     padding-bottom: 0.5rem;
 504     margin-bottom: 20px;
 505 }
 506
 507 .content h4 {
 508     color: #be140b;
 509     padding-bottom: 0.5rem;
 510     margin-bottom: 20px;
 511     border-bottom: 2px solid #be140b;
 512 }
 513
 514 .content .related h4 {
 515     color: #4d8f97;
 516     padding-bottom: 0.5rem;
 517     margin-top: 20px;
 518     margin-bottom: 10px;
 519     border-bottom: 0px;
 520 }
 521
 522 table td {
 523     vertical-align: top;
 524     word-break: break-all;
 525 }