686 lines
11 KiB
CSS
686 lines
11 KiB
CSS
/* theme derived and inspired by TerraFirma
|
||
* <http://www.oswd.org/design/information/id/3557/>
|
||
*/
|
||
|
||
@font-face {
|
||
font-family: "FontAwesome";
|
||
src: url('fontawesome-webfont.eot');
|
||
src: url('fontawesome-webfont.eot?#iefix') format('eot'), url('fontawesome-webfont.woff') format('woff'), url('fontawesome-webfont.ttf') format('truetype'), url('fontawesome-webfont.svg#FontAwesome') format('svg');
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
}
|
||
|
||
html, body {
|
||
margin: 0;
|
||
font-family: sans-serif;
|
||
height: 101%;
|
||
}
|
||
|
||
html {
|
||
background: #F9F9F7 url(../images/a1.gif) repeat-x;
|
||
color: #8c8c73;
|
||
}
|
||
|
||
a, #tab-personnes a, #tab-ressources a {
|
||
color: #FF7800;
|
||
text-decoration: underline;
|
||
}
|
||
|
||
a:hover, #tab-personnes a:hover, #tab-ressources a:hover {
|
||
text-decoration: none;
|
||
}
|
||
|
||
div#user-links {
|
||
display: inline;
|
||
padding: 5px;
|
||
background: rgba(100, 100, 100, 0.8);
|
||
border-top-right-radius: 6px;
|
||
border-bottom-left-radius: 6px;
|
||
}
|
||
|
||
div#user-links a {
|
||
color: white;
|
||
text-decoration: none;
|
||
}
|
||
|
||
div#user-links a:hover {
|
||
text-shadow: 1px 1px 1px black;
|
||
}
|
||
|
||
div#wrap-large,
|
||
div#wrap {
|
||
background: white;
|
||
width: 640px;
|
||
margin: 3em auto;
|
||
margin-bottom: 0;
|
||
padding: 15px;
|
||
-moz-border-radius: 6px;
|
||
-webkit-border-radius:6px;
|
||
-moz-box-shadow: 0 0 4px rgba(0,0,0,0.75);
|
||
-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.75);
|
||
position: relative;
|
||
}
|
||
|
||
div#wrap-large {
|
||
width: 95%;
|
||
}
|
||
|
||
#header
|
||
{
|
||
position: absolute;
|
||
background: #FF7800 url(../images/a8.gif) repeat-x;
|
||
-moz-border-radius: 6px 0 0 6px;
|
||
-webkit-border-radius: 6px 0 0 6px;
|
||
width: 212px;
|
||
height: 92px;
|
||
color: #fff;
|
||
padding-left: 10px;
|
||
z-index: 14;
|
||
}
|
||
|
||
#header h1
|
||
{
|
||
font-size: 23px;
|
||
letter-spacing: -1px;
|
||
padding-top: 30px;
|
||
margin: 0;
|
||
}
|
||
|
||
#header span
|
||
{
|
||
margin: 0;
|
||
font-size: 10px;
|
||
font-weight: normal;
|
||
color: #FCE2CA;
|
||
}
|
||
|
||
#header h1 a,
|
||
#header span a {
|
||
color: white;
|
||
text-decoration: none;
|
||
}
|
||
|
||
#splash
|
||
{
|
||
position: absolute;
|
||
right: 15px;
|
||
background: #56D72B url(../images/banner-green.jpg) no-repeat top right;
|
||
width: 90%;
|
||
height: 87px;
|
||
-moz-border-radius: 0 6px 6px 0;
|
||
-webkit-border-radius: 0 6px 6px 0;
|
||
z-index: 10;
|
||
|
||
color: white;
|
||
font-weight: bold;
|
||
text-align: right;
|
||
padding-top: 5px;
|
||
}
|
||
|
||
div#content {
|
||
margin: 1em 1ex;
|
||
padding: 7px;
|
||
position: relative;
|
||
}
|
||
|
||
div#content h2 {
|
||
margin-top: 0;
|
||
font-weight: normal;
|
||
color: #656551;
|
||
font-size: 18px;
|
||
letter-spacing: -1px;
|
||
line-height: 25px;
|
||
margin-bottom: 20px;
|
||
padding: 0 0 10px 15px;
|
||
position: relative;
|
||
top: 4px;
|
||
background: url(../images/a22.gif) bottom repeat-x;
|
||
}
|
||
|
||
#footer
|
||
{
|
||
font-size: 70%;
|
||
position: relative;
|
||
clear: both;
|
||
height: 66px;
|
||
text-align: center;
|
||
line-height: 66px;
|
||
background-image: url(../images/a50.gif);
|
||
color: #A8A88D;
|
||
}
|
||
|
||
#footer a
|
||
{
|
||
color: #8C8C73;
|
||
}
|
||
|
||
|
||
form#login-form p {
|
||
float: left;
|
||
width: 40%;
|
||
}
|
||
|
||
form input.submit {
|
||
float: right;
|
||
width: 18%;
|
||
margin-top: 30px;
|
||
}
|
||
|
||
div.login-actions {
|
||
clear: both;
|
||
padding-top: 2em;
|
||
}
|
||
|
||
div.login-actions p {
|
||
margin: 0;
|
||
}
|
||
|
||
form p {
|
||
margin: 0 0 1em 0;
|
||
}
|
||
|
||
form p label {
|
||
display: block;
|
||
}
|
||
|
||
form p input,
|
||
form p textarea {
|
||
margin-left: 10px;
|
||
}
|
||
|
||
ul.errorlist {
|
||
margin: 0;
|
||
padding: 0;
|
||
color: #e80404;
|
||
list-style: none;
|
||
}
|
||
|
||
input, textarea {
|
||
padding: 5px;
|
||
border: 1px solid #cccccc;
|
||
color:#666666;
|
||
background: white;
|
||
color: black;
|
||
-webkit-border-radius: 4px;
|
||
}
|
||
|
||
textarea:focus, input[type="text"]:focus, input[type="password"]:focus {
|
||
border: 1px solid #4690d6;
|
||
color:#333333;
|
||
}
|
||
|
||
input[type=submit] {
|
||
color: #ffffff;
|
||
background:#4690d6;
|
||
border: 1px solid #2a567f;
|
||
font-weight: bold;
|
||
padding: 2px 8px 2px 8px;
|
||
margin: 0;
|
||
cursor: pointer;
|
||
}
|
||
|
||
input[type=submit]:hover {
|
||
border-color: #0e1d2b;
|
||
}
|
||
|
||
form#login-form ul.errorlist {
|
||
margin-bottom: 1em;
|
||
width: 80%;
|
||
font-weight: normal;
|
||
}
|
||
|
||
li.indented {
|
||
margin-left: 50px;
|
||
}
|
||
|
||
ul.NoBullet {
|
||
list-style-type: none;
|
||
}
|
||
|
||
div#content h4 {
|
||
margin-bottom: 5px;
|
||
margin-top: 30px;
|
||
}
|
||
|
||
div.errors {
|
||
margin: 0;
|
||
padding: 0;
|
||
color: #e80404;
|
||
list-style: none;
|
||
}
|
||
|
||
div#breadcrumb {
|
||
font-size: 80%;
|
||
margin-bottom: 1em;
|
||
}
|
||
|
||
div#sidebar,
|
||
div#users {
|
||
width: 15%;
|
||
float: left;
|
||
text-align: justify;
|
||
padding-right: 10px;
|
||
}
|
||
|
||
div#sidebar {
|
||
text-align: left;
|
||
}
|
||
|
||
div#sidebar input[type=text] {
|
||
width: 95%;
|
||
}
|
||
|
||
div#sidebar button {
|
||
width: 100%;
|
||
}
|
||
|
||
form input.submit {
|
||
position: relative;
|
||
top: -22px;
|
||
}
|
||
form#login-form input.submit {
|
||
position: relative;
|
||
top: -5px;
|
||
}
|
||
|
||
div.content {
|
||
float: left;
|
||
width: 82%;
|
||
margin-left: 8px;
|
||
margin-top: -10px;
|
||
}
|
||
|
||
div#users input {
|
||
width: 10em;
|
||
}
|
||
|
||
div#users dt {
|
||
font-weight: bold;
|
||
}
|
||
|
||
div#users dd {
|
||
margin: 0 0 1em 1em;
|
||
}
|
||
|
||
div#users ul {
|
||
margin-left: 0;
|
||
padding-left: 0;
|
||
font-size: 11px;
|
||
list-style: none;
|
||
}
|
||
|
||
div#users li {
|
||
cursor: pointer;
|
||
}
|
||
|
||
div.content ul {
|
||
text-align: justify;
|
||
}
|
||
|
||
h2 img {
|
||
position: absolute;
|
||
right: 0px;
|
||
top: 5px;
|
||
}
|
||
|
||
div#appbar button,
|
||
div#appbar a {
|
||
position: relative;
|
||
top: -45px;
|
||
float: right;
|
||
padding-left: 15px;
|
||
padding-right: 15px;
|
||
}
|
||
|
||
div#appbar button {
|
||
left: -20px;
|
||
top: -55px;
|
||
}
|
||
|
||
div#extra-top-links {
|
||
position: absolute;
|
||
right: 20px;
|
||
}
|
||
|
||
li.active {
|
||
font-weight: bold;
|
||
}
|
||
|
||
table.main {
|
||
width: 100%;
|
||
}
|
||
|
||
table.main th {
|
||
font-weight: normal;
|
||
border-bottom: 1px solid #888;
|
||
}
|
||
|
||
table.main td {
|
||
text-align: center;
|
||
}
|
||
|
||
table.main tr td.checkbox {
|
||
width: 1em;
|
||
}
|
||
|
||
table.main tr:nth-child(odd) td {
|
||
background: #eee;
|
||
}
|
||
|
||
table.main tr:hover td {
|
||
background: #ccf;
|
||
cursor: pointer;
|
||
}
|
||
|
||
table.main tr.active td {
|
||
background: #bbf;
|
||
}
|
||
|
||
div.frame {
|
||
border: 1px solid #aaa;
|
||
margin-bottom: 1em;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
div.frame h3 {
|
||
margin: 0;
|
||
margin-bottom: 1ex;
|
||
padding: 3px 1ex;
|
||
color: #656551;
|
||
font-weight: normal;
|
||
background: #ccc url(smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x;
|
||
}
|
||
|
||
div.frame p {
|
||
margin: 0 1ex;
|
||
}
|
||
|
||
div#overlay {
|
||
position: absolute;
|
||
bottom: -40px;
|
||
left: -10px;
|
||
background: rgba(0, 0, 0, 0.8);
|
||
color: white;
|
||
padding: 0px 10px;
|
||
width: 100%;
|
||
z-index: 10;
|
||
}
|
||
|
||
div#overlay a {
|
||
color: white;
|
||
}
|
||
|
||
li label {
|
||
}
|
||
|
||
button.flat,
|
||
button.blind {
|
||
border: 1px solid #555;
|
||
border-radius: 5px;
|
||
background: white;
|
||
font-size: 80%;
|
||
}
|
||
|
||
ul.apps {
|
||
margin-top: 2em;
|
||
margin-bottom: 2em;
|
||
}
|
||
|
||
ul.apps li {
|
||
display: block;
|
||
float: left;
|
||
margin-right: 1em;
|
||
}
|
||
|
||
ul.apps li a {
|
||
background-color: transparent;
|
||
background-repeat: no-repeat;
|
||
background-position: 50% 50%;
|
||
}
|
||
|
||
ul.apps li a {
|
||
display: block;
|
||
width: 120px;
|
||
height: 40px;
|
||
padding-top: 80px;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
border: 1px dotted #666;
|
||
text-decoration: none;
|
||
transition: all .2s ease-in-out;
|
||
-webkit-transition: all .2s ease-in-out;
|
||
-moz-transition: all .2s ease-in-out;
|
||
}
|
||
|
||
ul.apps li a:hover {
|
||
border: 1px solid #333;
|
||
}
|
||
|
||
form#settings label span {
|
||
width: 6em;
|
||
display: inline-block;
|
||
}
|
||
|
||
abbr {
|
||
cursor: help;
|
||
border-bottom: 1px dotted #aaa;
|
||
}
|
||
|
||
pre.code {
|
||
border: 1px solid #babdb6;
|
||
padding: 0.5em 1em;
|
||
background: #fefefe;
|
||
}
|
||
|
||
h3.collapsed,
|
||
h3.expanded {
|
||
cursor: pointer;
|
||
}
|
||
|
||
h3.collapsed:before {
|
||
content: "▶ ";
|
||
font-size: 80%;
|
||
}
|
||
|
||
h3.expanded:before {
|
||
content: "▼ ";
|
||
font-size: 80%;
|
||
}
|
||
|
||
#more-user-links {
|
||
color: black;
|
||
margin-top: 100px;
|
||
}
|
||
|
||
#more-user-links a {
|
||
background: #ccc;
|
||
text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
|
||
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
|
||
border: 1px solid #bbb;
|
||
box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
|
||
padding: 4px 12px;
|
||
border-radius: 4px;
|
||
color: black;
|
||
text-decoration: none;
|
||
}
|
||
|
||
#more-user-links a:hover {
|
||
background: #aaa;
|
||
}
|
||
|
||
#more-user-links span.middle {
|
||
padding-left: 15px;
|
||
}
|
||
|
||
|
||
#more-user-links span.right {
|
||
position: absolute;
|
||
right: 20px;
|
||
top: 80px;
|
||
z-index: 100;
|
||
}
|
||
|
||
#more-user-links span.right span {
|
||
color: #ddd;
|
||
}
|
||
|
||
div#content.login {
|
||
margin-top: 100px;
|
||
}
|
||
|
||
p.paginator a,
|
||
p.paginator span {
|
||
padding: 2px 5px;
|
||
border: 1px solid #aaa;
|
||
}
|
||
|
||
|
||
[class^="icon-"]:after, [class*=" icon-"]:after,
|
||
[class^="icon-"]:before, [class*=" icon-"]:before {
|
||
font-family: FontAwesome;
|
||
font-weight: normal;
|
||
font-style: normal;
|
||
display: inline-block;
|
||
text-decoration: none;
|
||
}
|
||
a [class^="icon-"], a [class*=" icon-"] {
|
||
display: inline-block;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.icon-home-space:before { content: "\f015 "; }
|
||
.icon-edit:before { content: "\f044"; }
|
||
.icon-remove-sign:before { content: "\f057"; }
|
||
.icon-remove:before { content: "\f00d"; }
|
||
.icon-minus:before { content: "\f068"; }
|
||
.icon-envelope:before { content: "\f003"; }
|
||
.icon-comment:before { content: "\f075"; }
|
||
.icon-user-space:before { content: "\f007 "; }
|
||
.icon-circle-arrow-left:before { content: "\f0a8"; }
|
||
.icon-circle-arrow-right:before { content: "\f0a9"; }
|
||
.icon-music:before { content: "\f001"; }
|
||
.icon-th:before { content: "\f00a"; }
|
||
.icon-eye-open:before { content: "\f06e "; }
|
||
.icon-bar-chart:before { content: "\f080 "; }
|
||
.icon-search:before { content: "\f002 "; }
|
||
.icon-signout:before { content: "\f08b "; }
|
||
.icon-pushpin:before { content: "\f08d "; }
|
||
.icon-circle-arrow-down:after { content: " \f0ab"; }
|
||
|
||
span.key {
|
||
background: #eee;
|
||
padding: 2px 5px;
|
||
border: 1px outset #ccc;
|
||
}
|
||
|
||
div.ui-dialog label span {
|
||
display: block;
|
||
color: #555;
|
||
}
|
||
|
||
div.ui-dialog label input,
|
||
div.ui-dialog label div.select2-container {
|
||
margin-left: 1ex;
|
||
}
|
||
|
||
div.select2-container {
|
||
width: 100%;
|
||
}
|
||
|
||
.popover-container {
|
||
position: absolute;
|
||
display: none;
|
||
}
|
||
|
||
.popover {
|
||
position: absolute;
|
||
z-index: 1212;
|
||
width: 100px;
|
||
padding: 0;
|
||
list-style: none;
|
||
bottom: 100%;
|
||
left: 0;
|
||
right: 0;
|
||
border: 1px solid;
|
||
border-color: #777 #6c6c6c #666;
|
||
border-radius: 5px;
|
||
-webkit-transition: 0.2s ease-out;
|
||
-moz-transition: 0.2s ease-out;
|
||
-o-transition: 0.2s ease-out;
|
||
transition: 0.2s ease-out;
|
||
-webkit-transition-property: opacity, padding, visibility;
|
||
-moz-transition-property: opacity, padding, visibility;
|
||
-o-transition-property: opacity, padding, visibility;
|
||
transition-property: opacity, padding, visibility;
|
||
background-image: linear-gradient(to bottom, #eeeeee, #ddd);
|
||
-webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.1);
|
||
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.9), 0 1px 2px rgba(0, 0, 0, 0.1);
|
||
}
|
||
.popover:before, .popover:after, .user li:first-child:after {
|
||
content: '';
|
||
display: block;
|
||
position: absolute;
|
||
left: 15px;
|
||
width: 0;
|
||
height: 0;
|
||
border: 7px outset transparent;
|
||
}
|
||
.popover:before {
|
||
top: -14px;
|
||
border-bottom: 7px solid #555;
|
||
}
|
||
.popover li:first-child:after {
|
||
top: -13px;
|
||
border-bottom: 7px solid white;
|
||
}
|
||
.popover:after {
|
||
top: -12px;
|
||
border-bottom: 7px solid #eeeeee;
|
||
}
|
||
.popover li {
|
||
padding: 4px 12px;
|
||
color: #838ca2;
|
||
}
|
||
.popover li.sep {
|
||
margin-top: 4px;
|
||
padding-top: 4px;
|
||
border-top: 1px solid #b4bbce;
|
||
-webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.6);
|
||
box-shadow: inset 0 1px rgba(255, 255, 255, 0.6);
|
||
}
|
||
.popover li a {
|
||
display: block;
|
||
position: relative;
|
||
margin: 0 -13px;
|
||
padding: 2px 20px 2px 12px;
|
||
color: #313a4f;
|
||
text-decoration: none;
|
||
cursor: pointer;
|
||
border: 1px solid #666;
|
||
border-width: 0 1px;
|
||
}
|
||
.popover li a:hover {
|
||
background: #ccf;
|
||
}
|
||
|
||
.popover li a.disabled:hover {
|
||
background: inherit;
|
||
}
|
||
|
||
.popover li a.disabled {
|
||
color: #ccc;
|
||
}
|
||
|
||
ul.messages {
|
||
position: absolute;
|
||
background: rgba(10, 10, 10, 0.8);
|
||
display: block;
|
||
top: 5px;
|
||
right: 0px;
|
||
color: white;
|
||
border-radius: 1em;
|
||
list-style: none;
|
||
z-index: 10;
|
||
box-shadow: 0px 0px 5px black;
|
||
}
|