css

12/index_test.html

@@ -30,6 +30,7 @@
   <div id="resources" class=""><iframe name="resources" id="iframe" src='resources_04.html'></iframe></div>
        <!--  <div id="info"><div id="title"></div><div id="authors"></div> --> 
     <div id="week_04">
+      <div class="schedule_04">PROGRAMME</div>
       <div class="audio_04">
         <audio controls>
         <source src="archive_12.1.4.mp3" type="audio/mp3">
@@ -38,27 +39,23 @@
                src="archive_12.1.4.vtt"/>
         </audio>
       </div>
-      <div class="sec_title_04">#12.4 Schedule</div>
-      <ul id="table_content_04">
-        <li id="track_1"> No. 2992 / Clara / 0'00''</li>
-        <li id="track_2"> SupraSignal: An audio piece of the unseen image / Ioana / 0'00''</li>
-        <li id="track_3"> I can think with my own head / Tisa / 0'00''</li>
-<!--         <li id="track_4">track / name / 0'00''</li>
-        <li id="track_5">track / name / 0'00''</li>
-        <li id="track_6">track / name / 0'00''</li>
-        <li id="track_7">track / name / 0'00''</li>
-        <li id="track_8">track / name / 0'00''</li> -->
-      </ul> 
-       
-          <p> 
-            live comment during the broadcast: <br><a href="https://pad.xpub.nl/p/radio_implicancies_12.4" target="etherpad"> >> ETHERPAD << </a>&nbsp;&nbsp;
-              <!-- <a href="shell.html" target="shell">shell</a> -->
-          </p>
+      <div id="table_content_04">
+        <li id="track_1"> &#8674; No. 2992 &#8674; 0'00''&#8674; by Clara &#8674;</li>
+        <li id="track_2">  &#8674; SupraSignal: An audio piece of the unseen image &#8674; 0'00''&#8674; by Ioana &#8674;</li> 
+        <li id="track_3"> &#8674; I can think with my own head &#8674; 0'00''&#8674; by Tisa &#8674;</li>
+        <li id="track_4"> &#8674; track# &#8674; 0'00''&#8674; by Mika &#8674;</li>
+        <li id="track_5"> &#8674; track## &#8674; 0'00'' &#8674; by Avital & Max &#8674;</li>
+        <li id="track_6"> &#8674; track### &#8674; 0'00''&#8674; by Anna &#8674;</li>
+      </div> 
 </div>
 </div>
 
 <!-- <div id="shell_03" class="hidden"><iframe name="shell" id="iframe"></iframe></div> -->
-      <div id="etherpad" class="hidden"><iframe name="etherpad" id="iframe2" ></iframe></div>
+       
+         <!--  <p> 
+            live comment during the broadcast: <br><a href="https://pad.xpub.nl/p/radio_implicancies_12.4" target="etherpad"> >> ETHERPAD << </a>&nbsp;&nbsp;
+          </p> -->
+      <div id="etherpad" class="hidden">live comment during the broadcast: <br><a href="https://pad.xpub.nl/p/radio_implicancies_12.4" class="link_04" target="etherpad"> >> ETHERPAD << </a><iframe name="etherpad" id="iframe2" ></iframe></div>
         <div id="info"><div id="title"></div><div id="authors"></div>
       </div>
 

12/style.css

@@ -195,13 +195,11 @@ ul#table_content_03{
   margin-top: 15px;
   font-size: 60px;
   text-align: center;
-  text-outline: 1px solid;
   width: 100%;
   height: auto;
   background-color: ;
   left: 0px;
-/*  position: relative;*/
-  margin: 160px 0px 90px 0px;
+  margin: 200px 0px 150px 0px;
   padding: 0px;
 
 }
@@ -264,6 +262,7 @@ a:hover{
 #implicancies_04 > div {
     display: inline-block;
     text-align: center;
+   
 }
 
 #implicancies_04 {
@@ -282,67 +281,74 @@ a:hover{
     color: white;
     font-size: 14px;
     overflow-y: auto;
-    background: blue;
-    /*margin-top: 100px;*/
-    /*margin-bottom: 20px;*/
+    background: #FAF0E6;
     margin: 0px;
-    /*margin-top: 100px;*/
-    border: 10px solid pink;
+    border: 10px solid #FAF0E6;
+    float: left;
+    margin-left: 50px;
 }
 
 #resources iframe {
   width: 100%;
   height: 100%;
-  border: 1px solid;
+  border: 1px solid #FAF0E6;
   background-color: none;
   position: relative;
 }
 
 #week_04{
-  /*padding: 40px;*/
-/*  border-style: ridge;
-  border-width:7px;
-  border-color: black;*/
-  /*margin-top:30px;*/
-  height: 100%;
   width: 45%;
   margin: 0px;
-  margin-left: 10px;
-  background-color: pink;
+  margin-right: 50px;
+  background-color: ;
+  float: right;
 }
 
 .schedule_04 {
-  position: relative;
   width: 100%;
+  padding-top: 0px;
+  margin-top: 30px;
+  background-color:;
+
+  
 }
 
-ul#table_content_04 li{    
- font-size: 18px;
+#table_content_04 { 
+ align-content: initial;   
+ font-size: 20px;
  text-align: left;
+ background-color:;
+ list-style-type: none;
+ padding-left: 30px;
   }
 
 #etherpad {
     text-align: center;
     white-space: pre-wrap;
-    height: 45%;
+    height: 80%;
     width: 98%;
-    font-family: monospace;
-    color: white;
-    font-size: 14px;
+    font-family: Roboto Mono;
+    color: black;
     overflow-y: auto;
-    background: blue;
-    margin-top: 20px;
     margin-bottom: 20px;
-    border: 10px pink solid;
+    border: 10px #FAF0E6 solid;
     margin-top: 100px;
+    font-size: 25px;
+    background-color: #FAF0E6;
 }
 
 #etherpad.hidden {
-  display:block;
+  display: block;
   width: 100%;
-  height: 20%;
-  background-color: pink;
+  height: 10%;
+  font-family: Roboto Mono;
+  color: black;
+  background-color: #FAF0E6;
   margin-top: 100px;
+  font-size: 25px;
+  text-align: center;
+  padding-top: 5px;
+  overflow: hidden;
 }
 
 #etherpad iframe {
@@ -354,5 +360,12 @@ ul#table_content_04 li{
 
 .audio_04{
   width:100%;
-  margin-bottom:40px;
-}
+  margin-top: 50px;
+  margin-bottom: 50px;
+  background-color: white;
+}
+
+.link_04{  
+  color:blue;
+  text-decoration: none;
+}