From f05f15dbe108e3fd10af8d15fb15c1b27e689f96 Mon Sep 17 00:00:00 2001 From: Rasmus Date: Fri, 10 Mar 2023 19:09:53 +0200 Subject: added Muusika and Kuulamine --- rannak/mangud/arimees/muusika/index.html | 269 +++++++++++++++++++++ .../muusika/laulud/AppiMaVajanArmastust.mp3 | Bin 0 -> 2415021 bytes .../mangud/arimees/muusika/laulud/EestlaneOlen.mp3 | Bin 0 -> 4435629 bytes .../mangud/arimees/muusika/laulud/MagedeHaal.mp3 | Bin 0 -> 4089645 bytes .../arimees/muusika/laulud/OhkKonnidTanaval.mp3 | Bin 0 -> 4577709 bytes .../arimees/muusika/laulud/TerePerestroika.mp3 | Bin 0 -> 2587821 bytes rannak/mangud/arimees/muusika/laulud/TulgeKoik.mp3 | Bin 0 -> 2833581 bytes rannak/mangud/arimees/muusika/pildid/avatar.png | Bin 0 -> 73556 bytes rannak/mangud/arimees/muusika/script.js | 32 +++ rannak/mangud/arimees/muusika/style.css | 148 ++++++++++++ 10 files changed, 449 insertions(+) create mode 100755 rannak/mangud/arimees/muusika/index.html create mode 100644 rannak/mangud/arimees/muusika/laulud/AppiMaVajanArmastust.mp3 create mode 100644 rannak/mangud/arimees/muusika/laulud/EestlaneOlen.mp3 create mode 100644 rannak/mangud/arimees/muusika/laulud/MagedeHaal.mp3 create mode 100644 rannak/mangud/arimees/muusika/laulud/OhkKonnidTanaval.mp3 create mode 100644 rannak/mangud/arimees/muusika/laulud/TerePerestroika.mp3 create mode 100644 rannak/mangud/arimees/muusika/laulud/TulgeKoik.mp3 create mode 100755 rannak/mangud/arimees/muusika/pildid/avatar.png create mode 100755 rannak/mangud/arimees/muusika/script.js create mode 100755 rannak/mangud/arimees/muusika/style.css (limited to 'rannak/mangud/arimees/muusika') diff --git a/rannak/mangud/arimees/muusika/index.html b/rannak/mangud/arimees/muusika/index.html new file mode 100755 index 0000000..916e7e9 --- /dev/null +++ b/rannak/mangud/arimees/muusika/index.html @@ -0,0 +1,269 @@ + + + + + + + Muusika + + + + + + + + + + + + +
+

Muusika

+

+ Vajuta lingile ja vaata muusikavideosid, või kuula siinsamas, +
+ ning järjesta siis need vastavalt oma eelistustele. +

+ +
+ +
+ +
+ +
+
+ + + + + + + +
+ +
+ + + + + + + + + + diff --git a/rannak/mangud/arimees/muusika/laulud/AppiMaVajanArmastust.mp3 b/rannak/mangud/arimees/muusika/laulud/AppiMaVajanArmastust.mp3 new file mode 100644 index 0000000..fbb335b Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/AppiMaVajanArmastust.mp3 differ diff --git a/rannak/mangud/arimees/muusika/laulud/EestlaneOlen.mp3 b/rannak/mangud/arimees/muusika/laulud/EestlaneOlen.mp3 new file mode 100644 index 0000000..416d251 Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/EestlaneOlen.mp3 differ diff --git a/rannak/mangud/arimees/muusika/laulud/MagedeHaal.mp3 b/rannak/mangud/arimees/muusika/laulud/MagedeHaal.mp3 new file mode 100644 index 0000000..245faa4 Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/MagedeHaal.mp3 differ diff --git a/rannak/mangud/arimees/muusika/laulud/OhkKonnidTanaval.mp3 b/rannak/mangud/arimees/muusika/laulud/OhkKonnidTanaval.mp3 new file mode 100644 index 0000000..3fa9fbd Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/OhkKonnidTanaval.mp3 differ diff --git a/rannak/mangud/arimees/muusika/laulud/TerePerestroika.mp3 b/rannak/mangud/arimees/muusika/laulud/TerePerestroika.mp3 new file mode 100644 index 0000000..2936f6e Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/TerePerestroika.mp3 differ diff --git a/rannak/mangud/arimees/muusika/laulud/TulgeKoik.mp3 b/rannak/mangud/arimees/muusika/laulud/TulgeKoik.mp3 new file mode 100644 index 0000000..649866d Binary files /dev/null and b/rannak/mangud/arimees/muusika/laulud/TulgeKoik.mp3 differ diff --git a/rannak/mangud/arimees/muusika/pildid/avatar.png b/rannak/mangud/arimees/muusika/pildid/avatar.png new file mode 100755 index 0000000..3cb21cf Binary files /dev/null and b/rannak/mangud/arimees/muusika/pildid/avatar.png differ diff --git a/rannak/mangud/arimees/muusika/script.js b/rannak/mangud/arimees/muusika/script.js new file mode 100755 index 0000000..8803bbe --- /dev/null +++ b/rannak/mangud/arimees/muusika/script.js @@ -0,0 +1,32 @@ +document.addEventListener('DOMContentLoaded', () => { + let btn = document.querySelector('.modalButton'); + btn.click(); +}); + + +const selectors = document.querySelectorAll('select'); + +for(el of selectors){ + el.addEventListener('change', () => { + + let selected = new Array(); + for (el of selectors){ + if (!selected.includes(el.value) && el.value != 'Vali') + selected.push(el.value); + } + + if (selected.length == 6) + moveOnEnable(); + + }); +} + + +// If All Else Done + +function moveOnEnable(){ + const btn = document.querySelector(".moveOn"); + btn.disabled = false; + btn.onclick = () => location.href = ""; +} + diff --git a/rannak/mangud/arimees/muusika/style.css b/rannak/mangud/arimees/muusika/style.css new file mode 100755 index 0000000..ab7c91d --- /dev/null +++ b/rannak/mangud/arimees/muusika/style.css @@ -0,0 +1,148 @@ +* {box-sizing: border-box;} + + +body{ + background-color: #43464b; +} + + +h1 { + color: #2FF924; + font-weight: bold; +} + +.moveOn{ + display: inline-block; + border: none; + padding: 6px 12px; + margin-botton: 0; + font-size: 1rem; + font-weight: normal; + text-align: center; + cursor: pointer; + border-radius: 4px; + background-color: #4BB543; + color: white; +} + +button:disabled{ + opacity: 0.5; + cursor: not-allowed; +} + + + + +/* Modal Stuff */ + +.avatar { + border-radius: 20px; + width: 100%; + max-width: 15rem; +} + +.modalHeaderWrapper{ + text-align: center; + margin: 0; + width: 100%; +} + + + +.closeModalButton { + border-radius: 50px; +} + +.modalButton{ + position: absolute; + top: 0; + right: 0; + padding: 6px; + padding: 9px 25px; + background-color: rgba(0,136,169,1); + border: none; + border-radius: 50px; + cursor: pointer; + transition: all 0.3 ease 0; + margin: 3%; + font-size: 1.2rem; +} + +.modalButton:hover{ + background-color: rgba(0,136,169,0.8); +} + + + +/* Main */ + +.main { + margin-top: 2rem; + display: flex; + align-items: center; + justify-content: center; +} + +ul{ + width: 67vw; + background-color: #fff; + border-radius: 1rem; + list-style: none; + overflow: hidden; + padding: 0; +} + + + +li{ + display: flex; + align-items: center; + transition: .3s ease; +} + +li:nth-child(even){background-color: #eee8;} +li:hover{transform: scale(1.03);} + + +.laul{ + display: flex; + align-items: center; + padding: 1rem; + min-width: 100%; +} + +.laulInner { + display: flex; + justify-content: space-between; + +} + + + +.info { + padding-left: 1rem; + text-align: center; + border-left: .3rem solid #000; + width: 50%; +} + +.audioWrap{ + width: 50%; +} + +.info a { + text-decoration: underline; + font-weight: bold; + color: #000; +} + +.info h2{font-size: 1.2rem;} +select{margin-right: 1rem;} + +select { + -webkit-appearance: menulist-button; + height: 3rem; + width: 5rem; + font-size: 1.5rem; + +} -- cgit v1.2.3