From faa031951fb165af86d376746ff82f5d464886af Mon Sep 17 00:00:00 2001 From: Reppard Date: Wed, 9 Feb 2022 20:12:43 -0500 Subject: [PATCH] sum stylez --- public/favicon.ico | Bin 4286 -> 318 bytes src/App.vue | 49 ++++++++++++++++++++----------- src/assets/font/DIGITALDREAM.ttf | Bin 0 -> 29320 bytes 3 files changed, 32 insertions(+), 17 deletions(-) create mode 100644 src/assets/font/DIGITALDREAM.ttf diff --git a/public/favicon.ico b/public/favicon.ico index df36fcfb72584e00488330b560ebcf34a41c64c2..1b91e397a44c254160deb0cee8e802522b3e9895 100644 GIT binary patch literal 318 zcma)$F$%&!5Ji6=_M1kqlZ8Oaz~BwmJ{ZTGAk&C;VOt9?l1tfplJ#%W2WOf8_LW*W<827=Unuo8sGpRux(DN@jWP-e29Wl%wj zY84_aq9}^Am9-cWTD5GGEo#+5Fi2wX_P*bo+xO!)p*7B;iKlbFd(U~_d(U?#hLj56 zPhFkj-|A6~Qk#@g^#D^U0XT1cu=c-vu1+SElX9NR;kzAUV(q0|dl0|%h|dI$%VICy zJnu2^L*Te9JrJMGh%-P79CL0}dq92RGU6gI{v2~|)p}sG5x0U*z<8U;Ij*hB9z?ei z@g6Xq-pDoPl=MANPiR7%172VA%r)kevtV-_5H*QJKFmd;8yA$98zCxBZYXTNZ#QFk2(TX0;Y2dt&WitL#$96|gJY=3xX zpCoi|YNzgO3R`f@IiEeSmKrPSf#h#Qd<$%Ej^RIeeYfsxhPMOG`S`Pz8q``=511zm zAm)MX5AV^5xIWPyEu7u>qYs?pn$I4nL9J!=K=SGlKLXpE<5x+2cDTXq?brj?n6sp= zphe9;_JHf40^9~}9i08r{XM$7HB!`{Ys~TK0kx<}ZQng`UPvH*11|q7&l9?@FQz;8 zx!=3<4seY*%=OlbCbcae?5^V_}*K>Uo6ZWV8mTyE^B=DKy7-sdLYkR5Z?paTgK-zyIkKjIcpyO z{+uIt&YSa_$QnN_@t~L014dyK(fOOo+W*MIxbA6Ndgr=Y!f#Tokqv}n<7-9qfHkc3 z=>a|HWqcX8fzQCT=dqVbogRq!-S>H%yA{1w#2Pn;=e>JiEj7Hl;zdt-2f+j2%DeVD zsW0Ab)ZK@0cIW%W7z}H{&~yGhn~D;aiP4=;m-HCo`BEI+Kd6 z={Xwx{TKxD#iCLfl2vQGDitKtN>z|-AdCN|$jTFDg0m3O`WLD4_s#$S diff --git a/src/App.vue b/src/App.vue index 3b5337c..3170160 100644 --- a/src/App.vue +++ b/src/App.vue @@ -3,10 +3,7 @@
-
+
{{score}}
@@ -25,10 +22,10 @@
-
+
{{space.key}}
@@ -141,8 +138,8 @@ export default { }, mounted() { - const randomColor = "#"+((1<<24)*Math.random()|0).toString(16); - document.documentElement.style.setProperty('--main-bg-color', randomColor); + //const randomColor = "#"+((1<<24)*Math.random()|0).toString(16); + //document.documentElement.style.setProperty('--main-bg-color', randomColor); }, methods: { @@ -169,7 +166,7 @@ export default { }, checkInput(i) { - if(!this.playing) { + if(!this.playing && this.started) { this.blink = i if(this.check.length < this.pattern.length) { this.playOSC(this.spaces[i].tone) @@ -265,7 +262,14 @@ html, body{ height: 100%; padding: 0; margin: 0; - background: var(--main-bg-color); + /*background: var(--main-bg-color);*/ + background: + radial-gradient(black 15%, transparent 16%) 0 0, + radial-gradient(black 15%, transparent 16%) 8px 8px, + radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px, + radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px; + background-color:#282828; + background-size:16px 16px; } @@ -303,9 +307,11 @@ body { grid-template-columns: 50% 50%; width: 75%; height: 75%; - padding: 12px; - background: linear-gradient(to bottom, #3f3f3f, #0f0f0f); + padding: 8px; + border: 4px solid #232323; + background: linear-gradient(to left, #2b2b2b, #464646); border-radius: 100%; + box-shadow: 0 0 8px 2px black; } .overlay { @@ -326,7 +332,6 @@ body { background: black; border-radius: 6px; border-top: 2px solid #262626; - /*color: #fd0010;*/ width: 50%; height: 32px; font-size: 22px; @@ -335,10 +340,21 @@ body { position: absolute; top: 50%; left: 50%; - /*text-shadow: 2px 2px 8px #fd0010;*/ + color: blue; + text-shadow: 2px 2px 8px blue; transform: translateX(-50%) translateY(-50%); } +.score-success { + color: green; + text-shadow: 2px 2px 8px green; +} + +.score-fail { + color: red; + text-shadow: 2px 2px 8px red; +} + .simeon-game-spaces { box-sizing: border-box; align-content: center; @@ -347,7 +363,7 @@ body { display: grid; width: 100%; height: 100%; - box-shadow: 1px -1px 11px -1px black, inset -9px 0px 20px 2px #000000ab, inset 8px 0px 20px 2px #ffffffa6; + box-shadow: 1px 1px 4px 2px black, inset -11px 0px 4px -2px #00000059, inset 11px 0px 4px 2px #ffffff6b; } .piece-t-l { @@ -379,8 +395,7 @@ body { } .blink { - background: #ffffff7d; - box-shadow: 0px 0px 22px 12px white; + box-shadow: inset 0 0 70px 60px #ffffffa6, inset -11px 0px 4px -2px #00000059, inset 11px 0px 4px 2px #ffffff6b; } .start, .reset { diff --git a/src/assets/font/DIGITALDREAM.ttf b/src/assets/font/DIGITALDREAM.ttf new file mode 100644 index 0000000000000000000000000000000000000000..25ab5de5a3a75144e94852b67b4449ca69cb90cd GIT binary patch literal 29320 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 Hu8IEx0x4|* literal 0 HcmV?d00001