cl/cl-theme/static/css/style.css
2020-05-24 18:26:54 -05:00

669 lines
10 KiB
CSS

/*!
* bulma css framework (github.com/jgthms | bulma.io)
* Author: jeremy thomas
* Author: jesus e.
* Version: 2.0.0
* Licensed under MIT (https://github.com/jgthms/bulma/blob/master/LICENSE)
*/
/* basic formatting changes (mostly to cater for darker colours) */
/* latin */
@font-face {
font-family: 'Roboto Condensed';
font-style: normal;
font-weight: 400;
font-display: swap;
src: local("Roboto Condensed"), local("RobotoCondensed-Regular"), url(../fonts/roboto/roboto-latin.woff2) format("woff2");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* html/body/font-fixes */
body, input, textarea, .button {
font-family: 'Roboto Condensed', Nimbus Sans, sans-serif;
}
/* Colores */
/* main */
/* ------------- Menu Mobile sin JS ---------------- */
/* input hidden */
#navbar-toggle-cbox {
display: none;
}
label[for=navbar-toggle-cbox] {
cursor: pointer;
}
#navbar-toggle-cbox:checked ~ .navbar-menu {
display: block;
}
/*- ----------- End Menu Mobile sin JS ------------- */
/* navigation */
.navbar {
background-color: #0a0a0a;
}
.navbar a {
color: whitesmoke;
}
.navbar.is-social-center {
align-items: stretch;
background-color: transparent;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
flex-grow: 0;
flex-shrink: 0;
justify-content: center;
margin-left: auto;
margin-right: auto;
-webkit-box-align: stretch;
-webkit-box-pack: center;
-webkit-box-flex: 0;
-ms-flex-pack: center;
-ms-flex-align: stretch;
-ms-flex-negative: 0;
-ms-flex-positive: 0;
}
.navbar.is-social-center > a.navbar-item {
color: #4a4a4a;
background-color: transparent;
}
.navbar.is-social-center > a.navbar-item:hover {
color: #209cee;
}
/* main-header */
.main-header {
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
}
.main-header .title {
color: whitesmoke;
}
.main-header .subtitle {
color: #fff;
}
.main-header .hero {
background-color: #1a1a1a;
}
code {
background-color: #282828;
color: #73d1ed;
}
li {
color: white;
}
pre {
background-color: #000;
color: #f9f9f9;
margin: 10px 0;
border: 1px solid #3273dc;
border-left: 10px solid #3273dc;
background-size: 1px 40px;
text-align: left;
direction: ltr;
tab-size: 2;
}
strong {
color: white;
}
video {
width: 100%;
height: auto;
}
.is-cyan {
color: #0dd3ff;
}
.is-table {
display: table;
}
.input::-moz-placeholder,
.textarea::-moz-placeholder {
color: black;
}
/* Colors Code */
.highlight {
color: #cccccc;
}
.highlight pre {
font-size: 75%;
}
.highlight .hll {
background-color: #222222;
}
.highlight .c {
color: #4E4F8E;
}
.highlight .err {
color: #cccccc;
border: 1px solid #FF0000;
}
.highlight .esc, .highlight .g {
color: #cccccc;
}
.highlight .k {
color: #cdcd00;
}
.highlight .l, .highlight .n {
color: #cccccc;
}
.highlight .o {
color: #3399cc;
}
.highlight .x {
color: #cccccc;
}
.highlight .p {
color: #fac0ba;
}
.highlight .ch, .highlight .cm, .highlight .cp, .highlight .cpf, .highlight .c1 {
color: #4E4F8E;
}
.highlight .cs {
color: #cd0000;
font-weight: bold;
}
.highlight .gd {
color: #cd0000;
}
.highlight .ge {
color: #cccccc;
font-style: italic;
}
.highlight .gr {
color: #FF0000;
}
.highlight .gh {
color: #4E4F8E;
font-weight: bold;
}
.highlight .gi {
color: #00cd00;
}
.highlight .go {
color: #888888;
}
.highlight .gp {
color: #4E4F8E;
font-weight: bold;
}
.highlight .gs {
color: #cccccc;
font-weight: bold;
}
.highlight .gu {
color: #800080;
font-weight: bold;
}
.highlight .gt {
color: #0044DD;
}
.highlight .kc {
color: #cdcd00;
}
.highlight .kd {
color: #00cd00;
}
.highlight .kn {
color: #cd00cd;
}
.highlight .kp, .highlight .kr {
color: #cdcd00;
}
.highlight .kt {
color: #00cd00;
}
.highlight .ld {
color: #cccccc;
}
.highlight .m {
color: #cd00cd;
}
.highlight .s {
color: #ffc400;
}
.highlight .na {
color: #cccccc;
}
.highlight .nb {
color: #cd00cd;
}
.highlight .nc {
color: #00cdcd;
}
.highlight .no, .highlight .nd, .highlight .ni {
color: #cccccc;
}
.highlight .ne {
color: #666699;
font-weight: bold;
}
.highlight .nf, .highlight .nl, .highlight .nn, .highlight .nx, .highlight .py {
color: #cccccc;
}
.highlight .nt {
color: orange;
}
.highlight .nv {
color: #00cdcd;
}
.highlight .ow {
color: #cdcd00;
}
.highlight .w {
color: #cccccc;
}
.highlight .mb, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .mo {
color: #cd00cd;
}
.highlight .sb, .highlight .sc, .highlight .sd, .highlight .s2, .highlight .se, .highlight .sh, .highlight .si, .highlight .sx, .highlight .sr, .highlight .s1, .highlight .ss {
color: #FFEA00;
}
.highlight .bp {
color: #cd00cd;
}
.highlight .vc, .highlight .vg, .highlight .vi {
color: #00cdcd;
}
.highlight .il {
color: #cd00cd;
}
.soumaicon {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-ms-flex-line-pack: center;
align-content: center;
}
.soumaicon svg {
width: .8rem;
height: .8rem;
fill: currentcolor;
}
.soumaicon:hover svg {
fill: #3273dc;
}
/* main content styling */
.main-content {
background-color: #363636;
padding: 1rem 1.5rem;
}
/* card changes */
.card {
background-color: #1a1a1a;
}
.card .card-content-footer {
color: #7a7a7a;
}
.card-content-footer i {
padding-right: 10px;
padding-top: 2px;
}
.card-content-header,
.comments-header {
background-color: #3273dc;
padding: 10px;
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
}
.card-content-header:hover {
background-color: #209cee;
}
.card-content-header .title, .card-content-header a {
color: whitesmoke;
text-shadow: 0px 1px 2px #000;
}
.card-inner-wrapper {
padding: 25px;
}
.card-content-text {
padding-bottom: 30px;
border-bottom: 1px solid #3273dc;
}
.card-content-text p {
color: whitesmoke;
font-size: 1em;
}
.card-content-text label {
color: whitesmoke;
font-weight: 100;
}
.card-content-nav {
padding-top: 10px;
}
.card-content-footer {
padding-top: 15px;
padding-bottom: 15px;
}
.card-content-footer-small {
padding-top: 20px;
margin-bottom: -25px;
}
.card-content-footer-cols {
padding-top: 20px;
margin-bottom: -20px;
}
.card-content-form {
padding-top: 20px;
}
.content blockquote {
background: #0a0e0e;
color: white;
border-left: 4px solid #dbdbdb;
margin: 1rem 1rem;
padding: 1rem 1rem;
}
.content blockquote p {
display: contents;
}
* {
box-sizing: border-box;
}
*:after, *:before {
box-sizing: border-box;
}
legend {
box-sizing: border-box;
}
.content dl, .content dt, .content dd, .content h2, .content h3, .content h4, .content h5, .content h6 {
color: white;
}
.content.social {
margin-bottom: 0rem;
}
a {
color: #3273dc;
}
a:hover {
text-decoration: none;
color: #ffc20e;
}
a.navbar-item.is-tab.is-active {
border-bottom-color: #209cee;
border-width: 2px;
color: whitesmoke;
}
a.navbar-item.is-tab:hover {
border-bottom-color: #209cee;
border-width: 2px;
color: #209cee;
}
a.navbar-item:hover {
color: #209cee;
background-color: transparent;
}
a.pagination-previous.disabled, a.pagination-next.disabled {
background: #000;
color: white;
cursor: not-allowed;
border-color: #dbdbdb;
box-shadow: none;
color: #7a7a7a;
opacity: .5;
}
h2 > a:hover {
color: white;
text-shadow: 0px 1px 2px #000;
}
.is-button-grey, .pagination-link {
background-color: #7a7a7a;
border-color: transparent;
color: #1b1b1b;
}
.button {
vertical-align: unset;
}
.button:hover, .pagination .is-current, .pagination-link:hover {
background-color: #3273dc;
border-color: transparent;
color: whitesmoke;
}
.button:focus {
box-shadow: none;
border-color: transparent;
}
.pagination-style-custom {
margin-top: 50px;
}
.footer {
background-color: #0a0a0a;
color: whitesmoke;
}
.footer a {
color: #3273dc;
}
.footer a:hover {
color: #ffc20e;
}
.footer-top-shadow {
box-shadow: 0 1px 3px rgba(10, 10, 10, 0.1);
}
.hidden-more {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
color: #fff;
}
.warning-sp {
display: none;
}
.comments-content {
background-color: #1a1a1a;
padding-bottom: 10px;
margin-top: 20px;
}
.comments-wrapper {
padding: 25px;
}
.comments-header .title {
color: whitesmoke;
}
.comments-wrapper p {
color: whitesmoke;
}
.comments-wrapper p > a {
color: #f0e68c;
}
.comments-wrapper a {
color: #f0e68c;
}
.comments-wrapper a:hover {
color: #ffc20e;
}
.comments-wrapper small {
color: #7a7a7a;
}
.comments-wrapper strong > a {
color: #00d1b2;
font-weight: 100;
}
.comments-wrapper time > small > a {
color: grey;
}
.comments-wrapper .media .media, .comments-wrapper .media + .media {
border-top: 1px solid #209cee;
}
/* table of contents */
.toc {
font-size: 0.85rem;
}
.toctitle {
display: block;
text-align: center;
font-size: 1rem;
color: white;
text-decoration: underline;
}
nav.toc {
background-color: #0c0f0f;
border: 1px solid #3273dc;
margin: 1rem 0px;
}
div.toc {
margin: 1rem;
}
a.headerlink {
color: grey;
padding-left: .5em;
visibility: hidden;
}
h1:hover > a.headerlink, h2:hover > a.headerlink,
h3:hover > a.headerlink, h4:hover > a.headerlink,
h5:hover > a.headerlink, h6:hover > a.headerlink,
dt:hover > a.headerlink {
text-decoration: none;
visibility: visible;
}
@media screen and (max-width: 1087px) {
.navbar-menu {
background-color: transparent;
}
}
@media screen and (max-width: 600px) {
.main-content {
padding: 0rem;
}
}
/* aplaylist */
.play-menu {
height: 200px;
overflow-y: auto;
}
.play-menu a {
color: white;
}
.play-menu a:hover {
background-color: #484848;
color: #fff;
}
.is-active-play {
color: #3273dc;
background-color: #3273dc;
}