canaille-globuzma/canaille/static/css/base.css

268 lines
7.3 KiB
CSS
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@media only screen and (min-width: 1200px) {
.ui.ui.ui.container:not(.fluid) {
width: 770px;
margin-left: auto;
margin-right: auto;
}
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
.ui.ui.ui.container:not(.fluid) {
width: 790px;
margin-left: auto;
margin-right: auto;
}
}
@media only screen and (max-width:768px) {
.ui .grid .three.wide.column {
width: 100% !important;
text-align: center;
}
.ui .grid .thirteen.wide.column {
width: 100% !important;
}
}
body {
background: #F8F8F8;
padding: 1em;
}
.logo {
margin-left: auto;
margin-right: auto;
display: block;
}
.logo img{
width: 50px;
max-height: 50px;
}
.menu-container {
margin-bottom: 1em;
}
.menu-container .ui.item.menu {
justify-content: normal;
}
footer {
font-size: x-small;
text-align: center;
}
footer a {
color: #B0B0B0;
}
.ui.masthead .ui.header {
margin-bottom: 1em;
}
.ui.masthead .ui.text p {
margin-bottom: 1em;
margin-top:1em;
}
.pagination {
border-radius: .28571429rem;
overflow: hidden;
}
.disabled.ui.button {
color: rgba(0,0,0,1);
}
.progress_bar:first-child {
margin: 1em 0 .28571429rem 0;
}
/* Fix button appearance for semantic-ui on webkit */
[type=button] {
-webkit-appearance: none;
}
.ui.corner.labeled.input .ui.dropdown .dropdown.icon {
margin-right: 1.5em;
}
i.massive.massive.massive.portrait.icon, i.massive.massive.massive.portrait.icons {
font-size: 8em;
margin-bottom: 15px;
}
.profile-form label img{
cursor: pointer;
}
.profile-form label i{
cursor: pointer;
}
.dropdown-active {
background: rgba(0,0,0,.05) !important;
}
/**
* Workaround for
* https://github.com/fomantic/Fomantic-UI/issues/2829
*/
.ui.corner.labeled.action.input .ui.corner.label {
right:40px;
z-index: 5;
}
.ui.corner.labeled.action.input .ui.button {
z-index: 99;
}
/* NO JS */
select.ui.multiple.dropdown {
height: auto;
max-height: 300px;
}
select.ui.multiple.dropdown option[selected] {
background-color: #F4F4F4;
font-weight: 700;
border: 0 solid transparent;
border-radius: .28571429rem;
padding: .35714286em .78571429em;
margin: .14285714rem .28571429rem .14285714rem 0;
box-shadow: 0 0 0 1px rgba(34,36,38,.15) inset;
}
/* MEDIA QUERIES */
@media (prefers-color-scheme: dark) {
.logo img {
filter: invert(.8) !important;
}
body, .ui.card .bottom, .ui.toggle.checkbox label:hover::before {
background-color: #222222;
}
.ui.segment, .ui.menu, .ui.table {
background-color: #353535 !important;
}
.ui a:visited, .ui a:visited .icon {
color: rgba(255,255,255,.87) !important;
}
.ui a, .ui a .icon {
color: rgba(255,255,255,.87) !important;
}
#ellipsis-next .disabled.ui.button {
background-color: #c0c1c2;
opacity: 1 !important;
}
body, .ui.menu .active.item, .ui.form:not(.inverted) .field > label:not(.button), .ui.info.message .header, .ui.input, .ui.toggle.checkbox label, .ui.header, .ui.form .field > label, .ui.list .list > .item > .content, .ui.list > .item > .content, .ui.card, .ui.cards > .card, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
color: rgba(255,255,255,.87);
}
.ui.card .bottom, .ui.link.menu .item, .ui.menu .dropdown.item, .ui.menu .link.item, .ui.menu a.item, .ui.icon.menu .item, .ui.header .sub.header, .ui.label, table tbody tr td, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
color: rgba(255,255,255,.7);
}
.ui.selection.dropdown, .ui.form input:not([type]), .ui.form input[type="date"], .ui.form input[type="datetime-local"], .ui.form input[type="email"], .ui.form input[type="file"], .ui.form input[type="number"], .ui.form input[type="password"], .ui.form input[type="search"], .ui.form input[type="tel"], .ui.form input[type="text"], .ui.form input[type="time"], .ui.form input[type="url"] {
background: #222222 !important;
color: rgba(255,255,255,.87) !important;
}
.ui.menu .active.item {
background: rgba(0,0,0,.20);
}
.ui.menu .active.item:hover {
background: rgba(0,0,0,.30);
}
table tbody tr td .ui.label:hover {
color: #353535 !important;
}
.ui.corner.label {
border-color: rgba(0,0,0,.2);
}
.ui.label, table tbody tr td, .ui.card .bottom.button:hover, .ui.card .bottom.button:focus {
background-color: #353535;
}
.ui.button {
background-color: #282828;
}
.ui.button:hover, .ui.button:focus {
background-color: #181818;
}
.ui.basic.negative.button, .ui.basic.negative.buttons .button {
box-shadow: 0 0 0 1px #ffb7b7 inset;
color: #ffb7b7;
}
.ui.right.floated.buttons.pagination .ui.button {
color: #F4F4F4;
}
.ui.right.floated.buttons.pagination .ui.button.active {
color: #181818;
}
.disabled.ui.button {
color: #c0c1c2;
}
.ui.link.menu .item:hover, .ui.menu .dropdown.item:hover, .ui.menu .link.item:hover, .ui.menu a.item:hover, .ui.menu a.item.active:hover {
color: rgba(255,255,255,.95);
}
.ui.attached.header, .ui.toggle.checkbox label::before, .ui.table > thead > tr > th, .ui.table > tfoot > tr > th, table tbody tr td .ui.label, .ui.card, .ui.cards > .card, .ui.message, .ui.info.message, .ui.success.message {
background-color: #282828;
color: rgba(255,255,255,.87) !important;
}
table tbody tr td {
color: rgba(255,255,255,.87) !important;
}
table tbody tr td .ui.label:hover {
background-color: rgba(255,255,255,.87);
}
table.no-footer, .ui.table {
border: 2px solid #282828;
}
.ui.table, .ui.card .header, .ui.card .description, .ui.message, .ui.info.message, .ui.success.message, .ui.toggle.checkbox {
color: rgba(255,255,255,.87) !important;
}
.ui.card, .ui.cards > .card {
border: 2px solid #222222;
outline: none;
box-shadow: none;
}
.ui.card .meta {
color: rgba(255,255,255,.7) !important;
}
.ui.attached.header, .ui.attached.segment, .ui.attached.menu:not(.tabular):not(.text), .ui.attached.segment:not(.basic), .ui.attached.table {
border: 1px solid #222222;
}
.ui.info.message {
background-color: rgba(0, 60, 255, 0.05);
}
.ui.success.message, .ui.positive.message {
background-color: rgba(22, 255, 72, 0.05);
}
.ui.warning.message {
background-color: rgba(255, 217, 0, 0.05);
}
.ui.negative.message, .ui.error.message {
background-color: rgba(255, 0, 0, 0.05);
}
.ui.form .field .dropdown .menu > .item {
background-color: #222;
border-top: 1px solid #181818;
color: rgba(255,255,255,0.87);
}
.ui.form .field .dropdown .menu > .item:hover {
background-color: #282828;
}
.ui.form .field.field input:autofill {
box-shadow: 0 0 0 100px #888888 inset !important;
border: 1px solid rgba(255,255,255,0.60) !important;
}
.ui.form .field.field input:autofill:focus {
box-shadow: 0 0 0 100px #888888 inset !important;
border: 1px solid rgba(255,255,255,0.87) !important;
}
.ui.progress {
background: #222222;
}
.ui.label.token-label {
padding-left: 0;
}
}