switch to scss

This commit is contained in:
Jonas Leder 2022-01-28 23:49:12 +01:00
parent 4d68e3b073
commit 9411f7bced
31 changed files with 85 additions and 1197 deletions

View file

@ -1,167 +0,0 @@
body {
background: #1a2332;
overflow: hidden;
}
.terminal-window {
text-align: left;
width: 37.5rem;
height: 22.5rem;
border-radius: 0.625rem;
margin: auto;
position: relative;
top: 10.5rem;
}
.terminal-window header {
background: #e0e8f0;
height: 1.875rem;
border-radius: 0.5rem 0.5rem 0 0;
padding-left: 0.625rem;
}
.terminal-window header .button {
width: 0.75rem;
height: 0.75rem;
margin: 0.625rem 0.25rem 0 0;
display: inline-block;
border-radius: 0.5rem;
}
.terminal-window header .button.green {
background: #3bb662;
}
.terminal-window header .button.red {
background: #e75448;
}
.terminal-window header .button.yellow {
background: #e5c30f;
}
.terminal-window section.terminal {
color: #fff;
font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";
font-size: 11pt;
background: #30353a;
padding: 0.625rem;
box-sizing: border-box;
position: absolute;
width: 100%;
top: 1.875rem;
bottom: 0;
overflow: auto;
}
.terminal-window section.terminal .typed-cursor {
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
@-webkit-keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-moz-keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.terminal-data {
display: none;
}
.terminal-window .gray {
color: #808080;
}
.terminal-window .green {
color: #008000;
}
/*Media for mobile responsive viewing*/
@media only screen and (max-width: 600px) {
.terminal-window {
text-align: left;
width: 37.5vmin;
height: 22.5vmin;
border-radius: 0.625vmin;
margin: auto;
position: relative;
top: 30.5vmin;
}
.terminal-window header {
background: #e0e8f0;
height: 1.875vmin;
border-radius: 0.5vmin 0.5vmin 0 0;
padding-left: 1vmin;
}
.terminal-window header .button {
width: 0.75vmin;
height: 0.75vmin;
margin: 0.625vmin 0.25vmin 0 0;
display: inline-block;
border-radius: 0.5vmin;
}
.terminal-window section.terminal {
color: #fff;
font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";
font-size: 0.6875vmin;
background: #30353a;
padding: 0.625vmin;
box-sizing: border-box;
position: absolute;
width: 100%;
top: 1.875vmin;
bottom: 0;
overflow: auto;
}
}
@-moz-keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-o-keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes blink {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}

View file

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["../../scss/error.scss","../../scss/_var.scss"],"names":[],"mappings":"AAEA,KACI,WCHS,QDIT,gBAGJ,iBACI,gBACA,cACA,eACA,sBACA,YACA,kBACA,YACA,wBACI,mBACA,gBACA,8BACA,qBAEA,gCACI,aACA,cACA,0BACA,qBACA,oBAEA,sCACI,mBAEJ,oCACI,mBAEJ,uCACI,mBAIZ,kCACI,WACA,4DACA,eACA,mBACA,gBACA,sBACA,kBACA,WACA,aACA,SACA,cAEA,gDACI,UACA,qCACA,kCACA,6BAKZ,iBACI,aACA,cACA,gBAEJ,yBACI,aACA,cACA,gBAEJ,sBACI,aACA,cACA,gBAGJ,4BAEI,uBACI,WAGJ,wBACI,YAKR,0CACI,iBACI,gBACA,eACA,gBACA,uBACA,YACA,kBACA,aAEA,wBACI,mBACA,iBACA,gCACA,mBAEA,gCACI,cACA,eACA,4BACA,qBACA,qBAGR,kCACI,WACA,4DACA,oBACA,mBACA,iBACA,sBACA,kBACA,WACA,cACA,SACA","file":"error.css"}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1,903 +0,0 @@
html {
scroll-behavior: smooth;
}
body {
margin: 0;
background-color: #111721;
color: #b3b3b3;
font-family: 'Source Sans Pro', sans-serif;
width: calc(100% - 1px);
height: 100%;
}
button {
background-color: #20c5ad;
color: #000;
text-transform: uppercase;
border: 0;
padding: 5px;
cursor: pointer;
border-radius: 5px;
transition: background-color 0.2s linear;
}
button:hover,
button:active,
button:focus {
background-color: #1caf9a;
outline: none;
}
.spacer {
clear: both;
}
a {
padding: 0;
color: #20c5ad;
text-decoration: underline;
transition: color 0.2s;
}
a:HOVER {
color: #1caf9a;
}
.noStyleLink {
text-decoration: none;
}
h1 {
color: #fff;
text-transform: uppercase;
}
.red {
color: #f00;
}
.red a:hover {
color: #e60000;
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.right {
text-align: left;
}
.block {
text-align: justify;
text-justify: auto;
}
img {
border-radius: 5px;
}
img.no-corner {
border-radius: 0;
}
#mainmenu {
position: absolute;
top: 20px;
right: 100px;
display: flex;
align-content: flex-end;
justify-content: flex-end;
width: 100%;
}
#mainmenu a {
color: #fff;
text-align: center;
padding: 14px 16px;
text-decoration: none;
display: inline-block;
}
.dropdown {
display: inline-block;
position: relative;
}
.dropdown-content {
position: absolute;
display: none;
width: max-content;
left: 50%;
transform: translateX(-50%);
}
.dropdown-content a {
background-color: #171e2b;
border-bottom: #111721 solid 2px;
width: 100%;
color: #b3b3b3;
transition: background-color 0.2s linear;
}
.dropdown-content a:first-of-type {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.dropdown-content a:last-of-type {
border-bottom: none;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.dropdown-content a:hover {
background-color: #111721;
}
.navLink:hover {
transform: scale(1.2);
}
.dropdown:hover .navLink {
transform: scale(1.2);
}
.dropdown:hover .dropdown-content {
display: block;
}
.menuSelected {
text-decoration: underline !important;
}
@media only screen and (max-width: 600px) {
#mainmenu {
right: 10px;
}
}
/* normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
body {
margin: 0;
}
main {
display: block;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
pre {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
a {
background-color: transparent;
}
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
b,
strong {
font-weight: bolder;
}
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-size: 1em; /* 2 */
}
small {
font-size: 80%;
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
img {
border-style: none;
}
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
button,
input {
/* 1 */
overflow: visible;
}
button,
select {
/* 1 */
text-transform: none;
}
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
fieldset {
padding: 0.35em 0.75em 0.625em;
}
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
progress {
vertical-align: baseline;
}
textarea {
overflow: auto;
}
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
details {
display: block;
}
summary {
display: list-item;
}
template {
display: none;
}
[hidden] {
display: none;
}
.js-plotly-plot {
margin-bottom: 10px;
}
.ntpBanner {
margin-top: 10px;
display: block;
width: 100%;
padding: 10px;
background-color: #171e2b;
cursor: pointer;
}
.ntpContent {
width: 100%;
padding: 10px;
display: none;
background-color: #171e2b;
}
.visible {
display: block;
}
.header-wrapper *:before {
box-sizing: border-box;
}
.header-homepage {
background: linear-gradient(rgba(0,0,0,0.2), rgba(0,0,0,0.6)), url("/API/getFile.php?filename=img/bannerHomeCrop.webp");
background-size: cover;
position: relative;
color: #fff;
z-index: 0;
padding-top: 160px;
padding-bottom: 360px;
}
.header-homepage h1 {
width: 100%;
text-align: center;
font-size: 3.3em;
font-weight: 600;
}
.header-separator-bottom {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
}
.header-separator-bottom svg {
display: block;
width: calc(100% + 1.3px);
height: 90px;
fill: #1a2332;
}
.header-wrapper {
position: relative;
}
.cookieinfo {
position: fixed;
left: 0;
right: 0;
height: auto;
min-height: 21px;
z-index: 2147483647;
line-height: 21px;
padding: 8px 18px;
font-family: verdana, arial, sans-serif;
font-size: 14px;
text-align: center;
bottom: 0;
opacity: 1;
background-color: #171e2b;
color: #b3b3b3;
border: 1px solid #20c5ad;
}
.cookieinfo-close {
float: right;
display: block;
padding: 5px 8px;
min-width: 100px;
margin-left: 5px;
border-radius: 5px;
cursor: pointer;
background-color: #20c5ad;
color: #000;
text-align: center;
}
.cookieinfo-close:HOVER {
background-color: #1caf9a;
}
.cookieinfo-text {
display: block;
padding: 5px 0 5px 0;
}
.cookieinfo-link {
text-decoration: none;
color: #20c5ad;
}
.cookieinfo-link:HOVER {
color: #1caf9a;
}
#newComment form input,
#newComment form textarea {
width: 100%;
background-color: #1a2332;
color: #b3b3b3;
border: solid #111721;
border-radius: 5px;
padding: 5px;
}
#newComment form input:focus,
#newComment form textarea:focus {
outline: none;
}
#newComment form textarea {
resize: vertical;
}
#newComment form input[type=submit] {
background-color: #20c5ad;
color: #000;
text-transform: uppercase;
padding: 15px;
font-size: 14px;
cursor: pointer;
outline: 0;
border: 0;
transition: background-color 0.2s linear;
}
#newComment form input[type=submit]:HOVER {
background-color: #1caf9a;
}
.comment {
display: flex;
}
.comment img {
margin-right: 10px;
width: 100px;
height: 100px;
}
.commentTitle {
margin-bottom: 5px;
}
.commentArticle {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
min-height: 100px;
}
.commentText {
margin: 0;
width: 100%;
}
.emailBox {
display: inline;
}
.bigButton {
background-color: #20c5ad;
color: #000;
text-transform: uppercase;
padding: 15px;
font-size: 14px;
cursor: pointer;
outline: 0;
border: 0;
transition: background-color 0.2s linear;
width: 100%;
margin-top: 10px;
}
footer {
display: flex;
justify-content: center;
flex-direction: column;
}
footer a {
text-decoration: none;
}
footer #footerContent {
width: 70%;
display: flex;
justify-content: center;
margin: 0 auto;
}
footer #footerContent div {
border-right: #3d3d3d 1px solid;
padding: 20px;
flex-basis: 100%;
}
footer #footerContent div:last-child {
border-right: none;
}
footer #footerContent h3 {
margin-top: 0;
}
footer #footerContent a {
color: #b3b3b3;
transition: color 0.2s;
}
footer #footerContent a:hover {
color: #20c5ad;
}
footer #footerContent a svg {
fill: #b3b3b3;
max-width: 30px;
transition: fill 0.2s;
margin-left: 10px;
display: inline;
}
footer #footerContent a svg:hover {
fill: #20c5ad;
}
#blueBar {
height: 5px;
width: 100%;
background-color: #03a8f4;
}
#newestPost ul {
list-style-type: none;
padding-left: 0;
}
#newestPost li {
margin-bottom: 10px;
}
#content {
background-color: #1a2332;
padding: 20px 20%;
}
#content img {
max-width: 40%;
}
article {
border: 2px solid #20c5ad;
border-radius: 20px;
padding: 10px;
margin-right: 10px;
flex: 1 1 0;
width: 0;
box-sizing: border-box;
}
article h2 {
text-align: center;
margin: 0;
}
article:last-child {
margin-right: 0;
}
#blog {
width: 100%;
display: flex;
justify-content: center;
align-items: stretch;
}
#banner img {
max-width: 100% !important;
}
.breakWord {
word-wrap: break-word;
}
.clickSpan {
color: #20c5ad;
text-decoration: underline;
transition: background-color 0.2s linear;
cursor: pointer;
}
.clickSpan:hover {
color: #1caf9a;
}
#matomo-iframe {
border: 0;
height: 200px;
width: 600px;
background-color: #b3b3b3;
}
@media only screen and (max-width: 700px) {
#homeImage {
float: none;
}
#content {
padding-left: 10px;
padding-right: 10px;
}
#blog {
flex-direction: column;
}
article {
margin-bottom: 10px;
margin-right: 0;
}
#banner a {
display: block;
}
#banner img {
max-width: none;
width: 100%;
}
#newestPost {
display: none;
}
article {
width: 100%;
}
.h-captcha {
width: 100%;
}
.h-captcha iframe {
max-width: 100%;
}
.header-homepage {
padding-top: 50px;
padding-bottom: 100px;
}
.header-homepage h1 {
font-size: 2.2em;
}
#footerContent {
width: 100% !important;
display: block !important;
}
#footerContent div {
border-bottom: #3d3d3d 1px solid;
border-right: none !important;
}
#footerContent div:last-child {
border-bottom: none;
}
}
#burgermenu {
position: absolute;
top: 10px;
right: 10px;
display: none;
cursor: pointer;
}
#burgermenu .bar1,
#burgermenu .bar2,
#burgermenu .bar3 {
width: 35px;
height: 5px;
background-color: #b3b3b3;
margin: 6px 0;
transition: 0.4s;
}
#burgermenu.change .bar1 {
-webkit-transform: rotate(-45deg) translate(-9px, 6px);
transform: rotate(-45deg) translate(-9px, 6px);
}
#burgermenu.change .bar2 {
opacity: 0;
}
#burgermenu.change .bar3 {
-webkit-transform: rotate(45deg) translate(-8px, -8px);
transform: rotate(45deg) translate(-8px, -8px);
}
@media only screen and (max-width: 700px) {
#burgermenu {
display: inline-block;
}
.visible {
display: inline-grid !important;
}
.mainmenuContainer {
display: none;
text-align: left !important;
background-color: #171e2b;
width: 100% !important;
}
.mainmenuContainer a {
text-align: left !important;
border-bottom: #111721 solid 2px;
width: 100% !important;
}
.mainmenuContainer .dropdown-content {
display: block;
position: relative;
left: 0;
transform: none;
width: 100%;
}
.mainmenuContainer .dropdown-content a {
padding-left: 40px !important;
border-bottom: #111721 solid 2px;
}
#mainmenu {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
}
}
@media only screen and (max-width: 300px) {
#footerContent {
flex-direction: column;
}
#footerContent div {
border-bottom: #3d3d3d 1px solid;
}
}
.abuseIpImg {
width: 391px;
background: #35c246 linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0.3) 50%, rgba(0,0,0,0.2) 51%, rgba(0,0,0,0));
padding: 5px;
}
#banner a {
text-decoration: none;
}
#homeImage {
float: left;
margin-right: 20px;
box-shadow: 7px 7px #111721;
}
code[class*="language-"],
pre[class*="language-"] {
color: #ccc;
background: #111721;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
font-size: 1em;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"] {
padding: 1em;
margin: 0.5em 0;
overflow: auto;
}
:not(pre) > code[class*="language-"] {
padding: 0.1em;
border-radius: 0.3em;
white-space: normal;
}
.token.comment,
.token.block-comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: #999;
}
.token.punctuation {
color: #ccc;
}
.token.tag,
.token.attr-name,
.token.namespace,
.token.deleted {
color: #e2777a;
}
.token.function-name {
color: #6196cc;
}
.token.boolean,
.token.number,
.token.function {
color: #f08d49;
}
.token.property,
.token.class-name,
.token.constant,
.token.symbol {
color: #f8c555;
}
.token.selector,
.token.important,
.token.atrule,
.token.keyword,
.token.builtin {
color: #cc99cd;
}
.token.string,
.token.char,
.token.attr-value,
.token.regex,
.token.variable {
color: #7ec699;
}
.token.operator,
.token.entity,
.token.url {
color: #67cdcc;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}
.token.inserted {
color: #008000;
}
pre[class*="language-"].line-numbers {
position: relative;
padding-left: 3.8em;
counter-reset: linenumber;
}
pre[class*="language-"].line-numbers > code {
position: relative;
white-space: inherit;
}
.line-numbers .line-numbers-rows {
position: absolute;
pointer-events: none;
top: 0;
font-size: 100%;
left: -3.8em;
width: 3em; /* works for line-numbers below 1000 lines */
letter-spacing: -1px;
border-right: 1px solid #999;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.line-numbers-rows > span {
display: block;
counter-increment: linenumber;
}
.line-numbers-rows > span:before {
content: counter(linenumber);
color: #999;
display: block;
padding-right: 0.8em;
text-align: right;
}
.token a {
color: inherit;
}
jl-selling-table table {
border-collapse: collapse;
width: 100%;
}
jl-selling-table td,
jl-selling-table th {
text-align: left;
padding: 8px;
}
jl-selling-table tr:nth-child(even) {
background-color: #111721;
}
.skills {
max-height: 80px;
}
.basicLightbox {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0,0,0,0.8);
opacity: 0.01;
transition: opacity 0.4s false ease false;
z-index: 1000 false;
will-change: opacity;
}
.basicLightbox--visible {
opacity: 1;
}
.basicLightbox__placeholder {
max-width: 100%;
transform: scale(0.9);
transition: transform 0.4s false ease false;
z-index: 1;
will-change: transform;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child,
.basicLightbox__placeholder > iframe:first-child:last-child {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
max-width: 95%;
max-height: 95%;
}
.basicLightbox__placeholder > video:first-child:last-child,
.basicLightbox__placeholder > iframe:first-child:last-child {
pointer-events: auto;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
width: auto;
height: auto;
}
.basicLightbox--img .basicLightbox__placeholder,
.basicLightbox--video .basicLightbox__placeholder,
.basicLightbox--iframe .basicLightbox__placeholder {
width: 100%;
height: 100%;
pointer-events: none;
}
.basicLightbox--visible .basicLightbox__placeholder {
transform: scale(1);
}
jl-pwgen input[type="text"] {
background-color: #1a2332;
color: #b3b3b3;
border: solid #111721;
border-radius: 5px;
padding: 5px;
width: 100%;
}
jl-pwgen input,
jl-pwgen button {
margin-top: 5px;
}

View file

@ -1 +0,0 @@
{"version":3,"sourceRoot":"","sources":["../../scss/_general.scss","../../scss/_colorMixer.scss","../../scss/_var.scss","../../scss/_menu.scss","../../scss/_normalize.scss","../../scss/_ntp.scss","../../scss/_header.scss","../../scss/_cookieinfo.scss","../../scss/_comments.scss","../../scss/_footer.scss","../../scss/_content.scss","../../scss/_mobile.scss","../../scss/_menuMobile.scss","../../scss/_mobileSmall.scss","../../scss/_home.scss","../../scss/_prism.scss","../../scss/_sellingTable.scss","../../node_modules/basiclightbox/src/styles/main.scss"],"names":[],"mappings":"AAAA,KACI,uBAGJ,KACI,SACA,iBCNW,QDOX,MENS,QFOT,yCACA,uBACA,YAGJ,OACI,iBEXW,QFYX,WACA,yBACA,SACA,YACA,eACA,kBACA,uCACA,wCAGI,iBCvBS,QDwBT,aAIR,QACI,WAGJ,EACI,UACA,MEjCW,QFkCX,0BACA,qBACA,QACI,MCtCS,QD0CjB,aACI,qBAGJ,GACI,ME/CU,KFgDV,yBAGJ,KACI,UAGJ,QACI,kBAGJ,MACI,gBAGJ,OACI,gBAGJ,OACI,mBACA,kBAGJ,IACI,cEjEkB,IFkElB,cACI,gBG7ER,UACI,kBACA,SACA,YACA,aACA,uBACA,yBACA,WACA,YACI,WACA,kBACA,kBACA,qBACA,qBAIR,UACI,qBACA,kBAGJ,kBACI,kBACA,aACA,kBACA,SACA,2BACA,oBACI,iBF5BO,QE6BP,gCACA,WACA,MD/BK,QCgCL,uCACA,kCACI,uBD1BY,KC2BZ,wBD3BY,KC6BhB,iCACI,mBACA,0BD/BY,KCgCZ,2BDhCY,KCkChB,0BACI,iBF5CG,QEiDf,eACI,qBAIA,yBACI,qBAEJ,kCACI,cAIR,cACI,qCAGJ,0CACI,UACI,YCpER,4EAUA,KACE,iBACA,8BAUF,KACE,SAOF,KACE,cAQF,GACE,cACA,eAWF,GACE,uBACA,SACA,iBAQF,IACE,gCACA,cAUF,EACE,6BAQF,YACE,mBACA,0BACA,iCAOF,SAEE,mBAQF,cAGE,gCACA,cAOF,MACE,cAQF,QAEE,cACA,cACA,kBACA,wBAGF,IACE,eAGF,IACE,WAUF,IACE,kBAWF,sCAKE,oBACA,eACA,iBACA,SAQF,aAEE,iBAQF,cAEE,oBAOF,gDAIE,0BAOF,wHAIE,kBACA,UAOF,4GAIE,8BAOF,SACE,2BAUF,OACE,sBACA,cACA,cACA,eACA,UACA,mBAOF,SACE,wBAOF,SACE,cAQF,6BAEE,sBACA,UAOF,kFAEE,YAQF,cACE,6BACA,oBAOF,yCACE,wBAQF,6BACE,0BACA,aAUF,QACE,cAOF,QACE,kBAUF,SACE,aAOF,SACE,aC3VF,gBACI,mBAGJ,WACI,gBACA,cACA,WACA,aACA,iBJRW,QISX,eAGJ,YACI,WACA,aACA,aACA,iBJhBW,QImBf,SACI,cCrBJ,yBACI,sBAEJ,iBACE,0HACA,sBACA,kBACA,WACA,UACA,kBACA,qBAEA,oBACE,WACA,kBACA,gBACA,gBAIJ,yBACE,kBACA,YACA,OACA,WACA,2CACE,yBACA,YACA,KJ5BS,QIgCb,gBACE,kBCjCF,YACE,eACA,OACA,QACA,YACA,gBACA,mBACA,iBACA,iBACA,qCACA,eACA,kBACA,SACA,UACA,iBNba,QMcb,MLdW,QKeX,yBAIF,kBACE,YACA,cACA,gBACA,gBACA,gBACA,kBACA,eACA,iBLzBa,QK0Bb,WACA,kBAEA,wBACE,iBN/Ba,QMmCjB,iBACE,cACA,oBAGF,iBACE,qBACA,MLzCa,QK2Cb,uBACE,MN7Ca,QOCb,iDACE,WACA,iBNLO,QMMP,MNLO,QMMP,qBACA,kBACA,YAGF,6DACE,aAGF,0BACE,gBAGF,oCACE,iBNlBS,QMmBT,WACA,yBACA,aACA,eACA,eACA,UACA,SACA,uCAEA,0CACE,iBP9BS,QOoCjB,SACE,aACA,aACE,kBACA,YACA,aAIJ,cACE,kBAGF,gBACE,aACA,uBACA,sBACA,mBACA,iBAGF,aACE,SACA,WAGF,UACE,eAGF,WACE,iBNlEa,QMmEb,WACA,yBACA,aACA,eACA,eACA,UACA,SACA,uCACA,WACA,gBC/EF,OACE,aACA,uBACA,sBACA,SACE,qBAIF,sBACE,UACA,aACA,uBACA,cAEA,0BACE,+BACA,aACA,gBAEA,qCACE,kBAIJ,yBACE,aAGF,wBACE,MP7BO,QO8BP,qBAEA,8BACE,MP/BO,QOmCX,4BACE,KPtCO,QOuCP,eACA,oBACA,iBACA,eAEA,kCACE,KP3CO,QOiDf,SACE,WACA,WACA,iBPnDyB,QOuDzB,eACE,qBACA,eAEF,eACE,mBChEJ,SACE,iBRDW,QQEX,iBACA,aACE,cAIJ,QACE,yBACA,mBACA,aACA,kBACA,WACA,QACA,sBACA,WACE,kBACA,SAGF,mBACE,eAIJ,MACE,WACA,aACA,uBACA,oBAGF,YACE,0BAEF,WACE,qBAGF,WACE,MRtCa,QQuCb,0BACA,uCACA,eAEA,iBACE,MT7Ca,QSiDjB,eACE,SACA,aACA,YACA,iBRtDW,QSDb,0CACE,WACE,WAEF,SACE,kBACA,mBAEF,MACE,sBAEF,QACE,mBACA,eAGA,UACE,cAEF,YACE,eACA,WAIJ,YACE,aAGF,QACE,WAEF,WACE,WACA,kBACE,eAIJ,iBACE,iBACA,qBAEA,oBACE,gBAIJ,eACE,sBACA,yBAEA,mBACE,gCACA,6BAEA,8BACE,oBCzDR,YACE,kBACA,SACA,WACA,aACA,eAEA,sDACE,WACA,WACA,iBVTS,QUUT,aACA,eAEF,yBACE,sDACA,8CAGF,mCAEA,yBACE,sDACA,8CAIJ,0CACE,YACE,qBAGF,SACE,+BAGF,mBACE,aAEA,2BACA,iBXvCW,QWwCX,sBAEA,qBACE,2BACA,gCACA,sBAGF,qCACE,cACA,kBACA,OACA,eACA,WACA,uCACE,6BACA,gCAIN,UACE,cACA,kBACA,MACA,OACA,SClEJ,0CACE,eACE,sBACA,mBACE,iCCJN,YACE,YACA,mIACA,YAGF,UACE,qBAGF,WACE,WACA,kBACA,2BCLD,6CAEC,WACA,WdXa,QcYb,kEACA,cACA,gBACA,gBACA,oBACA,kBACA,iBACA,gBAEA,gBACA,cACA,WAEA,qBACA,kBACA,iBACA,aAKD,sBACC,YACA,cACA,cAKD,iCACC,aACA,mBACA,mBAGD,8EAKC,WAGD,mBACC,WAGD,4DAIC,cAGD,qBACC,cAGD,6CAGC,cAGD,gEAIC,cAGD,6EAKC,cAGD,yEAKC,cAGD,yCAGC,cAGD,6BAEC,iBAED,cACC,kBAGD,cACC,YAGD,gBACC,YAGD,mCACC,kBACA,mBACA,yBAGD,wCACC,kBACA,oBAGD,iCACC,kBACA,oBACA,MACA,eACA,YACA,UACA,oBACA,4BAEA,yBACA,sBACA,qBACA,iBAIA,wBACC,cACA,6BAGA,+BACC,4BACA,WACA,cACA,mBACA,iBAGH,SACC,cClKE,uBACI,yBACA,WAGF,wCAEE,gBACA,YAGF,oCACE,iBfbO,QgBOf,eAEC,eACA,aACA,uBACA,mBACA,MACA,OACA,WACA,aACA,WAhB2B,eAiB3B,YACA,4BACA,QAlBuB,KAmBvB,oBAEA,wBACC,UAGD,4BACC,eACA,qBACA,8BACA,UACA,sBAEA,0KAGC,cACA,kBACA,MACA,QACA,SACA,OACA,YACA,cACA,eAGD,mHAEC,oBAGD,gHAEC,WACA,YAIF,qJAGC,WACA,YACA,oBAGD,oDACC","file":"style.css"}

View file

@ -1,3 +1,5 @@
@use "lib/_var";
$back-color-2 = darken($back-color, $darker-color); $back-color-2 = darken($back-color, $darker-color);
$back-color-3 = darken($back-color, $darker-color-2); $back-color-3 = darken($back-color, $darker-color-2);
$accent-color-2 = darken($accent-color, $darker-color); $accent-color-2 = darken($accent-color, $darker-color);

View file

@ -1,3 +1,5 @@
@use "lib/_var";
@use "lib/_colorMixer";
#newComment { #newComment {
form { form {

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
#content{ #content{
background-color: $back-color; background-color: $back-color;
padding: 20px 20%; padding: 20px 20%;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
.cookieinfo{ .cookieinfo{
position: fixed; position: fixed;
left: 0; left: 0;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
footer{ footer{
display: flex; display: flex;
justify-content: center; justify-content: center;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
html { html {
scroll-behavior: smooth; scroll-behavior: smooth;
} }

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
.header-wrapper *:before { .header-wrapper *:before {
box-sizing: border-box; box-sizing: border-box;
} }

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
.abuseIpImg{ .abuseIpImg{
width: 391px; width: 391px;
background: #35c246 linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.3) 50%, rgba(0,0,0,.2) 51%, rgba(0,0,0,0)); background: #35c246 linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.3) 50%, rgba(0,0,0,.2) 51%, rgba(0,0,0,0));

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
#mainmenu { #mainmenu {
position: absolute; position: absolute;
top: 20px; top: 20px;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
#burgermenu { #burgermenu {
position: absolute; position: absolute;
top: 10px; top: 10px;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
@media only screen and (max-width: $mobile-max-width) { @media only screen and (max-width: $mobile-max-width) {
#homeImage{ #homeImage{
float: none; float: none;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
@media only screen and (max-width: $small-mobile-max-width) { @media only screen and (max-width: $small-mobile-max-width) {
#footerContent{ #footerContent{
flex-direction: column; flex-direction: column;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
.js-plotly-plot { .js-plotly-plot {
margin-bottom: 10px; margin-bottom: 10px;
} }

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
jl-pwgen { jl-pwgen {
input[type="text"] { input[type="text"] {
background-color: #1a2332; background-color: #1a2332;

View file

@ -1,3 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
jl-selling-table { jl-selling-table {
table { table {
border-collapse: collapse; border-collapse: collapse;

View file

@ -0,0 +1,6 @@
@use "lib/_var";
@use "lib/_colorMixer";
.skills {
max-height: 80px;
}

16
src/scss/lib/_var.scss Normal file
View file

@ -0,0 +1,16 @@
$back-color: #1a2332;
$text-color: #b3b3b3;
$title-color: #fff;
$accent-color: #20c5ad;
$content-footer-div-color: #03A8F4;
$darker-color: 5;
$darker-color-2: 2;
$border-radius-sub-nav: 10px;
$border-radius-image: 5px;
$mobile-max-width: 700px;
$small-mobile-max-width: 300px;
$link-hover-animation-time: 0.2s;

20
src/scss/style.scss Normal file
View file

@ -0,0 +1,20 @@
@use "lib/_var";
@use "lib/_colorMixer";
@use "lib/_general";
@use "lib/_menu";
@use "lib/_normalize";
@use "lib/_ntp";
@use "lib/_header";
@use "lib/_cookieinfo";
@use "lib/_comments";
@use "lib/_footer";
@use "lib/_content";
@use "lib/_mobile";
@use "lib/_menuMobile";
@use "lib/_mobileSmall";
@use "lib/_home";
@use "lib/_prism";
@use "lib/_sellingTable";
@use "lib/_skills";
@use "lib/_basicLightbox"
@use "lib/_pwgen";

View file

@ -1,73 +0,0 @@
// Vars ---------------------------------------------------------------- //
$basicLightbox__background= rgba(0, 0, 0, .8);
$basicLightbox__zIndex= 1000 !default;
$basicLightbox__duration= .4s !default;
$basicLightbox__timing= ease !default;
// basicLightbox ------------------------------------------------------- //
.basicLightbox {
position: fixed;
display: flex;
justify-content: center;
align-items: center;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: $basicLightbox__background;
opacity: .01; // Start with .01 to avoid the repaint that happens from 0 to .01
transition: opacity $basicLightbox__duration $basicLightbox__timing;
z-index: $basicLightbox__zIndex;
will-change: opacity;
&--visible {
opacity: 1;
}
&__placeholder {
max-width: 100%;
transform: scale(.9);
transition: transform $basicLightbox__duration $basicLightbox__timing;
z-index: 1;
will-change: transform;
> img:first-child:last-child,
> video:first-child:last-child,
> iframe:first-child:last-child {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
max-width: 95%;
max-height: 95%;
}
> video:first-child:last-child,
> iframe:first-child:last-child {
pointer-events: auto;
}
> img:first-child:last-child,
> video:first-child:last-child {
width: auto;
height: auto;
}
}
&--img &__placeholder,
&--video &__placeholder,
&--iframe &__placeholder {
width: 100%;
height: 100%;
pointer-events: none;
}
&--visible &__placeholder {
transform: scale(1);
}
}

View file

@ -1,3 +0,0 @@
.skills {
max-height: 80px;
}

View file

@ -1,16 +0,0 @@
$back-color= #1a2332;
$text-color= #b3b3b3;
$title-color= #fff;
$accent-color= #20c5ad;
$content-footer-div-color= #03A8F4;
$darker-color= 5;
$darker-color-2= 2;
$border-radius-sub-nav= 10px;
$border-radius-image= 5px;
$mobile-max-width= 700px;
$small-mobile-max-width= 300px;
$link-hover-animation-time= 0.2s;

View file

@ -1,20 +0,0 @@
@import "lib/_var";
@import "lib/_colorMixer";
@import "lib/_general";
@import "lib/_menu";
@import "lib/_normalize";
@import "lib/_ntp";
@import "lib/_header";
@import "lib/_cookieinfo";
@import "lib/_comments";
@import "lib/_footer";
@import "lib/_content";
@import "lib/_mobile";
@import "lib/_menuMobile";
@import "lib/_mobileSmall";
@import "lib/_home";
@import "lib/_prism";
@import "lib/_sellingTable";
@import "lib/_skills";
@import "lib/_basicLightbox"
@import "lib/_pwgen";