DaPortal
/* $Id$ */
/* Copyright (c) 2012-2015 Pierre Pronchery <khorben@defora.org> */
/* This file is part of DeforaOS Web DaPortal */
/* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License as published by
* the Free Software Foundation, version 3 of the License.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>. */
/* default includes */
@import url("../css/DaPortal.css");
@import url("../css/manual.css");
/* global defaults */
* {
margin: 0;
padding: 0;
text-align: justify;
}
/* fonts */
a, button, input {
font-size: 100%;
}
a, body, button, input {
font-family: "Verdana", "DejaVu Sans", "Bitstream Vera Sans", sans-serif;
}
body {
font-size: 0.85em;
}
html {
font-size: 100%;
}
/* generic elements */
a {
color: #7f7f7f;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
a.button {
line-height: 150%;
white-space: nowrap;
}
a.button:hover {
text-decoration: none;
}
a.button, button, input[type="button"], input[type="reset"],
input[type="submit"] {
background-color: #a0a0a0;
border: 1px solid #000000;
color: #000000;
padding: 0.4ex;
}
h1, h2, h3, h4, h5, h6, .title {
padding: 0.5ex;
text-align: left;
}
h3 {
border-bottom: 1px solid #303030;
margin-bottom: 0.5ex;
}
h1 a:hover {
text-decoration: none;
}
ol, ul {
margin-left: 1ex;
padding-left: 1ex;
}
ol li, ul li {
margin-left: 0.2ex;
padding-left: 0.2ex;
}
/* outer page */
html {
background-color: #000000;
color: #ffffff;
}
/* top */
#top {
background-color: #a0a0a0;
border: 1px solid #303030;
border-top: 0;
color: #000000;
margin-left: auto;
margin-right: auto;
max-width: 80ex;
padding: 4px;
text-align: center;
}
#top a {
color: #000000;
padding: 2px;
text-decoration: none;
}
#top a:hover {
background-color: #303030;
color: #ffffff;
}
/* menu */
#menu {
margin-bottom: 1ex;
padding: 0.4ex;
}
#menu a {
background-color: #000000;
color: #ffffff;
display: block;
text-align: left;
}
#menu ul {
margin-left: 0;
padding-left: 0;
}
#menu ul.menubar li {
list-style-type: none;
margin: 0;
padding: 0;
}
#menu ul.menubar li a {
border-bottom: 1px solid #303030;
font-weight: bold;
padding: 0.2ex;
}
#menu ul.menubar li a:hover {
background-color: #303030;
text-decoration: none;
}
#menu ul.menubar li li a {
border-width: 0;
display: none;
font-size: 80%;
padding-left: 2ex;
}
#menu ul.menubar li li a.important {
display: block;
}
#menu form .entry input {
max-width: 11ex;
}
#menu form .entry .label,
#menu form .entry input[type="password"],
#menu form .entry input[type="text"] {
display: table-row;
}
/* main */
body {
margin-left: auto;
margin-right: auto;
}
/* title */
h1#title {
padding: 16px;
text-align: right;
}
/* content */
#content {
margin-top: 16px;
}
#content, #content table {
background-color: #ffffff;
color: #000000;
}
#content > .pack {
padding: 16px;
}
#content > .pack > *:first-child {
-moz-border-radius-topleft: 16px;
-moz-border-radius-topright: 16px;
-webkit-border-top-left-radius: 16px;
-webkit-border-top-right-radius:16px;
border-top-left-radius: 16px;
border-top-right-radius: 16px;
margin-bottom: 4px;
margin-left: -16px;
margin-right: -16px;
margin-top: -32px;
padding-top: 16px;
}
#content > .pack > h1:first-child {
background-color: #00007f;
color: #ffffff;
}
#content > .pack > h1:first-child.stock48 {
background-position: 8px 4px;
min-height: 44px;
padding: 4px;
padding-top: 8px;
padding-left: 60px;
}
#content > .pack > h1:first-child.browser {
background-color: #7f7f7f;
}
#content > .pack > h1:first-child.download {
background-color: #ff7f00;
}
#content > .pack > h1:first-child.error {
background-color: #ff0000;
}
#content > .pack > h1:first-child.project {
background-color: #007f00;
}
#content > .pack > h1:first-child.logout,
#content > .pack > h1:first-child.user {
background-color: #ff7f00;
}
#content > .pack > h1:first-child.wiki {
background-color: #7f7fff;
}
/* dialogs */
.dialog {
background-color: #000000;
color: #ffffff;
margin-bottom: 4px;
margin-left: -16px;
margin-right: -16px;
margin-top: -4px;
padding: 16px;
}
/* statusbar */
.statusbar, footer {
background-color: #ffffff;
color: #000000;
-moz-border-radius-bottomleft: 16px;
-moz-border-radius-bottomright: 16px;
-webkit-border-bottom-left-radius:16px;
-webkit-border-bottom-right-radius:16px;
border-bottom-left-radius: 16px;
border-bottom-right-radius: 16px;
margin-bottom: 4px;
padding: 16px;
text-align: right;
}
/* toolbars */
.toolbar {
background-color: #a0a0a0;
margin-bottom: 0.5ex;
margin-left: -16px;
margin-right: -16px;
margin-top: -4px;
min-height: 2em;
padding: 0.2ex;
padding-top: 1ex;
}
.toolbar a.button, .toolbar button, .toolbar input[type="reset"],
.toolbar input[type="submit"] {
border-color: #a0a0a0;
border-width: 1px;
}
.toolbar a.button:hover, .toolbar input[type="submit"]:hover {
background-color: #b0b0b0;
border-color: #c0c0c0;
}
/* treeviews */
form.treeview .header .detail {
text-align: left;
}
form.treeview.alternate > .table > .row:nth-child(odd) {
background-color: #f0f0f0;
}
/* small screens */
@media screen and (max-width: 80ex) {
#menu > .pack > * {
display: none;
}
#menu ul.menubar, #menu ul.menubar li {
display: block;
}
#menu ul.menubar li li {
display: none;
}
}
/* larger screens */
@media screen and (min-width: 80ex) {
html {
background-attachment: fixed;
background-image: url('DeforaOS-background.png');
background-position: 75% 90%;
background-repeat: no-repeat;
}
body {
max-width: 96ex;
padding-right: 16ex;
}
#content, .statusbar, footer {
opacity: 0.8;
}
#menu {
float: right;
margin-right: -16ex;
margin-top: 48px;
width: 14ex;
}
#menu, #menu a {
background-color: #a0a0a0;
color: #000000;
opacity: 0.8;
}
#menu a:hover {
color: #ffffff;
}
h1#title {
text-align: left;
}
}