minor adjustments

This commit is contained in:
array-in-a-matrix 2021-07-16 20:22:59 -04:00
parent 0de4bdf10c
commit 627d6acf4d
3 changed files with 365 additions and 369 deletions

View file

@ -15,7 +15,11 @@
<body data-new-gr-c-s-check-loaded="8.872.0" data-gr-ext-installed> <body data-new-gr-c-s-check-loaded="8.872.0" data-gr-ext-installed>
<header class="page-header"> <header class="page-header">
<h1 class="project-name">Array in a Matrix</h1> <h1 class="project-name">
<span class="larger-name">A</span
><span class="smaller-name">RRAY IN A MATRI</span
><span class="larger-name">X</span>
</h1>
<h2 class="project-tagline">Welcome!</h2> <h2 class="project-tagline">Welcome!</h2>
<nav> <nav>
<a href="https://github.com/array-in-a-matrix" class="btn" <a href="https://github.com/array-in-a-matrix" class="btn"
@ -36,7 +40,7 @@
Website skeleton taken from the Website skeleton taken from the
<a href="https://github.com/pages-themes/cayman">Cayman theme</a>. <a href="https://github.com/pages-themes/cayman">Cayman theme</a>.
</p> </p>
<h2>My projects</h2> <h2>Projects</h2>
<p>You can access and use my projects below.</p> <p>You can access and use my projects below.</p>
<table> <table>
<thead> <thead>
@ -75,7 +79,7 @@
</tbody> </tbody>
</table> </table>
<footer class="site-footer"> <footer class="site-footer">
<span class="site-footer-credits">This page is work-in-progress.</span> <div class="site-footer-credits">This page is work-in-progress.</div>
</footer> </footer>
</main> </main>
</body> </body>

View file

@ -1,23 +1,7 @@
let random_theme = [ let random_theme = [
// ["#ff8008", "#ffc837"], //orange ["#c31432", "#240b36"],
// ["#4A00E0", "#8E2DE2"], //purple ["#ad5389", "#3c1053"],
// ["#FF512F", "#F09819"], //orange ["#2e1c30", "#937898"],
// ["#FF5F6D", "#FFC371"], //pink
// ["#FF416C", "#FF4B2B"], //pink-orange
// ["#ee0979", "#ff6a00"], //pink-orange
// ["#ec008c", "#fc6767"], //pink
// ["#f857a6", "#ff5858"], //pink
// ["#00c3ff", "#ffff1c"], //blue-lime
// ["#e1eec3", "#f05053"], // white-pink
// ["#5433FF", "#20BDFF"], //ugly blue
// ["#00c6ff", "#0072ff"], //light blue
// ["#4e54c8", "#8f94fb"], //purple
["#396afc", "#2948ff"], //? blue
["#673AB7", "#512DA8"], //dark purple
// ["#4776E6", "#8E54E9"], //purple
// ["#DA22FF", "#9733EE"], // violet
["#c31432", "#240b36"], //? red
["#ad5389", "#3c1053"], //? purple
]; ];
function rand(items) { function rand(items) {

328
style.css
View file

@ -1,11 +1,12 @@
/*! normalize.css v3.0.2 | MIT License | git.io/normalize */@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,700"); /*! normalize.css v3.0.2 | MIT License | git.io/normalize */
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,700");
html { html {
font-family: sans-serif; font-family: sans-serif;
-ms-text-size-adjust: 100%; -ms-text-size-adjust: 100%;
-webkit-text-size-adjust:100% -webkit-text-size-adjust: 100%;
} }
body { body {
margin:0 margin: 0;
} }
article, article,
aside, aside,
@ -20,86 +21,86 @@ menu,
nav, nav,
section, section,
summary { summary {
display:block display: block;
} }
audio, audio,
canvas, canvas,
progress, progress,
video { video {
display: inline-block; display: inline-block;
vertical-align:baseline vertical-align: baseline;
} }
audio:not([controls]) { audio:not([controls]) {
display: none; display: none;
height:0 height: 0;
} }
[hidden], [hidden],
template { template {
display:none display: none;
} }
a { a {
background-color:transparent background-color: transparent;
} }
a:active, a:active,
a:hover { a:hover {
outline:0 outline: 0;
} }
abbr[title] { abbr[title] {
border-bottom:1px dotted border-bottom: 1px dotted;
} }
b, b,
strong { strong {
font-weight:bold font-weight: bold;
} }
dfn { dfn {
font-style:italic font-style: italic;
} }
h1 { h1 {
font-size: 2em; font-size: 2em;
margin:0.67em 0 margin: 0.67em 0;
} }
mark { mark {
background: #ff0; background: #ff0;
color:#000 color: #000;
} }
small { small {
font-size:80% font-size: 80%;
} }
sub, sub,
sup { sup {
font-size: 75%; font-size: 75%;
line-height: 0; line-height: 0;
position: relative; position: relative;
vertical-align:baseline vertical-align: baseline;
} }
sup { sup {
top:-0.5em top: -0.5em;
} }
sub { sub {
bottom:-0.25em bottom: -0.25em;
} }
img { img {
border:0 border: 0;
} }
svg:not(:root) { svg:not(:root) {
overflow:hidden overflow: hidden;
} }
figure { figure {
margin:1em 40px margin: 1em 40px;
} }
hr { hr {
box-sizing: content-box; box-sizing: content-box;
height:0 height: 0;
} }
pre { pre {
overflow:auto overflow: auto;
} }
code, code,
kbd, kbd,
pre, pre,
samp { samp {
font-family: monospace, monospace; font-family: monospace, monospace;
font-size:1em font-size: 1em;
} }
button, button,
input, input,
@ -108,293 +109,293 @@ select,
textarea { textarea {
color: inherit; color: inherit;
font: inherit; font: inherit;
margin:0 margin: 0;
} }
button { button {
overflow:visible overflow: visible;
} }
button, button,
select { select {
text-transform:none text-transform: none;
} }
button, button,
html input[type="button"], html input[type="button"],
input[type="reset"], input[type="reset"],
input[type="submit"] { input[type="submit"] {
-webkit-appearance: button; -webkit-appearance: button;
cursor:pointer cursor: pointer;
} }
button[disabled], button[disabled],
html input[disabled] { html input[disabled] {
cursor:default cursor: default;
} }
button::-moz-focus-inner, button::-moz-focus-inner,
input::-moz-focus-inner { input::-moz-focus-inner {
border: 0; border: 0;
padding:0 padding: 0;
} }
input { input {
line-height:normal line-height: normal;
} }
input[type="checkbox"], input[type="checkbox"],
input[type="radio"] { input[type="radio"] {
box-sizing: border-box; box-sizing: border-box;
padding:0 padding: 0;
} }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { input[type="number"]::-webkit-outer-spin-button {
height:auto height: auto;
} }
input[type="search"] { input[type="search"] {
-webkit-appearance: textfield; -webkit-appearance: textfield;
box-sizing:content-box box-sizing: content-box;
} }
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration { input[type="search"]::-webkit-search-decoration {
-webkit-appearance:none -webkit-appearance: none;
} }
fieldset { fieldset {
border: 1px solid #c0c0c0; border: 1px solid #c0c0c0;
margin: 0 2px; margin: 0 2px;
padding:0.35em 0.625em 0.75em padding: 0.35em 0.625em 0.75em;
} }
legend { legend {
border: 0; border: 0;
padding:0 padding: 0;
} }
textarea { textarea {
overflow:auto overflow: auto;
} }
optgroup { optgroup {
font-weight:bold font-weight: bold;
} }
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing:0 border-spacing: 0;
} }
td, td,
th { th {
padding:0 padding: 0;
} }
.highlight table td { .highlight table td {
padding:5px padding: 5px;
} }
.highlight table pre { .highlight table pre {
margin:0 margin: 0;
} }
.highlight .cm { .highlight .cm {
color: #999988; color: #999988;
font-style:italic font-style: italic;
} }
.highlight .cp { .highlight .cp {
color: #999999; color: #999999;
font-weight:bold font-weight: bold;
} }
.highlight .c1 { .highlight .c1 {
color: #999988; color: #999988;
font-style:italic font-style: italic;
} }
.highlight .cs { .highlight .cs {
color: #999999; color: #999999;
font-weight: bold; font-weight: bold;
font-style:italic font-style: italic;
} }
.highlight .c, .highlight .c,
.highlight .cd { .highlight .cd {
color: #999988; color: #999988;
font-style:italic font-style: italic;
} }
.highlight .err { .highlight .err {
color: #a61717; color: #a61717;
background-color:#e3d2d2 background-color: #e3d2d2;
} }
.highlight .gd { .highlight .gd {
color: #000000; color: #000000;
background-color:#ffdddd background-color: #ffdddd;
} }
.highlight .ge { .highlight .ge {
color: #000000; color: #000000;
font-style:italic font-style: italic;
} }
.highlight .gr { .highlight .gr {
color:#aa0000 color: #aa0000;
} }
.highlight .gh { .highlight .gh {
color:#999999 color: #999999;
} }
.highlight .gi { .highlight .gi {
color: #000000; color: #000000;
background-color:#ddffdd background-color: #ddffdd;
} }
.highlight .go { .highlight .go {
color:#888888 color: #888888;
} }
.highlight .gp { .highlight .gp {
color:#555555 color: #555555;
} }
.highlight .gs { .highlight .gs {
font-weight:bold font-weight: bold;
} }
.highlight .gu { .highlight .gu {
color:#aaaaaa color: #aaaaaa;
} }
.highlight .gt { .highlight .gt {
color:#aa0000 color: #aa0000;
} }
.highlight .kc { .highlight .kc {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .kd { .highlight .kd {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .kn { .highlight .kn {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .kp { .highlight .kp {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .kr { .highlight .kr {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .kt { .highlight .kt {
color: #445588; color: #445588;
font-weight:bold font-weight: bold;
} }
.highlight .k, .highlight .k,
.highlight .kv { .highlight .kv {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .mf { .highlight .mf {
color:#009999 color: #009999;
} }
.highlight .mh { .highlight .mh {
color:#009999 color: #009999;
} }
.highlight .il { .highlight .il {
color:#009999 color: #009999;
} }
.highlight .mi { .highlight .mi {
color:#009999 color: #009999;
} }
.highlight .mo { .highlight .mo {
color:#009999 color: #009999;
} }
.highlight .m, .highlight .m,
.highlight .mb, .highlight .mb,
.highlight .mx { .highlight .mx {
color:#009999 color: #009999;
} }
.highlight .sb { .highlight .sb {
color:#d14 color: #d14;
} }
.highlight .sc { .highlight .sc {
color:#d14 color: #d14;
} }
.highlight .sd { .highlight .sd {
color:#d14 color: #d14;
} }
.highlight .s2 { .highlight .s2 {
color:#d14 color: #d14;
} }
.highlight .se { .highlight .se {
color:#d14 color: #d14;
} }
.highlight .sh { .highlight .sh {
color:#d14 color: #d14;
} }
.highlight .si { .highlight .si {
color:#d14 color: #d14;
} }
.highlight .sx { .highlight .sx {
color:#d14 color: #d14;
} }
.highlight .sr { .highlight .sr {
color:#009926 color: #009926;
} }
.highlight .s1 { .highlight .s1 {
color:#d14 color: #d14;
} }
.highlight .ss { .highlight .ss {
color:#990073 color: #990073;
} }
.highlight .s { .highlight .s {
color:#d14 color: #d14;
} }
.highlight .na { .highlight .na {
color:#008080 color: #008080;
} }
.highlight .bp { .highlight .bp {
color:#999999 color: #999999;
} }
.highlight .nb { .highlight .nb {
color:#0086B3 color: #0086b3;
} }
.highlight .nc { .highlight .nc {
color: #445588; color: #445588;
font-weight:bold font-weight: bold;
} }
.highlight .no { .highlight .no {
color:#008080 color: #008080;
} }
.highlight .nd { .highlight .nd {
color: #3c5d5d; color: #3c5d5d;
font-weight:bold font-weight: bold;
} }
.highlight .ni { .highlight .ni {
color:#800080 color: #800080;
} }
.highlight .ne { .highlight .ne {
color: #990000; color: #990000;
font-weight:bold font-weight: bold;
} }
.highlight .nf { .highlight .nf {
color: #990000; color: #990000;
font-weight:bold font-weight: bold;
} }
.highlight .nl { .highlight .nl {
color: #990000; color: #990000;
font-weight:bold font-weight: bold;
} }
.highlight .nn { .highlight .nn {
color:#555555 color: #555555;
} }
.highlight .nt { .highlight .nt {
color:#000080 color: #000080;
} }
.highlight .vc { .highlight .vc {
color:#008080 color: #008080;
} }
.highlight .vg { .highlight .vg {
color:#008080 color: #008080;
} }
.highlight .vi { .highlight .vi {
color:#008080 color: #008080;
} }
.highlight .nv { .highlight .nv {
color:#008080 color: #008080;
} }
.highlight .ow { .highlight .ow {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .o { .highlight .o {
color: #000000; color: #000000;
font-weight:bold font-weight: bold;
} }
.highlight .w { .highlight .w {
color:#bbbbbb color: #bbbbbb;
} }
.highlight { .highlight {
background-color:#f8f8f8 background-color: #f8f8f8;
} }
* { * {
box-sizing:border-box box-sizing: border-box;
} }
body { body {
padding: 0; padding: 0;
@ -402,14 +403,14 @@ body {
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
color:#606c71 color: #606c71;
} }
a { a {
color: #1e6bb8; color: #1e6bb8;
text-decoration:none text-decoration: none;
} }
a:hover { a:hover {
text-decoration:underline text-decoration: underline;
} }
.btn { .btn {
display: inline-block; display: inline-block;
@ -420,26 +421,26 @@ a:hover {
border-style: solid; border-style: solid;
border-width: 1px; border-width: 1px;
border-radius: 0.3rem; border-radius: 0.3rem;
transition:color 0.2s, background-color 0.2s, border-color 0.2s transition: color 0.2s, background-color 0.2s, border-color 0.2s;
} }
.btn:hover { .btn:hover {
color: rgba(255, 255, 255, 0.8); color: rgba(255, 255, 255, 0.8);
text-decoration: none; text-decoration: none;
background-color: rgba(255, 255, 255, 0.2); background-color: rgba(255, 255, 255, 0.2);
border-color:rgba(255,255,255,0.3) border-color: rgba(255, 255, 255, 0.3);
} }
.btn + .btn { .btn + .btn {
margin-left:1rem margin-left: 1rem;
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.btn { .btn {
padding:0.75rem 1rem padding: 0.75rem 1rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.btn { .btn {
padding: 0.6rem 0.9rem; padding: 0.6rem 0.9rem;
font-size:0.9rem font-size: 0.9rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
@ -447,16 +448,16 @@ a:hover {
display: block; display: block;
width: 100%; width: 100%;
padding: 0.75rem; padding: 0.75rem;
font-size:0.9rem font-size: 0.9rem;
} }
.btn + .btn { .btn + .btn {
margin-top: 1rem; margin-top: 1rem;
margin-left:0 margin-left: 0;
} }
} }
:root { :root {
--left: #4A00E0; --left: #4a00e0;
--right: #8E2DE2; --right: #8e2de2;
} }
.page-header { .page-header {
color: #fff; color: #fff;
@ -469,86 +470,87 @@ a:hover {
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.page-header { .page-header {
padding:5rem 6rem padding: 5rem 6rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.page-header { .page-header {
padding:3rem 4rem padding: 3rem 4rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
.page-header { .page-header {
padding:2rem 1rem padding: 2rem 1rem;
} }
} }
.project-name { .project-name {
margin-top: 0; margin-top: 0;
margin-bottom:0.1rem margin-bottom: 0.1rem;
font-family: Cambria, "Hoefler Text", Utopia, "Liberation Serif", "Nimbus Roman No9 L Regular", Times, "Times New Roman", serif;
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.project-name { .project-name {
font-size:3.25rem font-size: 3.25rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.project-name { .project-name {
font-size:2.25rem font-size: 2.25rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
.project-name { .project-name {
font-size:1.75rem font-size: 1.75rem;
} }
} }
.project-tagline { .project-tagline {
margin-bottom: 2rem; margin-bottom: 2rem;
font-weight: normal; font-weight: normal;
opacity:0.7 opacity: 0.7;
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.project-tagline { .project-tagline {
font-size:1.25rem font-size: 1.25rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.project-tagline { .project-tagline {
font-size:1.15rem font-size: 1.15rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
.project-tagline { .project-tagline {
font-size:1rem font-size: 1rem;
} }
} }
.main-content { .main-content {
word-wrap:break-word word-wrap: break-word;
} }
.main-content :first-child { .main-content :first-child {
margin-top:0 margin-top: 0;
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.main-content { .main-content {
max-width: 64rem; max-width: 64rem;
padding: 2rem 6rem; padding: 2rem 6rem;
margin: 0 auto; margin: 0 auto;
font-size:1.1rem font-size: 1.1rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.main-content { .main-content {
padding: 2rem 4rem; padding: 2rem 4rem;
font-size:1.1rem font-size: 1.1rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
.main-content { .main-content {
padding: 2rem 1rem; padding: 2rem 1rem;
font-size:1rem font-size: 1rem;
} }
} }
.main-content img { .main-content img {
max-width:100% max-width: 100%;
} }
.main-content h1, .main-content h1,
.main-content h2, .main-content h2,
@ -562,7 +564,7 @@ a:hover {
color: var(--left); color: var(--left);
} }
.main-content p { .main-content p {
margin-bottom:1em margin-bottom: 1em;
} }
.main-content code { .main-content code {
padding: 2px 4px; padding: 2px 4px;
@ -570,7 +572,7 @@ a:hover {
font-size: 0.9rem; font-size: 0.9rem;
color: #567482; color: #567482;
background-color: #f3f6fa; background-color: #f3f6fa;
border-radius:0.3rem border-radius: 0.3rem;
} }
.main-content pre { .main-content pre {
padding: 0.8rem; padding: 0.8rem;
@ -581,7 +583,7 @@ a:hover {
word-wrap: normal; word-wrap: normal;
background-color: #f3f6fa; background-color: #f3f6fa;
border: solid 1px #dce6f0; border: solid 1px #dce6f0;
border-radius:0.3rem border-radius: 0.3rem;
} }
.main-content pre > code { .main-content pre > code {
padding: 0; padding: 0;
@ -591,14 +593,14 @@ a:hover {
word-break: normal; word-break: normal;
white-space: pre; white-space: pre;
background: transparent; background: transparent;
border:0 border: 0;
} }
.main-content .highlight { .main-content .highlight {
margin-bottom:1rem margin-bottom: 1rem;
} }
.main-content .highlight pre { .main-content .highlight pre {
margin-bottom: 0; margin-bottom: 0;
word-break:normal word-break: normal;
} }
.main-content .highlight pre, .main-content .highlight pre,
.main-content pre { .main-content pre {
@ -607,7 +609,7 @@ a:hover {
font-size: 0.9rem; font-size: 0.9rem;
line-height: 1.45; line-height: 1.45;
border-radius: 0.3rem; border-radius: 0.3rem;
-webkit-overflow-scrolling:touch -webkit-overflow-scrolling: touch;
} }
.main-content pre code, .main-content pre code,
.main-content pre tt { .main-content pre tt {
@ -619,29 +621,29 @@ a:hover {
line-height: inherit; line-height: inherit;
word-wrap: normal; word-wrap: normal;
background-color: transparent; background-color: transparent;
border:0 border: 0;
} }
.main-content pre code:before, .main-content pre code:before,
.main-content pre code:after, .main-content pre code:after,
.main-content pre tt:before, .main-content pre tt:before,
.main-content pre tt:after { .main-content pre tt:after {
content:normal content: normal;
} }
.main-content ul, .main-content ul,
.main-content ol { .main-content ol {
margin-top:0 margin-top: 0;
} }
.main-content blockquote { .main-content blockquote {
padding: 0 1rem; padding: 0 1rem;
margin-left: 0; margin-left: 0;
color: #819198; color: #819198;
border-left:0.3rem solid #dce6f0 border-left: 0.3rem solid #dce6f0;
} }
.main-content blockquote > :first-child { .main-content blockquote > :first-child {
margin-top:0 margin-top: 0;
} }
.main-content blockquote > :last-child { .main-content blockquote > :last-child {
margin-bottom:0 margin-bottom: 0;
} }
.main-content table { .main-content table {
display: block; display: block;
@ -649,62 +651,62 @@ a:hover {
overflow: auto; overflow: auto;
word-break: normal; word-break: normal;
word-break: keep-all; word-break: keep-all;
-webkit-overflow-scrolling:touch -webkit-overflow-scrolling: touch;
} }
.main-content table th { .main-content table th {
font-weight:bold font-weight: bold;
} }
.main-content table th, .main-content table th,
.main-content table td { .main-content table td {
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border:1px solid #e9ebec border: 1px solid #e9ebec;
} }
.main-content dl { .main-content dl {
padding:0 padding: 0;
} }
.main-content dl dt { .main-content dl dt {
padding: 0; padding: 0;
margin-top: 1rem; margin-top: 1rem;
font-size: 1rem; font-size: 1rem;
font-weight:bold font-weight: bold;
} }
.main-content dl dd { .main-content dl dd {
padding: 0; padding: 0;
margin-bottom:1rem margin-bottom: 1rem;
} }
.main-content hr { .main-content hr {
height: 2px; height: 2px;
padding: 0; padding: 0;
margin: 1rem 0; margin: 1rem 0;
background-color: #eff0f1; background-color: #eff0f1;
border:0 border: 0;
} }
.site-footer { .site-footer {
padding-top: 2rem; padding-top: 2rem;
margin-top: 2rem; margin-top: 2rem;
border-top:solid 1px #eff0f1 border-top: solid 1px #eff0f1;
} }
@media screen and (min-width: 64em) { @media screen and (min-width: 64em) {
.site-footer { .site-footer {
font-size:1rem font-size: 1rem;
} }
} }
@media screen and (min-width: 42em) and (max-width: 64em) { @media screen and (min-width: 42em) and (max-width: 64em) {
.site-footer { .site-footer {
font-size:1rem font-size: 1rem;
} }
} }
@media screen and (max-width: 42em) { @media screen and (max-width: 42em) {
.site-footer { .site-footer {
font-size:0.9rem font-size: 0.9rem;
} }
} }
.site-footer-owner { .site-footer-owner {
display: block; display: block;
font-weight:bold font-weight: bold;
} }
.site-footer-credits { .site-footer-credits {
color:#819198 color: #819198;
} }
.dark-mode { .dark-mode {
background-color: black; background-color: black;
@ -713,3 +715,9 @@ a:hover {
.game { .game {
font-size: 400%; font-size: 400%;
} }
.larger-name {
font-size: larger;
}
.smaller-name {
font-size: smaller;
}