From 13b5462751ba6e206e0f8f8fdcf3ddf024328278 Mon Sep 17 00:00:00 2001 From: suroh Date: Sat, 4 May 2019 17:41:47 +0200 Subject: [PATCH] Updated found more errors in media queries, and missing meta viewport tag in html head. --- css/master.css | 46 ++++++++++++++++++++++++---------------------- index.html | 9 ++++++--- js/audio.js | 26 ++++++++++++++++---------- 3 files changed, 46 insertions(+), 35 deletions(-) diff --git a/css/master.css b/css/master.css index 589fdb8..21638ae 100644 --- a/css/master.css +++ b/css/master.css @@ -89,6 +89,28 @@ h1#menuItem.active { transform: translateY(-100px) !important; } +/* --> AUDIO TOGGLE <-- */ +span#audioToggle { + position: absolute; + top: 16px; + right: 16px; + transition: color ease-in-out 0.1s; +} + +span#audioToggle:hover { + color: #CECECE; + cursor: pointer; + transition: color ease-in-out 0.1s; +} + +span#audioToggle:after { + content: '🔇' +} + +span#audioToggle.active:after { + content: '🔉' +} + /* --> MAINPAGE CONSTRUCTION <-- */ section.content { margin: 0; @@ -202,7 +224,7 @@ section.page h1 { } } -@media screen and (max-width: 1360px) { +@media screen and (max-width: 1359px) { body { font-size: 19px; line-height: 24px; @@ -303,7 +325,7 @@ section.page h1 { /* --> SUBCONTENT CONSTRUCTION <-- */ section.content.page { display: inherit; - max-width: 1960px; + max-width: 650px; grid-gap: 24px; } @@ -319,24 +341,4 @@ section.page h1 { margin: 40px 0 48px; } - /* - section.content.page div.imgFeat { - grid-column: span 5; - grid-row: 1 / 4: - } - - section.content.page section.imgs { - grid-column: 4 / span 2; - grid-row: 2: - } - - section.content.page section.imgs>img { - max-width: 100%; - height: auto; - } - - section.content.page section.text { - grid-column: 1 / span 3; - grid-row: 2; - } */ } diff --git a/index.html b/index.html index 3f43640..4c8d916 100755 --- a/index.html +++ b/index.html @@ -4,17 +4,18 @@ wkflw + - --> @@ -42,6 +43,8 @@ <~███ + +

diff --git a/js/audio.js b/js/audio.js index 3603521..c657ded 100644 --- a/js/audio.js +++ b/js/audio.js @@ -1,17 +1,23 @@ // audio for events // AUDIO SETUP const audioEngine = new (window.AudioContext || window.webkitAudioContext)() +audioEngine.suspend() const masterGain = audioEngine.createGain() +const audioEl = document.querySelector('#audioToggle') -window.onload = function() { - // create gain - masterGain.gain.value = 0.9 - masterGain.connect(audioEngine.destination) +masterGain.gain.value = 0.9 +masterGain.connect(audioEngine.destination) +// window.onload = function() { +// // create gain +// } + +const audioToggle = () => { + audioEl.classList.toggle('active'); + if (audioEngine.state == 'suspended') { + audioEngine.resume() + } else { + audioEngine.suspend() + } } - -// AMBIENT - - - -// BUTTON HOVER +audioEl.addEventListener('click', audioToggle)