Styling for new install
This commit is contained in:
BNoiZe
531
install/templates/assets/css/install.css
Executable file
531
install/templates/assets/css/install.css
Executable file
@@ -0,0 +1,531 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/* RESET */
|
||||
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin:0; padding:0; }
|
||||
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size:1em; font-weight:400; font-style:normal; }
|
||||
ul,ol { list-style:none; }
|
||||
fieldset,img { border:none; }
|
||||
caption,th { text-align:left; }
|
||||
table { border-collapse:collapse; border-spacing:0; }
|
||||
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
|
||||
|
||||
/* TYPE */
|
||||
html,body {
|
||||
font:12px/18px Helvetica,Arial,Verdana,sans-serif;
|
||||
background-color:#f2f2f2;
|
||||
color:#333;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
body {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.dark {
|
||||
background-color: #e9edf0;
|
||||
border-bottom:1px solid #d1d5d8;
|
||||
}
|
||||
|
||||
header img {
|
||||
padding:10px 0 10px 10px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
display:none;
|
||||
}
|
||||
|
||||
h2, h3 {
|
||||
margin: 0 0 1em 0;
|
||||
padding: 0;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size:17px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
|
||||
img {
|
||||
border:0;
|
||||
vertical-align:middle;
|
||||
}
|
||||
|
||||
td a {
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
.bradius {
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
box-shadow: rgba(0, 0, 0, 0.34902) 0px 1px 3px 0px;
|
||||
}
|
||||
|
||||
/* FOOTER */
|
||||
footer {
|
||||
clear:both;
|
||||
text-align:center;
|
||||
color: #888;
|
||||
font-size:10px !important;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
footer a,footer a:active,footer a:visited {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.install {
|
||||
background-color:#fff;
|
||||
margin: 20px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 12px;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 10px !important;
|
||||
}
|
||||
|
||||
.installsec {
|
||||
margin-top:10px;
|
||||
padding:0;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.installsec table {
|
||||
width:100%;
|
||||
padding:0 10px;
|
||||
margin: 15px 0 15px 0;
|
||||
}
|
||||
|
||||
.installsec h2 {
|
||||
display: block;
|
||||
border-bottom: 1px solid #d1d5d8;
|
||||
margin: 0;
|
||||
padding: 5px 15px 15px 15px;
|
||||
}
|
||||
|
||||
.installsec form {
|
||||
width:800px;
|
||||
margin:0 auto;
|
||||
padding:10px 0 0;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.installsec fieldset {
|
||||
border:0;
|
||||
float:left;
|
||||
clear:left;
|
||||
width:600px;
|
||||
margin:0 100px 10px;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
.installsec legend {
|
||||
display:none;
|
||||
}
|
||||
|
||||
.installsec label {
|
||||
float:left;
|
||||
width:26em;
|
||||
margin-right:1em;
|
||||
margin-top:6px;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
p.submit {
|
||||
text-align:right;
|
||||
padding-right:46px;
|
||||
}
|
||||
|
||||
.installsec aside {
|
||||
border-top:1px solid #d1d5d8;
|
||||
clear:both;
|
||||
float:none;
|
||||
width:auto;
|
||||
text-align: right;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.line {
|
||||
border: 0;
|
||||
width: 800px;
|
||||
border-bottom:1px solid #d1d5d8;
|
||||
}
|
||||
|
||||
.messagewrapper {
|
||||
width:650px;
|
||||
margin:0 auto;
|
||||
padding:120px 0 0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.messagewrapperfull {
|
||||
width:100%;
|
||||
margin:0 auto;
|
||||
padding:0;
|
||||
overflow:hidden;
|
||||
}
|
||||
|
||||
.overviewsearch {
|
||||
position:absolute;
|
||||
top:155px;
|
||||
right:36px;
|
||||
font-size:80%;
|
||||
}
|
||||
|
||||
.overviewadd {
|
||||
padding:10px;
|
||||
font-weight:700;
|
||||
}
|
||||
|
||||
/*
|
||||
* error message display
|
||||
*/
|
||||
.errorcontainer {
|
||||
background:url(../img/icons/error_big.png) 10px center no-repeat #ffedef;
|
||||
border:1px solid #ffc2ca;
|
||||
padding:10px 10px 10px 68px!important;
|
||||
margin: 10px 0 10px 0 !important;
|
||||
text-align:left!important;
|
||||
overflow:hidden;
|
||||
box-shadow: 0px 0px 0px black;
|
||||
}
|
||||
|
||||
.errortitle {
|
||||
font-weight:700;
|
||||
color:#c00!important;
|
||||
}
|
||||
|
||||
.error {
|
||||
font-weight:400!important;
|
||||
color:#c00!important;
|
||||
}
|
||||
|
||||
/*
|
||||
* warning message display
|
||||
*/
|
||||
.warningcontainer,.ui-dialog {
|
||||
background:url(../img/icons/warning_big.png) 10px center no-repeat #fffecc;
|
||||
border:1px solid #f3c37e;
|
||||
padding:10px 10px 10px 68px !important;
|
||||
margin: 10px 0 10px 0 !important;
|
||||
text-align:left!important;
|
||||
overflow:hidden;
|
||||
box-shadow: 0px 0px 0px black;
|
||||
}
|
||||
.ui-dialog {
|
||||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.warningtitle,.ui-dialog-titlebar {
|
||||
font-weight:700;
|
||||
color:#D57D00;
|
||||
}
|
||||
|
||||
.warning,.ui-dialog-content {
|
||||
color:#D57D00!important;
|
||||
}
|
||||
|
||||
/*
|
||||
* success message display
|
||||
*/
|
||||
.successcontainer {
|
||||
background:url(../img/icons/ok_big.png) 10px center no-repeat #E2F9E3;
|
||||
border:1px solid #9C9;
|
||||
padding:10px 10px 10px 68px!important;
|
||||
margin: 10px 0 10px 0 !important;
|
||||
text-align:left!important;
|
||||
overflow:hidden;
|
||||
box-shadow: 0px 0px 0px black;
|
||||
}
|
||||
|
||||
.successtitle {
|
||||
font-weight:700;
|
||||
color:#060!important;
|
||||
}
|
||||
|
||||
.success {
|
||||
font-weight:400!important;
|
||||
}
|
||||
|
||||
/*
|
||||
* neutral/info message display
|
||||
*/
|
||||
.neutralcontainer {
|
||||
background:url(../img/icons/info_big.png) 10px center no-repeat #d2eaf6;
|
||||
border:1px solid #b7d8ed;
|
||||
padding:10px 10px 10px 68px!important;
|
||||
margin: 10px 0 10px 0 !important;
|
||||
text-align:left!important;
|
||||
overflow:hidden;
|
||||
box-shadow: 0px 0px 0px black;
|
||||
}
|
||||
|
||||
.neutraltitle {
|
||||
font-weight:700;
|
||||
color:#3188c1!important;
|
||||
}
|
||||
|
||||
.neutral {
|
||||
font-weight:400!important;
|
||||
color:#3188c1!important;
|
||||
}
|
||||
|
||||
/* std hyperlink */
|
||||
a,a:active,a:visited {
|
||||
color:#176fa1;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration:underline;
|
||||
}
|
||||
|
||||
.infotext {
|
||||
font-size:11px;
|
||||
}
|
||||
|
||||
/*
|
||||
* main container
|
||||
*/
|
||||
.main {
|
||||
margin-left:240px;
|
||||
margin-right:10px;
|
||||
margin-top:105px;
|
||||
margin-bottom:0;
|
||||
background-color:#fff;
|
||||
padding: 30px 30px 30px 30px;
|
||||
min-height:400px;
|
||||
}
|
||||
|
||||
.noborder {
|
||||
width:100%;
|
||||
border-spacing:0;
|
||||
border-collapse:separate;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.noborder td {
|
||||
border:0;
|
||||
}
|
||||
|
||||
table {
|
||||
width:100%;
|
||||
border-spacing:0;
|
||||
border:1px solid #d1d5d8;
|
||||
border-collapse:separate;
|
||||
box-shadow:0px 0px 0px black !important;
|
||||
}
|
||||
|
||||
table thead th, table th {
|
||||
border-top: 1px solid #d1d5d8;
|
||||
border-bottom: 1px solid #d1d5d8;
|
||||
height: 25px !important;
|
||||
padding: 5px 0px 5px 8px;
|
||||
background-color: #e9edf0;
|
||||
font-weight: bold;
|
||||
}
|
||||
table thead:first-child th, table:first-child th {
|
||||
border-top: none !important;
|
||||
}
|
||||
|
||||
table th {
|
||||
border-top: 0;
|
||||
}
|
||||
th a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
th a img {
|
||||
}
|
||||
th a:nth-child(odd) img {
|
||||
position: relative;
|
||||
top: -5px;
|
||||
left: 4px;
|
||||
}
|
||||
th a:nth-child(even) img {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
left: -7px;
|
||||
}
|
||||
|
||||
table thead:first-child th {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.disabled td, .disabled td a {
|
||||
color: #cfcfcf;
|
||||
}
|
||||
|
||||
table tbody td {
|
||||
border-bottom:1px dotted #ccc;
|
||||
}
|
||||
table tbody tr:last-child td {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
.formtable {
|
||||
width: 100%;
|
||||
border-spacing:0;
|
||||
border:0;
|
||||
border-collapse:separate;
|
||||
margin:0 0 0;
|
||||
}
|
||||
|
||||
.formtable tbody td {
|
||||
border:0;
|
||||
border-bottom:1px dotted #ccc;
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
.formtable label {
|
||||
float:none;
|
||||
display:block;
|
||||
padding:0;
|
||||
margin:0;
|
||||
width:100%;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
td {
|
||||
padding-top:5px;
|
||||
padding-left:10px;
|
||||
padding-right: 10px;
|
||||
padding-bottom:5px;
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
table tfoot td {
|
||||
height:25px;
|
||||
border-top: 1px solid #d1d5d8;
|
||||
background-color: #f2f8fa;
|
||||
}
|
||||
|
||||
.tfootleft {
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.maintitle {
|
||||
padding-top:20px;
|
||||
}
|
||||
|
||||
/* input elements */
|
||||
input {
|
||||
background: #fff url(../img/text_align_left.png) no-repeat 5px 4px;
|
||||
padding:2px 4px 2px 24px;
|
||||
height:22px;
|
||||
border: 1px solid #d9d9d9;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
background:#fff url(../img/text_align_left.png) no-repeat 5px 4px;
|
||||
padding:4px 4px 2px 24px;
|
||||
border:1px solid #d9d9d9;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
input[type="password"] {
|
||||
background:#fff url(../img/password.png) no-repeat 5px 4px;
|
||||
}
|
||||
|
||||
input[type="button"],input[type="submit"],input[type="reset"] {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #79bbff), color-stop(1, #378de5) );
|
||||
background:-moz-linear-gradient( center top, #79bbff 5%, #378de5 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#79bbff', endColorstr='#378de5');
|
||||
background-color:#79bbff;
|
||||
-moz-border-radius:5px;
|
||||
-webkit-border-radius:5px;
|
||||
border-radius:5px;
|
||||
display:inline-block;
|
||||
color:#ffffff;
|
||||
padding:2px 24px 2px 24px;
|
||||
text-decoration:none;
|
||||
text-shadow:1px 1px 0px #528ecc;
|
||||
height: 26px;
|
||||
margin: 0 3px 0 3px;
|
||||
}
|
||||
input[type="button"]:hover,input[type="submit"]:hover,input[type="reset"]:hover {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #79bbff) );
|
||||
background:-moz-linear-gradient( center top, #378de5 5%, #79bbff 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#79bbff');
|
||||
background-color:#378de5;
|
||||
}
|
||||
|
||||
input[type="submit"],input[class="yesbutton"] {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #9dce2c), color-stop(1, #8cb82b) );
|
||||
background:-moz-linear-gradient( center top, #9dce2c 5%, #8cb82b 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#9dce2c', endColorstr='#8cb82b');
|
||||
background-color:#9dce2c;
|
||||
text-shadow:1px 1px 0px #aade7c;
|
||||
}
|
||||
input[type="submit"]:hover,input[class="yesbutton"]:hover {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8cb82b), color-stop(1, #9dce2c) );
|
||||
background:-moz-linear-gradient( center top, #8cb82b 5%, #9dce2c 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8cb82b', endColorstr='#9dce2c');
|
||||
background-color:#8cb82b;
|
||||
}
|
||||
|
||||
input[class="nobutton"],input[type="reset"] {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
|
||||
background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
|
||||
background-color:#fe1a00;
|
||||
text-shadow:1px 1px 0px #b23e35;
|
||||
}
|
||||
input[class="nobutton"]:hover,input[type="reset"]:hover {
|
||||
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
|
||||
background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
|
||||
background-color:#ce0100;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
background:#dae7ee;
|
||||
padding: 0;
|
||||
margin: 0 20px 0 0;
|
||||
}
|
||||
|
||||
input[type="radio"] { /*the span element that immediately follow the radio button */
|
||||
margin: 0 10px 0 10px;
|
||||
height:22px;
|
||||
}
|
||||
|
||||
select {
|
||||
background:#fff;
|
||||
padding:4px;
|
||||
border:1px solid #d9d9d9;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.maintable {
|
||||
width:90%;
|
||||
}
|
||||
|
||||
.update_progess {
|
||||
padding:2em;
|
||||
text-align:left;
|
||||
}
|
||||
|
||||
.preconfig {
|
||||
text-align:left;
|
||||
margin-top:20px;
|
||||
margin-bottom:5px;
|
||||
margin-right:15px;
|
||||
margin-left:15px;
|
||||
}
|
||||
|
||||
.preconfigitem {
|
||||
padding:.15em;
|
||||
border-bottom:1px solid #ccc;
|
||||
}
|
||||
|
||||
.preconfdesc {
|
||||
display:block;
|
||||
margin-bottom:.5em;
|
||||
font-size:120%;
|
||||
}
|
||||
Reference in New Issue
Block a user