annotate modules/overlay/overlay-child.css @ 0:ff03f76ab3fe

initial version
author danieleb <danielebarchiesi@me.com>
date Wed, 21 Aug 2013 18:51:11 +0100
parents
children
rev   line source
danielebarchiesi@0 1
danielebarchiesi@0 2 /**
danielebarchiesi@0 3 * @file
danielebarchiesi@0 4 * Basic styling for the Overlay child pages.
danielebarchiesi@0 5 */
danielebarchiesi@0 6
danielebarchiesi@0 7 html.js {
danielebarchiesi@0 8 background: transparent !important;
danielebarchiesi@0 9 overflow-y: scroll;
danielebarchiesi@0 10 }
danielebarchiesi@0 11 html.js body {
danielebarchiesi@0 12 background: transparent !important;
danielebarchiesi@0 13 margin-left: 0;
danielebarchiesi@0 14 margin-right: 0;
danielebarchiesi@0 15 padding: 20px 0;
danielebarchiesi@0 16 }
danielebarchiesi@0 17
danielebarchiesi@0 18 #overlay {
danielebarchiesi@0 19 display: table;
danielebarchiesi@0 20 margin: 0 auto;
danielebarchiesi@0 21 min-height: 100px;
danielebarchiesi@0 22 min-width: 700px;
danielebarchiesi@0 23 position: relative;
danielebarchiesi@0 24 padding: .2em;
danielebarchiesi@0 25 padding-bottom: 2em;
danielebarchiesi@0 26 padding-right: 26px; /* LTR */
danielebarchiesi@0 27 width: 88%;
danielebarchiesi@0 28 }
danielebarchiesi@0 29 #overlay-titlebar {
danielebarchiesi@0 30 padding: 0 20px;
danielebarchiesi@0 31 position: relative;
danielebarchiesi@0 32 white-space: nowrap;
danielebarchiesi@0 33 z-index: 100;
danielebarchiesi@0 34 }
danielebarchiesi@0 35 #overlay-content {
danielebarchiesi@0 36 background: #fff;
danielebarchiesi@0 37 clear: both;
danielebarchiesi@0 38 color: #000;
danielebarchiesi@0 39 padding: .5em 1em;
danielebarchiesi@0 40 position: relative;
danielebarchiesi@0 41 }
danielebarchiesi@0 42
danielebarchiesi@0 43 #overlay-title-wrapper {
danielebarchiesi@0 44 overflow: hidden;
danielebarchiesi@0 45 }
danielebarchiesi@0 46 #overlay-title {
danielebarchiesi@0 47 color: #fff;
danielebarchiesi@0 48 float: left; /* LTR */
danielebarchiesi@0 49 font-size: 20px;
danielebarchiesi@0 50 margin: 0;
danielebarchiesi@0 51 padding: 0.3em 0;
danielebarchiesi@0 52 }
danielebarchiesi@0 53 #overlay-title:active,
danielebarchiesi@0 54 #overlay-title:focus {
danielebarchiesi@0 55 outline: 0;
danielebarchiesi@0 56 }
danielebarchiesi@0 57
danielebarchiesi@0 58 .overlay #skip-link {
danielebarchiesi@0 59 margin-top: -20px;
danielebarchiesi@0 60 }
danielebarchiesi@0 61 .overlay #skip-link a {
danielebarchiesi@0 62 color: #fff; /* This is white to contrast with the dark background behind it. */
danielebarchiesi@0 63 }
danielebarchiesi@0 64
danielebarchiesi@0 65 #overlay-close-wrapper {
danielebarchiesi@0 66 position: absolute;
danielebarchiesi@0 67 right: 0; /* LTR */
danielebarchiesi@0 68 }
danielebarchiesi@0 69 #overlay-close,
danielebarchiesi@0 70 #overlay-close:hover {
danielebarchiesi@0 71 background: transparent url(images/close.png) no-repeat; /* LTR */
danielebarchiesi@0 72 -moz-border-radius-topleft: 0; /* LTR */
danielebarchiesi@0 73 -webkit-border-top-left-radius: 0; /* LTR */
danielebarchiesi@0 74 border-top-left-radius: 0; /* LTR */
danielebarchiesi@0 75 display: block;
danielebarchiesi@0 76 height: 26px;
danielebarchiesi@0 77 margin: 0;
danielebarchiesi@0 78 padding: 0;
danielebarchiesi@0 79 /* Replace with position:fixed to get a scrolling close button. */
danielebarchiesi@0 80 position: absolute;
danielebarchiesi@0 81 width: 26px;
danielebarchiesi@0 82 }
danielebarchiesi@0 83
danielebarchiesi@0 84 /**
danielebarchiesi@0 85 * Tabs on the overlay.
danielebarchiesi@0 86 */
danielebarchiesi@0 87 #overlay-tabs {
danielebarchiesi@0 88 line-height: 27px;
danielebarchiesi@0 89 margin: -28px 0 0 0;
danielebarchiesi@0 90 position: absolute;
danielebarchiesi@0 91 right: 20px; /* LTR */
danielebarchiesi@0 92 text-transform: uppercase;
danielebarchiesi@0 93 }
danielebarchiesi@0 94 #overlay-tabs li {
danielebarchiesi@0 95 display: inline;
danielebarchiesi@0 96 list-style: none;
danielebarchiesi@0 97 margin: 0 0 0 -3px; /* LTR */
danielebarchiesi@0 98 padding: 0;
danielebarchiesi@0 99 }
danielebarchiesi@0 100 #overlay-tabs li a,
danielebarchiesi@0 101 #overlay-tabs li a:active,
danielebarchiesi@0 102 #overlay-tabs li a:visited,
danielebarchiesi@0 103 #overlay-tabs li a:hover {
danielebarchiesi@0 104 background-color: #a6a7a2;
danielebarchiesi@0 105 -moz-border-radius: 8px 8px 0 0;
danielebarchiesi@0 106 -webkit-border-top-left-radius: 8px;
danielebarchiesi@0 107 -webkit-border-top-right-radius: 8px;
danielebarchiesi@0 108 border-radius: 8px 8px 0 0;
danielebarchiesi@0 109 color: #000;
danielebarchiesi@0 110 display: inline-block;
danielebarchiesi@0 111 font-size: 11px;
danielebarchiesi@0 112 font-weight: bold;
danielebarchiesi@0 113 margin: 0 0 2px 0;
danielebarchiesi@0 114 outline: 0;
danielebarchiesi@0 115 padding: 0 14px;
danielebarchiesi@0 116 text-decoration: none;
danielebarchiesi@0 117 }
danielebarchiesi@0 118 #overlay-tabs li.active a,
danielebarchiesi@0 119 #overlay-tabs li.active a.active,
danielebarchiesi@0 120 #overlay-tabs li.active a:active,
danielebarchiesi@0 121 #overlay-tabs li.active a:visited {
danielebarchiesi@0 122 background-color: #fff;
danielebarchiesi@0 123 margin: 0;
danielebarchiesi@0 124 padding-bottom: 2px;
danielebarchiesi@0 125 }
danielebarchiesi@0 126 #overlay-tabs li a:focus,
danielebarchiesi@0 127 #overlay-tabs li a:hover {
danielebarchiesi@0 128 color: #fff;
danielebarchiesi@0 129 }
danielebarchiesi@0 130 #overlay-tabs li.active a:focus,
danielebarchiesi@0 131 #overlay-tabs li.active a:hover {
danielebarchiesi@0 132 color: #000;
danielebarchiesi@0 133 }
danielebarchiesi@0 134
danielebarchiesi@0 135 /**
danielebarchiesi@0 136 * Add to shortcuts link
danielebarchiesi@0 137 */
danielebarchiesi@0 138 #overlay-titlebar .add-or-remove-shortcuts {
danielebarchiesi@0 139 padding-top: 0.9em;
danielebarchiesi@0 140 }
danielebarchiesi@0 141
danielebarchiesi@0 142 /**
danielebarchiesi@0 143 * IE6 shows elements with position:fixed as position:static so replace
danielebarchiesi@0 144 * it with position:absolute;
danielebarchiesi@0 145 */
danielebarchiesi@0 146 * html #overlay-close,
danielebarchiesi@0 147 * html #overlay-close:hover {
danielebarchiesi@0 148 position: absolute;
danielebarchiesi@0 149 }
danielebarchiesi@0 150
danielebarchiesi@0 151 /**
danielebarchiesi@0 152 * Disable message.
danielebarchiesi@0 153 */
danielebarchiesi@0 154 #overlay-disable-message {
danielebarchiesi@0 155 background-color: #fff;
danielebarchiesi@0 156 margin: -20px auto 20px;
danielebarchiesi@0 157 width: 80%;
danielebarchiesi@0 158 -moz-border-radius: 0 0 8px 8px;
danielebarchiesi@0 159 -webkit-border-bottom-left-radius: 8px;
danielebarchiesi@0 160 -webkit-border-bottom-right-radius: 8px;
danielebarchiesi@0 161 border-radius: 0 0 8px 8px;
danielebarchiesi@0 162 }
danielebarchiesi@0 163 .overlay-disable-message-focused {
danielebarchiesi@0 164 padding: 0.5em;
danielebarchiesi@0 165 }
danielebarchiesi@0 166 .overlay-disable-message-focused a {
danielebarchiesi@0 167 display: block;
danielebarchiesi@0 168 float: left;
danielebarchiesi@0 169 }
danielebarchiesi@0 170 .overlay-disable-message-focused #overlay-dismiss-message {
danielebarchiesi@0 171 float: right;
danielebarchiesi@0 172 }