ruangrupa
/
lumbung.space-archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

second iteration
continuous-integration/drone/push Build is passing Details

This commit is contained in:
rra 2021-05-23 21:48:08 +02:00
parent c0c70b803a
commit b3bc742d67
1 changed files with 32 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
lumbung.space/stream.html
View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
@ -37,10 +37,13 @@
max-width:800px;
margin:auto;
box-shadow:1em 1em 0 #d2d1c8;
margin-bottom: 2em;
background-color: #fff09d;
}
.video.box{
margin-top:3em;
}
.bar{
border:2px solid #0e0e22;
box-shadow:0.6em 0.6em 0 #d2d1c8;
@ -57,6 +60,9 @@
font-weight:700;
font-size:1.3rem;
transform: rotate(-7deg);
z-index: 2;
position: absolute;
box-shadow:unset;
}
.footer{
@ -70,7 +76,8 @@
display: flex;
justify-content: space-between;
transform: rotate(2deg);
max-height: 2em;
font-size:16px;
max-width: 300px;
}
#playtoggle {
@ -114,8 +121,22 @@
}
.something {
display: flex;
flex-direction: column;
}
#conversejs{
height:500px;
}
.box.chat{
position: absolute;
left: 4em;
bottom: 2em;
}
#titleshadow{
mix-blend-mode: darken;
z-index: 1;
box-shadow:0.6em 0.6em 0 #d2d1c8;
}
</style>
@ -127,28 +148,26 @@
<div class='wrapper'>
<div class='title bar'> STREAM TITLE </div>
<div class='title bar'> A SOMEWHAT LONGER STREAM TITLE </div>
<div class='title bar' id='titleshadow'> A SOMEWHAT LONGER STREAM TITLE </div>
<div class='video box'>
<iframe width="800" height="450" sandbox="allow-same-origin allow-scripts allow-popups" src="https://tv.lumbung.space/videos/embed/b4aafef4-892f-4036-a4bc-2e09027e2b4b" frameborder="0" allowfullscreen></iframe>
<iframe width="800" height="450" sandbox="allow-same-origin allow-scripts allow-popups" src="https://tv.lumbung.space/videos/embed/b4aafef4-892f-4036-a4bc-2e09027e2b4b?start=52s&title=0&warningTitle=0&controls=0" frameborder="0" allowfullscreen></iframe>
</div>
<div class='something'>
<div class='controls bar'>
<span id='playtoggle'> ▶ </span>
<span id='duration'> 14:02 - ??? </span>
<span id='volume'>70% + - mute </span>
</div>
<span id='volume'>70% + - mute </span></div>
<div class='metadata box'>
<div class='metadata-header'><span id='about'>about</span><span id='close'>x</span></div>
<div id='description'>
Radio Alhara is a radio station based in Bethlehem, Ramallah and Amman. Launched during a global lockdown crisis in March 2020, it encompasses the idea of a public space. The radio hosts musical sets, conversations, recordings, discussions, and its main aim is to blend the limits between producers and listeners. Radio Alhara have together with a group of sound platforms and sound artists started The Sonic Liberation Front in order to create one sound for Palestine.
Radio Alhara is in the ecosystem of Question of Funding.
</div>
<div>
Radio Alhara is a radio station based in Bethlehem, Ramallah and Amman. Launched during a global lockdown crisis in March 2020, it encompasses the idea of a public space. The radio hosts musical sets, conversations, recordings, discussions, and its main aim is to blend the limits between producers and listeners. Radio Alhara have together with a group of sound platforms and sound artists started The Sonic Liberation Front in order to create one sound for Palestine.Radio Alhara is in the ecosystem of Question of Funding.
</div>
</div>
<div class='box chat'>
<iframe src="https://partyline.lurk.org/" id='conversejs' sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
</div>
</div>
</div>
</body>