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

second iteration
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source
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.
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>
<div class='box chat'>
<iframe src="https://partyline.lurk.org/" id='conversejs' sandbox="allow-same-origin allow-scripts allow-popups"></iframe>
</div>
</div>
</div>
</div>
</body>