Updated found more errors in media queries, and missing meta viewport tag in html head.
This commit is contained in:
parent
c04344286c
commit
13b5462751
|
@ -89,6 +89,28 @@ h1#menuItem.active {
|
||||||
transform: translateY(-100px) !important;
|
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 <-- */
|
/* --> MAINPAGE CONSTRUCTION <-- */
|
||||||
section.content {
|
section.content {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
@ -202,7 +224,7 @@ section.page h1 {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 1360px) {
|
@media screen and (max-width: 1359px) {
|
||||||
body {
|
body {
|
||||||
font-size: 19px;
|
font-size: 19px;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
|
@ -303,7 +325,7 @@ section.page h1 {
|
||||||
/* --> SUBCONTENT CONSTRUCTION <-- */
|
/* --> SUBCONTENT CONSTRUCTION <-- */
|
||||||
section.content.page {
|
section.content.page {
|
||||||
display: inherit;
|
display: inherit;
|
||||||
max-width: 1960px;
|
max-width: 650px;
|
||||||
grid-gap: 24px;
|
grid-gap: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -319,24 +341,4 @@ section.page h1 {
|
||||||
margin: 40px 0 48px;
|
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;
|
|
||||||
} */
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,17 +4,18 @@
|
||||||
<head>
|
<head>
|
||||||
<title>wkflw</title>
|
<title>wkflw</title>
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||||||
|
|
||||||
<link rel="stylesheet" type="text/css" href="css/master.css">
|
<link rel="stylesheet" type="text/css" href="css/master.css">
|
||||||
|
|
||||||
<!-- Matomo -->
|
<!-- Matomo -->
|
||||||
<script type="text/javascript">
|
<!-- <script type="text/javascript">
|
||||||
var _paq = window._paq || [];
|
var _paq = window._paq || [];
|
||||||
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
|
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
|
||||||
_paq.push(['trackPageView']);
|
_paq.push(['trackPageView']);
|
||||||
_paq.push(['enableLinkTracking']);
|
_paq.push(['enableLinkTracking']);
|
||||||
(function() {
|
(function() {
|
||||||
var u = "//analytics.suroh.tk/";
|
var u = "https://analytics.suroh.tk/";
|
||||||
_paq.push(['setTrackerUrl', u + 'matomo.php']);
|
_paq.push(['setTrackerUrl', u + 'matomo.php']);
|
||||||
_paq.push(['setSiteId', '1']);
|
_paq.push(['setSiteId', '1']);
|
||||||
var d = document,
|
var d = document,
|
||||||
|
@ -26,7 +27,7 @@
|
||||||
g.src = u + 'matomo.js';
|
g.src = u + 'matomo.js';
|
||||||
s.parentNode.insertBefore(g, s);
|
s.parentNode.insertBefore(g, s);
|
||||||
})();
|
})();
|
||||||
</script>
|
</script> -->
|
||||||
<!-- End Matomo Code -->
|
<!-- End Matomo Code -->
|
||||||
|
|
||||||
<script src="js/audio.js" charset="utf-8" defer></script>
|
<script src="js/audio.js" charset="utf-8" defer></script>
|
||||||
|
@ -42,6 +43,8 @@
|
||||||
<span data-link="~"><~</span><span data-link="works" class="">█</span><span data-link="audio" class="">█</span><span data-link="teach" class="">█</span>
|
<span data-link="~"><~</span><span data-link="works" class="">█</span><span data-link="audio" class="">█</span><span data-link="teach" class="">█</span>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
|
<span id="audioToggle"></span>
|
||||||
|
|
||||||
<section style="position: fixed; top: 0; left: 0; margin: 0; padding: 0; width: 100vw; height: 100vh; z-index: -100;">
|
<section style="position: fixed; top: 0; left: 0; margin: 0; padding: 0; width: 100vw; height: 100vh; z-index: -100;">
|
||||||
<div style="position: relative; width: 100%; height: 100%;">
|
<div style="position: relative; width: 100%; height: 100%;">
|
||||||
<h1 id="menuItem" class=""></h1>
|
<h1 id="menuItem" class=""></h1>
|
||||||
|
|
26
js/audio.js
26
js/audio.js
|
@ -1,17 +1,23 @@
|
||||||
// audio for events
|
// audio for events
|
||||||
// AUDIO SETUP
|
// AUDIO SETUP
|
||||||
const audioEngine = new (window.AudioContext || window.webkitAudioContext)()
|
const audioEngine = new (window.AudioContext || window.webkitAudioContext)()
|
||||||
|
audioEngine.suspend()
|
||||||
const masterGain = audioEngine.createGain()
|
const masterGain = audioEngine.createGain()
|
||||||
|
const audioEl = document.querySelector('#audioToggle')
|
||||||
|
|
||||||
window.onload = function() {
|
masterGain.gain.value = 0.9
|
||||||
// create gain
|
masterGain.connect(audioEngine.destination)
|
||||||
masterGain.gain.value = 0.9
|
// window.onload = function() {
|
||||||
masterGain.connect(audioEngine.destination)
|
// // create gain
|
||||||
|
// }
|
||||||
|
|
||||||
|
const audioToggle = () => {
|
||||||
|
audioEl.classList.toggle('active');
|
||||||
|
if (audioEngine.state == 'suspended') {
|
||||||
|
audioEngine.resume()
|
||||||
|
} else {
|
||||||
|
audioEngine.suspend()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
audioEl.addEventListener('click', audioToggle)
|
||||||
// AMBIENT
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// BUTTON HOVER
|
|
||||||
|
|
Loading…
Reference in New Issue