poulpe/shared/static/css/global.css
2018-08-26 21:18:51 +02:00

362 lines
9.2 KiB
CSS

@charset "UTF-8";
/*NE PAS MODIFIER LE FICHIER .CSS, MAIS PLUTÔT LE
FICHIER .SCSS */
/* COLORS */
/* FONTS */
.message-info {
color: #31708f;
background-color: #d9edf7;
border-color: #bce8f1; }
.message-success {
color: #3c763d;
background-color: #dff0d8;
border-color: #d6e9c6; }
.message-warning {
color: #8a6d3b;
background-color: #fcf8e3;
border-color: #faebcc; }
.message-error {
color: #a94442;
background-color: #f2dede;
border-color: #ebccd1; }
.alert {
margin-bottom: 0; }
/* BANNER */
.strong-banner {
padding-top: 20px;
padding-bottom: 10px;
background-color: #FF6969;
color: #FFB363; }
.navbar-inverse {
background-color: #FF6969;
background-color: transparent;
border-style: none; }
.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
color: #fff;
background-color: #FF9191; }
.navbar-collapse {
border-top: 0px solid transparent;
padding: 0px;
/* only < 768px*/
background-color: #FF9191;
padding-left: 25px;
margin-left: -15px;
margin-right: -15px; }
@media (min-width: 768px) {
.navbar-collapse {
background-color: transparent;
padding-left: 0px;
margin-left: 0px;
margin-right: 0px; } }
.navbar-nav {
width: 100%; }
@media (min-width: 768px) {
.navbar-nav {
float: right;
width: auto; } }
.navbar-inverse {
/* BRAND */
/* ICONE */
/* LINKS */ }
.navbar-inverse .navbar-brand, .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
color: white;
font-family: "Lily Script One", cursive;
font-size: xx-large;
border-bottom: 5px solid #FFC282; }
.navbar-inverse .navbar-toggle, .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
background-color: #FFB363;
border-color: #FFB363; }
.navbar-inverse .navbar-toggle .icon-bar {
background-color: #FFF5EB; }
.navbar-inverse .navbar-nav > li > a, .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
font-family: "Work Sans", cursive;
font-size: large;
color: #FFB363;
background: transparent; }
@media (min-width: 768px) {
.navbar-inverse .navbar-nav > li > a, .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
color: #FFF5EB; } }
.btn-primary {
/**
* This mixins allows defining color-related properties of buttons.
*
* It sets the following properties:
* color: $color, except for disabled-like buttons.
* border-color: $border.
* background-color: Depending on button state:
* - Default, disabled:
* $background-base
* - Hovered, focused, actived, responsible of an opened dropdown:
* (one is sufficent)
* $background-special
*
* ## Bootstrap compatibility
*
* This mixin can be used to replace colors behaviors of Bootstrap buttons.
* Indeed, this mixin aims to replace each definition done by the
* 'button-variant' Bootstrap mixin.
*
*/
color: white;
background-color: #FF6969;
border-color: #FF6969;
/**
* This mixin applies content if the button is in at least one of the
* following states:
*
* - hovered,
* - focused,
* - actived,
* - is responsible of an opened dropdown.
*
* Where possible, state is checked from class attribute and
* :pseudo-classes.
*
* ## Bootstrap compatibility
*
* If content defines 'color', 'background-color' and 'border', it is safe
* to use this mixin with Bootstrap buttons as it will overrides all
* Bootstrap color defaults of the previous cases.
* To be precise, this covers all special important-like cases of the
* Bootstrap mixin 'button-variant' (except the 'disabled' case).
*
*/ }
.btn-primary:focus, .btn-primary.focus, .btn-primary:hover {
color: white;
background-color: #FF9191;
border-color: #FF6969; }
.btn-primary:active, .btn-primary.active {
color: white;
background-color: #FF9191;
border-color: #FF6969; }
.btn-primary:active:focus, .btn-primary:active.focus, .btn-primary:active:hover, .btn-primary.active:focus, .btn-primary.active.focus, .btn-primary.active:hover {
color: white;
background-color: #FF9191;
border-color: #FF6969; }
.open > .btn-primary.dropdown-toggle {
color: white;
background-color: #FF9191;
border-color: #FF6969; }
.open > .btn-primary.dropdown-toggle:focus, .open > .btn-primary.dropdown-toggle.focus, .open > .btn-primary.dropdown-toggle:hover {
color: white;
background-color: #FF9191;
border-color: #FF6969; }
.btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary.disabled:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:hover {
background-color: #FF6969;
border-color: #FF6969; }
.btn-primary .badge {
color: #FF6969;
background-color: white; }
form#filter_form .form-group {
padding-right: 20px; }
form#filter_form ul.form-control {
background-color: transparent;
border: none;
box-shadow: none; }
.tree {
font-size: large; }
.tree ul, .tree li {
position: relative; }
.tree ul {
list-style: none;
padding-left: 32px; }
.tree li::before,
.tree li::after {
content: "";
position: absolute;
left: -12px; }
.tree li::before {
border-top: 3px solid #FFC282;
top: 9px;
width: 8px;
height: 0; }
.tree li::after {
border-left: 3px solid #FFC282;
height: 100%;
width: 0px;
top: 2px; }
.tree ul > li:last-child::after {
height: 8px; }
/* MISE EN FORME GÉNÉRALE */
html {
height: 100%;
background-color: #DCEAED; }
body {
font-family: "Saira Semi Condensed", sans-serif;
font-size: medium; }
#principal {
background-color: #DCEAED; }
/*MAIN*/
main {
background-color: white;
margin-top: 0px;
padding: 15px; }
main a {
color: #FF6969; }
main a:hover, main a:active, main a:focus {
color: #FF6969; }
main h1 {
border-bottom: 7px solid #FFB363;
padding-bottom: 5px;
font-family: "Capriola", sans-serif;
font-weight: 600; }
main h2 {
border-bottom: 2px solid #FF6969;
color: #FF6969;
padding-bottom: 5px;
font-family: "Capriola", sans-serif;
font-weight: 600; }
/*ASIDE*/
aside {
background-color: #FFC282;
color: white;
margin-top: 0px;
padding: 0px !important; }
aside a {
color: #FF9191; }
aside a:hover, aside a:active, aside a:focus {
color: #FF9191; }
aside code {
color: white;
background-color: #FFB363; }
aside .heading {
padding: 8px 15px;
font-size: 32px;
line-height: 1.3;
text-align: center; }
aside .heading.inverted {
background-color: #FFF5EB;
color: black; }
aside .heading.small {
font-size: 25px; }
aside .heading.small .sub {
font-size: 0.7em;
font-weight: normal; }
aside .heading .sub {
font-size: 0.7em;
font-weight: normal; }
aside .heading.separator {
border-bottom-color: #FF9191;
border-bottom-style: solid; }
aside .text {
padding: 15px; }
aside .text.inverted {
background-color: #FFF5EB;
color: black; }
@media (min-width: 768px) {
main {
margin-top: 20px; }
aside {
margin-top: 20px; } }
hr {
border-top: 1px solid #FFB363; }
span.vsep {
padding-left: 5px;
padding-right: 5px; }
div.tag-list {
margin-top: 20px; }
code {
font-size: small; }
.module-list {
display: flex;
align-items: stretch;
flex-wrap: wrap; }
a.module {
background-color: #FFB363;
color: #FFF5EB;
padding: 20px 40px;
margin: 5px;
border-bottom-color: #FF9191;
border-bottom-style: solid;
font-size: large;
display: block; }
a.module:hover, a.module:active, a.module:focus {
color: #FFF5EB;
background-color: #FFC282;
text-decoration: none; }
.collapsible {
background-color: #777;
color: white;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px; }
.collapsible:after {
content: '\002B';
color: white;
font-weight: bold;
float: right;
margin-left: 5px; }
.collapsible:hover {
background-color: #555; }
.collapsible h3 {
margin-top: 0px;
margin-bottom: 0px;
display: inline-block; }
.active {
background-color: #555; }
.active:after {
content: "\2212"; }
.content {
padding: 8px 18px;
display: none;
background-color: #f1f1f1; }
.content.fluid {
padding: 0px 0px;
background-color: transparent; }
.content h4 {
font-size: x-large;
font-weight: bold;
display: inline-block;
margin: 0px 0px; }
.planning .activity {
padding: 8px 18px;
padding-top: 8px;
padding-bottom: 12px;
border-left: none;
border-right: 6px solid #FF9191; }
.planning .activity.inverted {
border-left: 6px solid #FF9191;
border-right: none; }
.planning .activity .activity-title {
font-size: large; }
.glyphicon.yes {
color: #55C487 !important; }
.glyphicon.no {
color: #E36268 !important; }
.glyphicon.dunno {
color: #5599C4 !important; }
/*# sourceMappingURL=global.css.map */