diff --git a/fonts/Hack-Regular.ttf b/fonts/Hack-Regular.ttf new file mode 100644 index 0000000..25578e0 Binary files /dev/null and b/fonts/Hack-Regular.ttf differ diff --git a/fonts/digital-7.ttf b/fonts/digital-7.ttf new file mode 100644 index 0000000..5dbe6f9 Binary files /dev/null and b/fonts/digital-7.ttf differ diff --git a/fonts/monofonto.ttf b/fonts/monofonto.ttf new file mode 100644 index 0000000..9d65196 Binary files /dev/null and b/fonts/monofonto.ttf differ diff --git a/index.css b/index.css index a3525de..ed797dd 100644 --- a/index.css +++ b/index.css @@ -1,22 +1,41 @@ +@font-face { font-family: 'digital7'; src: url('fonts/digital-7.ttf'); } +@font-face { font-family: 'monofonto'; src: url('fonts/monofonto.ttf'); } +@font-face { font-family: 'Hack-Regular'; src: url('fonts/Hack-Regular.ttf'); } + body { background-color: #28262C; color: #F9F5FF; } +button +{ + background: none; + color: inherit; + border: none; + padding: 0; + font: inherit; + cursor: pointer; + outline: inherit; +} + .hidden { - display: none; + display: none !important; } .header { - font-size: 28px; + font-family: 'digital7'; + color: #758E4F; + font-size: 48px; text-align: center; + margin-bottom: 10px; } .main { + font-family: 'monofonto'; display: flex; flex-direction: row; } @@ -26,6 +45,10 @@ body display: flex; flex-direction: column; width: 50%; + border-right: 1px solid white; + min-height: 600px; + margin-left: 10px; + margin-right: 10px; } .showlist @@ -35,12 +58,14 @@ body .show { - color: #14248A; + font-family: 'Hack-Regular'; + color: #998FC7; cursor: pointer; } .tracklist { + font-family: 'monofonto'; font-size: 14px; } @@ -57,16 +82,49 @@ body width: 50%; } -.audio-player +#audio-player { display: flex; - width: 50%; + width: 100%; + flex-direction: column; align-items: center; } -.audio-player button +.player { - height: 14px; + display: flex; + flex-direction: row; + align-items: center; + width: 75%; +} + +.player .time +{ + margin: 10px; +} + +.volume +{ + display: flex; + flex-direction: row; + align-items: center; +} + +.volume #mute-icon +{ + margin: 10px; +} + +.volume #mute-icon svg +{ + width: 50px; + height: 50px; +} + +.volume #mute-icon svg path +{ + stroke: #F9F5FF !important; + fill: #F9F5FF !important; } .show-info diff --git a/index.html b/index.html index 784499d..5bad1bf 100644 --- a/index.html +++ b/index.html @@ -32,12 +32,21 @@
Monads Music Mindset is a weekly internet radio program broadcasted on Mondays at 7PM Pacific Standard Time.
-This page contains the archives of recorded broadcasts. I hope you'll join us for a live show!
+This page contains the archives of recorded broadcasts, and can also stream the live broadcast. I hope you'll join us for a live show!