308 lines
5.0 KiB
CSS
Executable File
308 lines
5.0 KiB
CSS
Executable File
/* ---------------- */
|
|
/* ! General Styles */
|
|
/* ---------------- */
|
|
* {
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
}
|
|
|
|
html, body {
|
|
|
|
font-weight:200;
|
|
color:#312;
|
|
}
|
|
|
|
body {
|
|
position:relative;
|
|
max-width:800px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
button {
|
|
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
color:#312;
|
|
padding:0.25em;
|
|
border:1px solid #888;
|
|
border-radius:5px;
|
|
box-shadow:1px 1px #aaa;
|
|
min-width:65px;
|
|
vertical-align:middle;
|
|
}
|
|
|
|
a, a:visited {
|
|
text-decoration:none;
|
|
color:#1147BB;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration:underline;
|
|
}
|
|
|
|
legend {
|
|
display:block;
|
|
}
|
|
|
|
legend:hover {
|
|
cursor:pointer;
|
|
}
|
|
|
|
h1,h2 {
|
|
display:inline-block;
|
|
margin-right:0.5em;
|
|
vertical-align:middle;
|
|
/*width:25%;*/
|
|
}
|
|
|
|
ul {
|
|
padding-left:2.5em;
|
|
margin:0;
|
|
}
|
|
|
|
ul > li {
|
|
padding:0.5em 0;
|
|
}
|
|
|
|
dt, dd {
|
|
padding:0.25em 0;
|
|
}
|
|
|
|
dd {
|
|
margin-left:0.5em;
|
|
}
|
|
|
|
|
|
|
|
/* Hide forms by default */
|
|
fieldset dl {
|
|
display:none;
|
|
}
|
|
|
|
#edit_form dl {
|
|
display:block;
|
|
}
|
|
|
|
/* form styles */
|
|
fieldset {
|
|
border-radius:5px;
|
|
}
|
|
|
|
form.add {
|
|
margin-bottom:0.75em;
|
|
}
|
|
|
|
form dt, form dd {
|
|
display:inline-block;
|
|
vertical-align:top;
|
|
padding:0.25em 0;
|
|
}
|
|
|
|
form dt {
|
|
width:40%;
|
|
text-align:right;
|
|
}
|
|
|
|
form dd {
|
|
width:58%;
|
|
text-align:left;
|
|
margin-left:0;
|
|
padding-left:.25em;
|
|
}
|
|
|
|
/* ! Edit buttons */
|
|
.modify {
|
|
position:absolute;
|
|
display:none;
|
|
margin-left:1em;
|
|
vertical-align:middle;
|
|
}
|
|
|
|
li li, li dt {
|
|
position:relative;
|
|
z-index:3;
|
|
}
|
|
|
|
form dd input {
|
|
width:90%;
|
|
}
|
|
|
|
li:hover > .modify, dt:hover > .modify, dd:hover > .modify {
|
|
display:inline-block;
|
|
vertical-align:top;
|
|
}
|
|
|
|
|
|
button.save {
|
|
background:#7c7;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#77cc77', EndColorStr='#559955')"; /* IE9 */
|
|
background:-o-linear-gradient(#7c7, #595);
|
|
background:-ms-linear-gradient(#7c7, #595);
|
|
background:-moz-linear-gradient(#7c7, #595);
|
|
background:-webkit-linear-gradient(#7c7, #595);
|
|
background:linear-gradient(#7c7, #595);
|
|
color:#fff;
|
|
}
|
|
|
|
button.save:hover {
|
|
background:#595;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#559955', EndColorStr='#77cc77')"; /* IE9 */
|
|
background:-o-linear-gradient(#595, #7c7);
|
|
background:-moz-linear-gradient(#595, #7c7);
|
|
background:-webkit-linear-gradient(#595, #7c7);
|
|
background:linear-gradient(#595, #7c7);
|
|
}
|
|
|
|
button.edit {
|
|
background:#fff;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#dddddd')"; /* IE9 */
|
|
background:-o-linear-gradient(#fff, #ddd);
|
|
background:-ms-linear-gradient(#fff, #ddd);
|
|
background:-moz-linear-gradient(#fff, #ddd);
|
|
background:-webkit-linear-gradient(#fff, #ddd);
|
|
background:linear-gradient(#fff, #ddd);
|
|
}
|
|
|
|
button.edit:hover {
|
|
background:#ddd;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#dddddd', EndColorStr='#ffffff')"; /* IE9 */
|
|
background:-o-linear-gradient(#ddd, #fff);
|
|
background:-ms-linear-gradient(#ddd, #fff);
|
|
background:-moz-linear-gradient(#ddd, #fff);
|
|
background:-webkit-linear-gradient(#ddd, #fff);
|
|
background:linear-gradient(#ddd, #fff);
|
|
}
|
|
|
|
button.delete {
|
|
background:#f55;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#ff5555', EndColorStr='#995555')"; /* IE9 */
|
|
background:-o-linear-gradient(#f55, #955);
|
|
background:-ms-linear-gradient(#f55, #955);
|
|
background:-moz-linear-gradient(#f55, #955);
|
|
background:-webkit-linear-gradient(#f55, #955);
|
|
background:linear-gradient(#f55, #955);
|
|
color:#fff;
|
|
}
|
|
|
|
button.delete:hover {
|
|
background:#955;
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#995555', EndColorStr='#ff5555')"; /* IE9 */
|
|
background:-o-linear-gradient(#955, #f55);
|
|
background:-ms-linear-gradient(#955, #f55);
|
|
background:-moz-linear-gradient(#955, #f55);
|
|
background:-webkit-linear-gradient(#955, #f55);
|
|
background:linear-gradient(#955, #f55);
|
|
}
|
|
|
|
/* ! Outline styles */
|
|
.list {
|
|
padding:0;
|
|
margin:0;
|
|
}
|
|
|
|
.list dl {
|
|
margin-left:0.5em;
|
|
}
|
|
|
|
#outline {
|
|
position:absolute;
|
|
margin:21px 0;
|
|
right:0;
|
|
}
|
|
|
|
dl.outline dd {
|
|
border-bottom:1px dotted #555;
|
|
margin-bottom:0.5em;
|
|
}
|
|
|
|
dl.outline dd:last-child {
|
|
border:0;
|
|
}
|
|
|
|
dl.outline dt {
|
|
display:list-item;
|
|
list-style:square inside;
|
|
}
|
|
|
|
.list > li {
|
|
list-style:none;
|
|
|
|
}
|
|
|
|
li h4 {
|
|
display:inline;
|
|
}
|
|
|
|
/* ! Data listing styles */
|
|
dl.multiline, dl.pair {
|
|
border-bottom:1px dotted #312;
|
|
}
|
|
|
|
li dl.multiline:last-of-type {
|
|
border-bottom:0;
|
|
}
|
|
|
|
dl.multiline dt {
|
|
font-weight:bold;
|
|
line-height:1.5;
|
|
font-size:1em;
|
|
margin:0;
|
|
}
|
|
|
|
dl.multiline dd {
|
|
margin:1em;
|
|
margin-right:0;
|
|
}
|
|
|
|
dl.pair dt, dl.pair dd {
|
|
display:inline-block;
|
|
vertical-align:middle;
|
|
padding:0.25em 0;
|
|
}
|
|
|
|
dl.pair dt {
|
|
width:35%;
|
|
}
|
|
|
|
dl.pair dd {
|
|
width:64%;
|
|
margin-left:0;
|
|
padding-left:0;
|
|
}
|
|
|
|
/* ! Form overlay styles */
|
|
#overlay_bg {
|
|
background:#777;
|
|
background:rgba(85,105,255,0.85);
|
|
position:fixed;
|
|
display:none;
|
|
width:900%;
|
|
height:900%;
|
|
z-index:5;
|
|
left:0;
|
|
top:0;
|
|
}
|
|
|
|
#overlay {
|
|
position:absolute;
|
|
background:#ddd;
|
|
width:650px;
|
|
padding:0.5em;
|
|
border-radius:5px;
|
|
display:none;
|
|
z-index:25;
|
|
}
|
|
|
|
#edit_form {
|
|
position:relative;
|
|
overflow:hidden;
|
|
}
|
|
|
|
#edit_form dt {
|
|
width:20%;
|
|
}
|
|
|
|
#edit_form dd {
|
|
width:78%;
|
|
}
|
|
|
|
|
|
|