Commit 19f5a685 authored by Robert Lyon's avatar Robert Lyon Committed by Gerrit Code Review
Browse files

Merge "Changes by design team on master-design (Bug #1451263)"

parents fa94eba6 4b5886e9
......@@ -14,6 +14,7 @@ html {
margin: 0;
padding: 0;
}
.clearfix:after {
content: ".";
display: block;
......@@ -21,10 +22,12 @@ html {
clear: both;
visibility: hidden;
}
.ui-widget,
.ui-widget button {
font-family: inherit;
}
body,
caption,
th,
......@@ -40,12 +43,17 @@ button,
.select2-search input {
font-family: Arial, "Nimbus Sans L", Helvetica, sans-serif;
}
#container,
.sitemessage,
#switchwrap { /* Use a 12px base font size with a 16px line height */
font-size: 0.75em; /* 16px x .75 = 12px */
line-height: 1.333em; /* 12px x 1.333 = 16px */
#switchwrap {
/* Use a 12px base font size with a 16px line height */
font-size: 0.75em;
/* 16px x .75 = 12px */
line-height: 1.333em;
/* 12px x 1.333 = 16px */
}
pre,
code,
tt {
......@@ -53,52 +61,66 @@ tt {
font-family: "Courier New", "DejaVu Sans Mono", monospace;
white-space: pre-wrap;
}
blockquote {
margin: 10px 30px;
border-left: 2px solid #999999;
padding-left: 1em;
}
acronym {
border-bottom: 1px dotted #D1D1D1;
}
img {
border: 0;
}
ul,
ol {
margin: 5px 0 10px 0;
padding: 0;
}
ul li {
margin: 0 0 3px 20px;
}
ol li {
margin: 0 0 3px 30px;
}
p {
margin: 10px 0;
}
p span {
line-height: 1.333em;
}
.backtrace {
font: normal 110%/1.5em monospace;
}
/* links styling for accessibility */
:focus {
outline: 2px solid #FFFF00;
}
div:focus {
outline: 0;
}
html:focus {
outline: 0;
}
a,
a:hover,
a:active {
outline: none;
}
/******************** Body ********************/
body {
color: #333333;
......@@ -107,10 +129,13 @@ body {
margin: 0;
padding: 0;
}
body#micro {
background-color: #EEEEEE;
}
/******************** General headings ********************/
h1,
h2,
h3,
......@@ -122,24 +147,37 @@ h6 {
white-space: normal;
word-wrap: break-word;
}
h1 {
font-size: 2em; /* 24px */
font-size: 2em;
/* 24px */
}
h2 {
font-size: 1.667em; /* 20px */
font-size: 1.667em;
/* 20px */
}
h3 {
font-size: 1.5em; /* 18px */
font-size: 1.5em;
/* 18px */
}
h4 {
font-size: 1.333em; /* 16px */
font-size: 1.333em;
/* 16px */
}
h5 {
font-size: 1.167em; /* 14px */
font-size: 1.167em;
/* 14px */
}
h6 {
font-size: 1em; /* 12px */
font-size: 1em;
/* 12px */
}
h1:first-child,
h2:first-child,
h3:first-child,
......@@ -148,48 +186,62 @@ h5:first-child,
h6:first-child {
margin-top: 0;
}
/******************** Placement ********************/
.left {
text-align: left;
}
.center {
text-align: center;
}
.right {
text-align: right;
}
.fl {
float: left;
}
.fr {
float: right;
}
.cl {
clear: left;
}
.cr {
clear: right;
}
.cb {
clear: both;
}
.fullwidth {
width: 100%;
}
.halfwidth {
width: 50%;
}
.onethirdwidth {
width: 33%;
}
form.oneline.inline div,
.inline {
display: inline;
}
.hidefocus:focus,
.hidefocus:active {
outline: 0;
}
/* Hides the element but leaves it accessible to screen readers */
.accessible-hidden {
display: inline;
......@@ -197,10 +249,12 @@ form.oneline.inline div,
clip: rect(1px, 1px, 1px, 1px);
overflow: hidden;
}
.hidden,
.dontshow {
display: none;
}
/* Hides without being "destructive" - element + children still have full
width/height */
.safe-hidden {
......@@ -208,22 +262,27 @@ form.oneline.inline div,
visibility: hidden;
top: 0;
}
.nojs-hidden-inline,
.nojs-hidden-block,
.nojs-hidden-table,
.nojs-hidden-table-cell {
display: none;
}
.bar-before {
border-left: 1px solid #D1D1D1;
}
#footer-nav .bar-before {
border-left: 1px solid #5B5C5C;
}
.dont-collapse:after {
content: ".";
visibility: hidden;
}
/******************** Loading ********************/
#loading-box {
background-color: #DDDDDD;
......@@ -236,6 +295,7 @@ form.oneline.inline div,
-webkit-box-shadow: 0px 0px 5px 0px #333333;
box-shadow: 0px 0px 5px 0px #333333;
}
/******************** Overlay ********************/
#overlay {
position: fixed;
......@@ -245,18 +305,21 @@ form.oneline.inline div,
height: 100%;
opacity: 0.7;
background-color: #000000;
filter: alpha(opacity=70);
filter: alpha(opacity = 70);
z-index: 11;
}
img.close:focus {
border: 1px solid #FFFF00;
}
/******************** UI dialog ********************/
.ui-widget-overlay {
opacity: 0.7;
background: #000000;
filter: alpha(opacity=70);
filter: alpha(opacity = 70);
}
.ui-dialog {
background: #FFFFFF;
border: 5px solid #DDDDDD;
......@@ -266,17 +329,20 @@ img.close:focus {
padding: 10px;
font-size: 0.75em;
}
.ui-dialog .ui-dialog-titlebar {
border-bottom: 2px solid #D1D1D1;
background: none;
padding: 3px 0;
}
.ui-dialog .ui-dialog-title {
margin: 3px 0;
color: #333333;
font-size: 1.333em;
font-weight: bold;
}
.ui-dialog .ui-dialog-titlebar-close {
background: transparent url(../images/btn_close.png) no-repeat 0 0;
border: 0 !important;
......@@ -287,26 +353,32 @@ img.close:focus {
vertical-align: top;
cursor: pointer !important;
}
.ui-dialog .ui-dialog-titlebar-close .ui-icon {
background: none;
}
.ui-dialog .ui-dialog-content {
padding: 0;
margin: 10px 0;
}
.ui-dialog .ui-dialog-buttonpane {
border-top: 0;
padding: 0;
}
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
float: none;
}
/******************** MCE Modal ********************/
#mce-modal-block {
opacity: 0.7 !important;
background: #000000 !important;
filter: alpha(opacity=70) !important;
filter: alpha(opacity = 70) !important;
}
.mce-window {
background: #FFFFFF !important;
border: 5px solid #DDDDDD !important;
......@@ -317,10 +389,12 @@ img.close:focus {
font-size: 0.75em !important;
font-family: Arial, "Nimbus Sans L", Helvetica, sans-serif !important;
}
.mce-window-head {
padding: 3px 0 3px 0 !important;
border-bottom: 2px solid #D1D1D1 !important;
}
button.mce-close {
background: transparent url(../images/btn_close.png) no-repeat 0 0 !important;
width: 24px !important;
......@@ -331,10 +405,12 @@ button.mce-close {
right: 0 !important;
top: 0 !important;
}
.mce-foot {
background: none !important;
border: 0 !important;
}
/******************** Ajax login ********************/
#ajax-login-form {
border: 5px solid #DDDDDD;
......@@ -349,16 +425,20 @@ button.mce-close {
-moz-border-radius: 10px;
border-radius: 10px;
}
/******************** Help ********************/
.help {
vertical-align: top;
}
.help a {
display: inline-block;
}
.help a:hover {
cursor: help;
}
.contextualHelp {
padding: 10px;
margin: 0;
......@@ -374,12 +454,14 @@ button.mce-close {
-moz-border-radius: 10px;
border-radius: 10px;
}
.help-dismiss {
vertical-align: top;
}
/**************** Messages ****************/
div.ok {
background: #E6F6E0 url(../images/success.png) no-repeat 4px 4px;
background: #e6f6e0 url(../images/success.png) no-repeat 4px 4px;
padding: 5px 5px 5px 26px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
......@@ -389,9 +471,10 @@ div.ok {
font-size: 1em;
color: #333333;
}
div.error,
span.error {
background: #FEE7E7 url(../images/failure.png) no-repeat 4px 4px;
background: #fee7e7 url(../images/failure.png) no-repeat 4px 4px;
padding: 5px 5px 5px 27px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
......@@ -401,8 +484,9 @@ span.error {
font-size: 1em;
color: #333333;
}
div.info {
background: #E5ECF4 url(../images/info.png) no-repeat 4px 4px;
background: #e5ecf4 url(../images/info.png) no-repeat 4px 4px;
padding: 5px 5px 5px 27px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
......@@ -412,9 +496,10 @@ div.info {
font-size: 1em;
color: #333333;
}
div.warning,
.errmsg {
background: #FFF3E0 url(../images/warning.png) no-repeat 4px 3px;
background: #fff3e0 url(../images/warning.png) no-repeat 4px 3px;
padding: 5px 5px 5px 26px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
......@@ -424,11 +509,13 @@ div.warning,
font-size: 1em;
color: #333333;
}
/* system messages between nav and main content */
#messages {
padding: 0;
margin: 10px 0;
}
/* system messages */
.message {
margin: 5px 0;
......@@ -437,12 +524,15 @@ div.warning,
color: #333333;
text-align: center;
}
.message p:first-child {
margin-top: 0;
}
.message p:last-child {
margin-bottom: 0;
}
/* warning messages without icon */
.attentionmessage {
background: #FFF3E0;
......@@ -453,9 +543,11 @@ div.warning,
padding: 5px;
text-align: center;
}
.attentionform {
margin: 10px auto 5px auto;
}
/* delete messages without icon */
.deletemessage {
background: #FEE7E7;
......@@ -466,13 +558,16 @@ div.warning,
padding: 5px;
text-align: center;
}
.deletemessage .deletebuttonwrap {
padding: 5px;
}
/******************** General text ********************/
.s {
font-size: 0.917em;
}
.description,
.unvalidated,
.postdetails {
......@@ -480,66 +575,84 @@ div.warning,
color: #707070;
font-weight: normal;
}
.nowrap {
white-space: nowrap;
}
.dull {
color: #707070;
}
.tags {
margin: 20px 0 10px 0;
}
/* some common listing text styles */
.title,
.title:first-child {
font-size: 1.167em;
margin: 3px 0;
}
.detail {
margin: 3px 0;
}
.detail br {
line-height: 1px;
height: 1px;
content: " ";
}
.postedon {
font-size: 0.917em;
line-height: 1.167em;
}
ul.listing {
list-style: none;
}
.listing .listrow {
padding: 3px 5px;
margin: 0;
}
.listing .listrow h3.title {
display: inline-block;
}
.listing .tags {
margin: 3px 0;
}
/******************** Tables ********************/
table {
border-spacing: 0;
border-collapse: collapse;
}
table.fixwidth {
table-layout: fixed;
}
th {
padding: 3px 5px;
text-align: left;
line-height: 1.25em;
vertical-align: top;
}
thead th {
white-space: nowrap;
border-bottom: 1px solid #CCCCCC;
font-size: 1.167em;
}
/* those that need to align with td */
.file th,
.html th,
.text th,
......@@ -561,88 +674,110 @@ thead th {
.autocomplete th {
padding-top: 8px;
}
.switchbox th {
padding-top: 10px;
}
td {
padding: 3px 5px;
vertical-align: top;
}
.valign {
padding: 6px 5px 3px 5px;
}
tfoot td {
padding: 5px 0;
}
/* small td for tickboxes and icons */
td.narrow {
padding: 3px;
width: 25px;
}
/* to align tag in edit tables */
tr.tags td div div {
line-height: 2em;
}
/* Alternative row background */
.r0,
.r0 td,
.d0 {
background-color: #F9F9F9;
}
.r1,
.r1 td,
.d1 {
background-color: #F3F3F3;
}
/* Highlight row background */
tr.highlight td,
tr.highlight-file td {
background-color: #FFFCD8;
}
/* icon container (icons are 24px wide) */
td.icon-container {