css and templates and responsivity so far

templates/about.html

@@ -1,8 +1,8 @@
       	{% extends "layout.html" %}
 		{% block content %}
 
-    <div class="aboutpage">
-       <div class="about">
+    <div class="aboutpage content-block">
+       <div class="about column">
          <h2>About the archival publication</h2>
 
 At the end of 2018, Varia was approached by De Player with the proposal to work on an archival project that aimed to represent the archive which was compiled during the last two years of their Pushing Scores project. De Player showed a specific interest in the development of an accessible, dynamic digital environment that could be used to create new relations, perspectives and, at its best, concepts for the production of new graphic scores. Varia, as a space with a shared body of knowledge in archiving, everyday technology, experimental music and digital media took De Player up on their offer.<br /><br />
@@ -35,6 +35,7 @@ Fonts – Montserrat by Julieta Ulanovsky, Steps Mono by Jean-Baptiste Morizot a
 Funding – This project was made possible thanks to the generous support of the Creative Industries Fund<br /><br />
 
 This website was crafted using Flask and Jinja2.
-      </div>
+</div>
+</div>
 
        {% endblock content %}

templates/all.html

@@ -1,73 +0,0 @@
-
-      	{% extends "layout.html" %}
-		{% block content %}
-       <div class="all">
-         <h1>These are all the files</h1>
-          {{ listingfiles }} <br>
-          {{ jsonfiles }} <br>
-          {{ listofdicts }} <br>
-          <div class="col-lg-3 col-md-4 col-xs-6 thumb">
-          {% for filename in listingfiles %}
-            {% if filename.lower().endswith(('.png', '.jpg', '.jpeg')) %}
-            	<div><img class="img-responsive" src=" ../{{ filename }}">
-            		{% for jsonfile in jsonfiles %}
-            			{% if filename[0:9] == jsonfile[0:9] %}
-            				<div class="descrip">
-	            				{{ jsonfile }}
-	            				{% for dict in listofdicts %}
-	            					{% if jsonfile[6:9]==dict["id"] %}
-		            					<p>{% for key, value in dict.items() %}
-		            					{{key}}: {{value}}<br>
-			            				{% endfor %}</p>
-			            			{% endif %}
-			            		{% endfor %}
-            				</div></div>
-            				{% break %}
-            			{% endif %}
-            		{% endfor %}
-
-            {% elif filename.lower().endswith(('.mp4')) %}
-            	<div><video width="320" height="240" controls><source src="../{{filename}}" type="video/mp4">
-            		Your browser does not support the video tag.
-				</video>
-				{% for jsonfile in jsonfiles %}
-            			{% if filename[0:9] == jsonfile[0:9] %}
-            				<div class="descrip">
-	            				{{ jsonfile }}
-	            				{% for dict in listofdicts %}
-	            					{% if jsonfile[6:9]==dict["id"] %}
-		            					<p>{% for key, value in dict.items() %}
-		            					{{key}}: {{value}}<br>
-			            				{% endfor %}</p>
-			            			{% endif %}
-			            		{% endfor %}
-            				</div></div>
-            				{% break %}
-            			{% endif %}
-            	{% endfor %}
-
-			{% elif filename.lower().endswith(('.mp3')) %}
-				<div><audio controls><source src="../{{filename}}" type="audio/mpeg">
-	  				Your browser does not support the audio tag.
-				</audio>
-				{% for jsonfile in jsonfiles %}
-            			{% if filename[0:9] == jsonfile[0:9]%}
-            				<div class="descrip">
-	            				{{ jsonfile }}
-	            				{% for dict in listofdicts %}
-	            					{% if jsonfile[6:9]==dict["id"] %}
-		            					<p>{% for key, value in dict.items() %}
-		            					{{key}}: {{value}}<br>
-			            				{% endfor %}</p>
-			            			{% endif %}
-			            		{% endfor %}
-            				</div></div>
-            				{% break %}
-            			{% endif %}
-            	{% endfor %}
-            {% endif %}
-
- 		  {% endfor %}
- 		  </div>
-       </div>
-       {% endblock %}

templates/description.html

@@ -1,13 +1,11 @@
 {% extends "layout.html" %}
 {% block content %}
-<div class="description">
+<div class="descriptionpage content-block">
 
-<!--passing files
-		<p>{{ datafromjson }}</p>-->
 
-<div class="allcontent">
-
-<div class="item column">
+<!-- <div class="allcontent">
+ -->
+<div class="item column column-left">
 {% set count=[0] %}
 {% for item in datafromjson %}
     {% if item.lower().endswith(('.png', '.jpg', '.jpeg')) %}
@@ -22,7 +20,7 @@
 {% endif %}
 {% endfor %}
 </div>
-<div class="text column">
+<div class="text column column-right">
   <h2>{{ itemid }}. {{index_dict[itemid]}}</h2>
 {% set count=[0] %}
 {% for item in datafromjson %}
@@ -35,7 +33,7 @@
 {% endfor %}
 </div>
 
-</div>
+<!-- </div> -->
 </div>
 
 {% set int_itemid = itemid|int %}

templates/diverge.html

@@ -1,7 +1,7 @@
 {% extends "layout.html" %}
 {% block content %}
 
-<div class="description">
+<div class="diversionpage content-block">
 
 <div class="diverge_all">
 <p>Sentences that have <i>{{ searchterm }}</i> in common : </p><br>

templates/home.html

@@ -2,7 +2,7 @@
 {% block content %}
 
 
-<div class="homecontent">
+<div class="homepage content-block">
 	<div class="explanation">
 		These keywords originate from all the written content embedded within the archive.
 	</div>

templates/layout.html

@@ -2,7 +2,7 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
+   <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
   <title>Pushing Scores</title>
   <link rel="stylesheet" href="{{ url_for('static', filename='/css/style.css') }}">
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
@@ -87,7 +87,6 @@
           <span>s
           <span>t
           <span>
-
           <span>o
           <span>f
           <span>
@@ -98,10 +97,6 @@
           <span>s
           <span>
 
-
-
-
-
           </span></span></span></span></span></span></span></span></span></span></span></span></span></span>
       </div>
     </a>

templates/listofwords.html

@@ -1,12 +0,0 @@
-{% extends "layout.html" %}
-
-{% block content %}
-{% if cookie is defined %}
-  {{ cookie }}
-{% endif %}
-
-{{ r }}
-{{ r0w }}
-{{ r0c }}
-{{ r0id }}
-{% endblock %}

templates/theindex.html

@@ -1,7 +1,7 @@
 {% extends "layout.html" %}
 {% block content %}
 
-<div class="allcontentindex">
+<div class="theindexpage content-block">
 
 <h2>Folders index</h2>
 
@@ -21,6 +21,5 @@
 </div>
 
 
-</div>
 </div>
 {% endblock %}