aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--dist/css/aplaylist.css4
-rw-r--r--dist/css/aplaylist.min.css2
-rw-r--r--dist/css/style.css150
-rw-r--r--dist/css/style.min.css4
-rw-r--r--src/scss/aplaylist/aplaylist.scss4
-rw-r--r--src/scss/custom/_button.scss4
-rw-r--r--src/scss/custom/_comments.scss32
-rw-r--r--src/scss/custom/_elements.scss9
-rw-r--r--src/scss/custom/_footer.scss14
-rw-r--r--src/scss/custom/_header.scss8
-rw-r--r--src/scss/custom/_hilite.scss1
-rw-r--r--src/scss/custom/_links.scss16
-rw-r--r--src/scss/custom/_main.scss30
-rw-r--r--src/scss/custom/_toc.scss36
-rw-r--r--src/scss/custom/_variables.scss26
-rw-r--r--src/scss/custom/style.scss5
16 files changed, 249 insertions, 96 deletions
diff --git a/dist/css/aplaylist.css b/dist/css/aplaylist.css
index ec66e61..2564d0c 100644
--- a/dist/css/aplaylist.css
+++ b/dist/css/aplaylist.css
@@ -13,6 +13,6 @@
}
.is-active-play {
- color: #dd7325;
- background-color: #dd7325;
+ color: #3273dc;
+ background-color: #3273dc;
}
diff --git a/dist/css/aplaylist.min.css b/dist/css/aplaylist.min.css
index af6aef6..eb7db37 100644
--- a/dist/css/aplaylist.min.css
+++ b/dist/css/aplaylist.min.css
@@ -1 +1 @@
-.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:#dd7325;background-color:#dd7325}
+.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}
diff --git a/dist/css/style.css b/dist/css/style.css
index b0b67ab..0903dfd 100644
--- a/dist/css/style.css
+++ b/dist/css/style.css
@@ -2,7 +2,7 @@
* bulma css framework (github.com/jgthms | bulma.io)
* Author: jeremy thomas
* Author: jesus e.
- * Version: 1.0.4
+ * Version: 2.0.0
* Licensed under MIT (https://github.com/jgthms/bulma/blob/master/LICENSE)
*/
/* basic formatting changes (mostly to cater for darker colours) */
@@ -22,6 +22,7 @@ body, input, textarea, .button {
}
/* Colores */
+/* main */
/* ------------- Menu Mobile sin JS ---------------- */
/* input hidden */
#navbar-toggle-cbox {
@@ -39,7 +40,7 @@ label[for=navbar-toggle-cbox] {
/*- ----------- End Menu Mobile sin JS ------------- */
/* navigation */
.navbar {
- background-color: #0c0f0f;
+ background-color: #0a0a0a;
}
.navbar a {
@@ -72,7 +73,7 @@ label[for=navbar-toggle-cbox] {
}
.navbar.is-social-center > a.navbar-item:hover {
- color: #dd7325;
+ color: #209cee;
}
/* main-header */
@@ -85,11 +86,11 @@ label[for=navbar-toggle-cbox] {
}
.main-header .subtitle {
- color: #dd7325;
+ color: #fff;
}
.main-header .hero {
- background-color: #161c1c;
+ background-color: #1a1a1a;
}
code {
@@ -103,7 +104,14 @@ li {
pre {
background-color: #000;
- color: #78dcfa;
+ 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 {
@@ -130,7 +138,6 @@ video {
/* Colors Code */
.highlight {
- background: #000000;
color: #cccccc;
}
@@ -337,7 +344,7 @@ video {
}
.soumaicon:hover svg {
- fill: #dd7325;
+ fill: #3273dc;
}
/* main content styling */
@@ -348,7 +355,7 @@ video {
/* card changes */
.card {
- background-color: #161c1c;
+ background-color: #1a1a1a;
}
.card .card-content-footer {
@@ -360,14 +367,20 @@ video {
padding-top: 2px;
}
-.card-content-header, .comments-header {
- background-color: #dd7325;
+.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 {
@@ -376,7 +389,7 @@ video {
.card-content-text {
padding-bottom: 30px;
- border-bottom: 1px solid #dd7325;
+ border-bottom: 1px solid #3273dc;
}
.card-content-text p {
@@ -424,15 +437,6 @@ video {
display: contents;
}
-.content blockquote:before {
- opacity: 0.5;
- content: open-quote;
- font-size: 4rem;
- line-height: .1em;
- margin-right: .25em;
- vertical-align: -0.4em;
-}
-
* {
box-sizing: border-box;
}
@@ -453,14 +457,8 @@ legend {
margin-bottom: 0rem;
}
-.hidden-more {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
-}
-
a {
- color: #0099e5;
+ color: #3273dc;
}
a:hover {
@@ -469,24 +467,24 @@ a:hover {
}
a.navbar-item.is-tab.is-active {
- border-bottom-color: #dd7325;
+ border-bottom-color: #209cee;
border-width: 2px;
color: whitesmoke;
}
a.navbar-item.is-tab:hover {
- border-bottom-color: #dd7325;
+ border-bottom-color: #209cee;
border-width: 2px;
- color: #dd7325;
+ color: #209cee;
}
a.navbar-item:hover {
- color: #dd7325;
+ color: #209cee;
background-color: transparent;
}
a.pagination-previous.disabled, a.pagination-next.disabled {
- background: #0c0f0f;
+ background: #000;
color: white;
cursor: not-allowed;
border-color: #dbdbdb;
@@ -497,13 +495,13 @@ a.pagination-previous.disabled, a.pagination-next.disabled {
h2 > a:hover {
color: white;
- text-shadow: 1px 2px 0px #161C1C;
+ text-shadow: 0px 1px 2px #000;
}
.is-button-grey, .pagination-link {
background-color: #7a7a7a;
border-color: transparent;
- color: rgba(0, 0, 0, 0.7);
+ color: #1b1b1b;
}
.button {
@@ -511,7 +509,7 @@ h2 > a:hover {
}
.button:hover, .pagination .is-current, .pagination-link:hover {
- background-color: #dd7325;
+ background-color: #3273dc;
border-color: transparent;
color: whitesmoke;
}
@@ -526,20 +524,35 @@ h2 > a:hover {
}
.footer {
- background-color: #0c0f0f;
+ background-color: #0a0a0a;
color: whitesmoke;
}
.footer a {
- color: #dd7325;
+ 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: #161c1c;
+ background-color: #1a1a1a;
padding-bottom: 10px;
margin-top: 20px;
}
@@ -556,21 +569,70 @@ h2 > a:hover {
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 {
- color: whitesmoke;
+.comments-wrapper strong > a {
+ color: #00d1b2;
font-weight: 100;
}
-.comments-wrapper a {
- color: #dd7325;
+.comments-wrapper time > small > a {
+ color: grey;
}
.comments-wrapper .media .media, .comments-wrapper .media + .media {
- border-top: 1px solid #dd7325;
+ 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) {
diff --git a/dist/css/style.min.css b/dist/css/style.min.css
index 4c511c1..d307dcd 100644
--- a/dist/css/style.min.css
+++ b/dist/css/style.min.css
@@ -2,6 +2,6 @@
* bulma css framework (github.com/jgthms | bulma.io)
* Author: jeremy thomas
* Author: jesus e.
- * Version: 1.0.4
+ * Version: 2.0.0
* Licensed under MIT (https://github.com/jgthms/bulma/blob/master/LICENSE)
- */@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}body,input,textarea,.button{font-family:'Roboto Condensed', Nimbus Sans, sans-serif}#navbar-toggle-cbox{display:none}label[for=navbar-toggle-cbox]{cursor:pointer}#navbar-toggle-cbox:checked ~ .navbar-menu{display:block}.navbar{background-color:#0c0f0f}.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:#dd7325}.main-header{box-shadow:0 2px 3px rgba(10,10,10,0.1)}.main-header .title{color:whitesmoke}.main-header .subtitle{color:#dd7325}.main-header .hero{background-color:#161c1c}code{background-color:#282828;color:#73d1ed}li{color:white}pre{background-color:#000;color:#78dcfa}strong{color:white}video{width:100%;height:auto}.is-cyan{color:#0dd3ff}.is-table{display:table}.input::-moz-placeholder,.textarea::-moz-placeholder{color:black}.highlight{background:#000000;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:#dd7325}.main-content{background-color:#363636;padding:1rem 1.5rem}.card{background-color:#161c1c}.card .card-content-footer{color:#7a7a7a}.card-content-footer i{padding-right:10px;padding-top:2px}.card-content-header,.comments-header{background-color:#dd7325;padding:10px;box-shadow:0 2px 3px rgba(10,10,10,0.1)}.card-content-header .title,.card-content-header a{color:whitesmoke}.card-inner-wrapper{padding:25px}.card-content-text{padding-bottom:30px;border-bottom:1px solid #dd7325}.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}.content blockquote:before{opacity:0.5;content:open-quote;font-size:4rem;line-height:.1em;margin-right:.25em;vertical-align:-0.4em}*{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}.hidden-more{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}a{color:#0099e5}a:hover{text-decoration:none;color:#ffc20e}a.navbar-item.is-tab.is-active{border-bottom-color:#dd7325;border-width:2px;color:whitesmoke}a.navbar-item.is-tab:hover{border-bottom-color:#dd7325;border-width:2px;color:#dd7325}a.navbar-item:hover{color:#dd7325;background-color:transparent}a.pagination-previous.disabled,a.pagination-next.disabled{background:#0c0f0f;color:white;cursor:not-allowed;border-color:#dbdbdb;box-shadow:none;color:#7a7a7a;opacity:.5}h2>a:hover{color:white;text-shadow:1px 2px 0px #161C1C}.is-button-grey,.pagination-link{background-color:#7a7a7a;border-color:transparent;color:rgba(0,0,0,0.7)}.button{vertical-align:unset}.button:hover,.pagination .is-current,.pagination-link:hover{background-color:#dd7325;border-color:transparent;color:whitesmoke}.button:focus{box-shadow:none;border-color:transparent}.pagination-style-custom{margin-top:50px}.footer{background-color:#0c0f0f;color:whitesmoke}.footer a{color:#dd7325}.footer-top-shadow{box-shadow:0 1px 3px rgba(10,10,10,0.1)}.comments-content{background-color:#161c1c;padding-bottom:10px;margin-top:20px}.comments-wrapper{padding:25px}.comments-header .title{color:whitesmoke}.comments-wrapper p{color:whitesmoke}.comments-wrapper small{color:#7a7a7a}.comments-wrapper strong{color:whitesmoke;font-weight:100}.comments-wrapper a{color:#dd7325}.comments-wrapper .media .media,.comments-wrapper .media+.media{border-top:1px solid #dd7325}@media screen and (max-width: 1087px){.navbar-menu{background-color:transparent}}@media screen and (max-width: 600px){.main-content{padding:0rem}}
+ */@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}body,input,textarea,.button{font-family:'Roboto Condensed', Nimbus Sans, sans-serif}#navbar-toggle-cbox{display:none}label[for=navbar-toggle-cbox]{cursor:pointer}#navbar-toggle-cbox:checked ~ .navbar-menu{display:block}.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{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}.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{background-color:#363636;padding:1rem 1.5rem}.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:khaki}.comments-wrapper a{color:khaki}.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}.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}}
diff --git a/src/scss/aplaylist/aplaylist.scss b/src/scss/aplaylist/aplaylist.scss
index b0bb571..d179667 100644
--- a/src/scss/aplaylist/aplaylist.scss
+++ b/src/scss/aplaylist/aplaylist.scss
@@ -13,6 +13,6 @@
}
.is-active-play {
- color: #dd7325;
- background-color: #dd7325;
+ color: #3273dc;
+ background-color: #3273dc;
}
diff --git a/src/scss/custom/_button.scss b/src/scss/custom/_button.scss
index 0a11b2c..270ce48 100644
--- a/src/scss/custom/_button.scss
+++ b/src/scss/custom/_button.scss
@@ -1,7 +1,7 @@
.is-button-grey, .pagination-link {
background-color: #7a7a7a;
border-color: transparent;
- color: rgba(0, 0, 0, 0.7);
+ color: #1b1b1b;
}
.button {
@@ -9,7 +9,7 @@
}
.button:hover, .pagination .is-current, .pagination-link:hover {
- background-color: #dd7325;
+ background-color: $boton;
border-color: transparent;
color: whitesmoke;
}
diff --git a/src/scss/custom/_comments.scss b/src/scss/custom/_comments.scss
index ed77528..8a79bfb 100644
--- a/src/scss/custom/_comments.scss
+++ b/src/scss/custom/_comments.scss
@@ -1,5 +1,9 @@
+.warning-sp {
+ display: none;
+}
+
.comments-content {
- background-color: #161c1c;
+ background-color: $card;
padding-bottom: 10px;
margin-top: 20px;
}
@@ -12,23 +16,39 @@
color: whitesmoke;
}
+
.comments-wrapper {
p {
color: whitesmoke;
+ >a {
+ color: $clinks;
+ }
+ }
+ a {
+ color: $clinks;
+ &:hover {
+ color: $hlinks;
+ }
}
small {
color: #7a7a7a;
}
strong {
- color: whitesmoke;
- font-weight: 100;
+ >a {
+ color: $author;
+ font-weight: 100;
+ }
}
- a {
- color: #dd7325;
+ time {
+ >small {
+ >a {
+ color: grey;
+ }
+ }
}
.media {
.media, + .media {
- border-top: 1px solid #dd7325;
+ border-top: 1px solid $slinks;
}
}
}
diff --git a/src/scss/custom/_elements.scss b/src/scss/custom/_elements.scss
index f184b45..7fbd19e 100644
--- a/src/scss/custom/_elements.scss
+++ b/src/scss/custom/_elements.scss
@@ -9,7 +9,14 @@ li {
pre {
background-color: #000;
- color: #78dcfa;
+ color: #f9f9f9;
+ margin: 10px 0;
+ border: 1px solid $code;
+ border-left: 10px solid $code;
+ background-size: 1px 40px;
+ text-align: left;
+ direction: ltr;
+ tab-size: 2;
}
strong {
diff --git a/src/scss/custom/_footer.scss b/src/scss/custom/_footer.scss
index a92637d..f0c2cf7 100644
--- a/src/scss/custom/_footer.scss
+++ b/src/scss/custom/_footer.scss
@@ -1,11 +1,21 @@
.footer {
- background-color: #0c0f0f;
+ background-color: $footerheader;
color: whitesmoke;
a {
- color: #dd7325;
+ color: $links;
+ &:hover {
+ color: $hlinks;
+ }
}
}
.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: $txfooter;
+}
diff --git a/src/scss/custom/_header.scss b/src/scss/custom/_header.scss
index 1377035..5b1e012 100644
--- a/src/scss/custom/_header.scss
+++ b/src/scss/custom/_header.scss
@@ -17,7 +17,7 @@ label[for=navbar-toggle-cbox] {
/* navigation */
.navbar {
- background-color: #0c0f0f;
+ background-color: $footerheader;
a {
color: whitesmoke;
}
@@ -43,7 +43,7 @@ label[for=navbar-toggle-cbox] {
color: #4a4a4a;
background-color: transparent;
&:hover {
- color: #dd7325;
+ color: $slinks;
}
}
}
@@ -56,10 +56,10 @@ label[for=navbar-toggle-cbox] {
color: whitesmoke;
}
.subtitle {
- color: #dd7325;
+ color: $subtitle;
}
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
.hero {
- background-color: #161c1c;
+ background-color: $card;
}
}
diff --git a/src/scss/custom/_hilite.scss b/src/scss/custom/_hilite.scss
index 0dd5dd7..a53a74f 100644
--- a/src/scss/custom/_hilite.scss
+++ b/src/scss/custom/_hilite.scss
@@ -7,7 +7,6 @@
.hll {
background-color: #222222;
}
- background: #000000;
color: #cccccc;
// Comments
.c {
diff --git a/src/scss/custom/_links.scss b/src/scss/custom/_links.scss
index d5449a8..c813caa 100644
--- a/src/scss/custom/_links.scss
+++ b/src/scss/custom/_links.scss
@@ -1,29 +1,29 @@
a {
- color: #0099e5;
+ color: $links;
&:hover {
text-decoration: none;
- color: #ffc20e;
+ color: $hlinks;
}
&.navbar-item {
&.is-tab {
&.is-active {
- border-bottom-color: #dd7325;
+ border-bottom-color: $slinks;
border-width: 2px;
color: whitesmoke;
}
&:hover {
- border-bottom-color: #dd7325;
+ border-bottom-color: $slinks;
border-width: 2px;
- color: #dd7325;
+ color: $slinks;
}
}
&:hover {
- color: #dd7325;
+ color: $slinks;
background-color: transparent;
}
}
&.pagination-previous.disabled, &.pagination-next.disabled {
- background: #0c0f0f;
+ background: $plinks;
color: white;
cursor: not-allowed;
border-color: #dbdbdb;
@@ -35,5 +35,5 @@ a {
h2 > a:hover {
color: white;
- text-shadow: 1px 2px 0px #161C1C;
+ text-shadow: 0px 1px 2px #000;
}
diff --git a/src/scss/custom/_main.scss b/src/scss/custom/_main.scss
index 9a7b866..7b39b2a 100644
--- a/src/scss/custom/_main.scss
+++ b/src/scss/custom/_main.scss
@@ -1,12 +1,12 @@
/* main content styling */
.main-content {
- background-color: #363636;
+ background-color: $fondo;
padding: 1rem 1.5rem;
}
/* card changes */
.card {
- background-color: #161c1c;
+ background-color: $card;
.card-content-footer {
color: #7a7a7a;
}
@@ -17,15 +17,21 @@
padding-top: 2px;
}
-.card-content-header, .comments-header {
- background-color: #dd7325;
+.card-content-header,
+.comments-header {
+ background-color: $barra;
padding: 10px;
box-shadow: 0 2px 3px rgba(10, 10, 10, 0.1);
}
+.card-content-header:hover {
+ background-color: $hbarra;
+}
+
.card-content-header {
.title, a {
color: whitesmoke;
+ text-shadow: 0px 1px 2px #000;
}
}
@@ -35,7 +41,7 @@
.card-content-text {
padding-bottom: 30px;
- border-bottom: 1px solid #dd7325;
+ border-bottom: 1px solid $barra;
p {
color: whitesmoke;
font-size: 1em;
@@ -78,14 +84,6 @@
p {
display: contents;
}
- &:before {
- opacity: 0.5;
- content: open-quote;
- font-size: 4rem;
- line-height: .1em;
- margin-right: .25em;
- vertical-align: -0.4em;
- }
}
* {
@@ -107,9 +105,3 @@ legend {
margin-bottom: 0rem;
}
}
-
-.hidden-more {
- overflow: hidden;
- white-space: nowrap;
- text-overflow: ellipsis;
-}
diff --git a/src/scss/custom/_toc.scss b/src/scss/custom/_toc.scss
new file mode 100644
index 0000000..64c0fe0
--- /dev/null
+++ b/src/scss/custom/_toc.scss
@@ -0,0 +1,36 @@
+/* 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 $toc;
+ 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;
+}
diff --git a/src/scss/custom/_variables.scss b/src/scss/custom/_variables.scss
index 062ba27..eee098c 100644
--- a/src/scss/custom/_variables.scss
+++ b/src/scss/custom/_variables.scss
@@ -1,3 +1,27 @@
/* Colores */
-$secundario: #dd7325;
+$secundario: hsl(217, 71%, 53%);
+
+/* main */
+$fondo: hsl(0, 0%, 21%);
+$subtitle: #fff;
+
+$barra: hsl(217, 71%, 53%);
+$hbarra: hsl(204, 86%, 53%);
+
+$links: hsl(217, 71%, 53%);
+$slinks: hsl(204, 86%, 53%);
+$plinks: #000;
+$card: #1a1a1a;
+$footerheader: hsl(0, 0%, 4%);
+$boton: hsl(217, 71%, 53%);
+$hlinks: #ffc20e;
+$code: hsl(217, 71%, 53%);
+$toc: hsl(217, 71%, 53%);
+
+// footer
+$txfooter: #fff;
+
+// comments
+$clinks: #f0e68c;
+$author: hsl(171, 100%, 41%);
diff --git a/src/scss/custom/style.scss b/src/scss/custom/style.scss
index 7f820b8..0323dd3 100644
--- a/src/scss/custom/style.scss
+++ b/src/scss/custom/style.scss
@@ -3,7 +3,7 @@
* bulma css framework (github.com/jgthms | bulma.io)
* Author: jeremy thomas
* Author: jesus e.
- * Version: 1.0.4
+ * Version: 2.0.0
* Licensed under MIT (https://github.com/jgthms/bulma/blob/master/LICENSE)
*/
@@ -45,5 +45,8 @@
// Comentarios
@import "comments";
+// Extras
+@import "toc";
+
// Mediaqueries
@import "mediaqueries";