collection added

6 months ago · 752a80cb37
6 changed files with 103 additions and 10 deletions
--- a/app.py
+++ b/app.py
@ -15,6 +15,7 @@ class WikiApp(Flask):
        self.route('/', methods=['GET'])(self.homepage)
        self.route('/<string:title>', methods=['GET'])(self.page_content)
        self.route('/favicon.ico')(self.favicon)
+        self.route('/archive/<string:collection>', methods=['GET'])(self.get_collection)
    
    def fetch_pages_cat(self, category_page_list):
        all_pages_string = '|'.join(page for pages in category_page_list.values() for page in pages)
@ -45,10 +46,10 @@ class WikiApp(Flask):
            
    def fetch_all_pages(self, categories):
        category_page_list = {} 
-        
        for category in categories:
            response = requests.get(self.MEDIAWIKI_BASE_URL + self.BASE_API, params={'action': 'ask', 'query': '[[Concept:'+category+']]|?Article:Date', 'format': 'json', 'formatversion': '2'})
            data = response.json()
+            print(data)
            page_title_timestamps = {}
            for page_title, page_data in data['query']['results'].items():
                if 'printouts' in page_data and 'Article:Date' in page_data['printouts']:
@ -142,6 +143,12 @@ class WikiApp(Flask):
        for img in thumbnail:
            img.decompose()
        return soup
+    
+    def get_collection(self, collection):
+        resp = self.fetch_all_pages([collection])
+        data = self.fetch_pages_cat(resp)
+        return render_template('collection.html', nav_elements=self.get_nav_menu(), title=collection, collection=resp[collection])
+    
    # Route for favicon.ico to prevent Flask from raising an error
    def favicon(self):
        return Response('', status=200)
--- a/static/assets/styles.css
+++ b/static/assets/styles.css
@ -100,8 +100,11 @@ body {
 	height: 100vh;
 	margin-left: 40px;
 	margin-top: 100px;
-	padding-right: 400px;
+	margin-right: 40px;
+}

+.article-cont {
+	width: 60%;
 }

 .content-cont h1{
@ -129,7 +132,7 @@ body {
 	line-height: 30px;
 }

-.content-cont a {
+.content-cont .article-cont a {
 	color: black;
 	text-decoration: none;
 	background-color: white;
@ -171,13 +174,67 @@ body {
 }

 .section-cont {
-	width: 100% ;
+	width: 100vw;
 	height: 100vh;
 	display: flex;
 	flex-direction: row;
 	justify-content: space-between;
 }

+.collection-cont {
+	width: 100% ;
+	height: 100vh;
+	display: flex;
+	flex-direction: row;
+	justify-content: space-evenly;
+	align-content: baseline;
+	flex-wrap: wrap;
+	gap:60px;
+}
+
+.collection-title {
+	border: 2px;
+	border-radius: 20px;
+	border-style: solid;
+	border-color: white;
+	padding: 10px;
+}
+
+.collection-element {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	row-gap: 20px;
+}
+
+.collection-header{
+	font-size: 20px;
+	margin-top: 40px;
+}
+
+.content-cont .collection-cont a {
+	text-decoration: underline;
+    color: white;
+}
+
+.collection-cont .section-img{
+	width: 100%;
+	padding-left: 0px;
+	margin-bottom: 0px;
+}
+
+.collection-cont .section-img img{
+	width: 100%;
+    height: auto;
+    max-width: 200px;
+    object-fit: contain;
+    border-radius: 0px;
+    border: white;
+    border-style: dashed;
+    transition: transform 0.3s ease-in-out;
+}
+
+
 .section {
 	width: calc(100% / 3); /* Each div takes up one-third of the container */
 	display: flex;
@ -242,9 +299,14 @@ body {
 	align-items: center;
 }

+.section-header{
+	text-decoration: none;
+}
+
 .footer {
 	position: absolute;
 	right: 0px;
+	display: none;
 	top: 25px;
 	z-index: 500;
 }
--- a/templates/article.html
+++ b/templates/article.html
@ -3,8 +3,9 @@
 {% block content %}
 <div class='content-cont'>
 	<h1 class='content-header'>{{ title }}</h1>
-    
-    {{ content | safe }}
+    <div class='article-cont'>
+    	{{ content | safe }}
+	</div>
 	<div class='foot'></div>
 </div>

--- a/templates/base.html
+++ b/templates/base.html
@ -15,6 +15,8 @@
 				{% for key, element in nav_elements.items() %}
 				<div class='nav-element'><a href="{{ url_for('page_content', title=element.title) }}">{{ element.title }}</a><div class='spinning-star'>🞱</div></div>
 				{% endfor %}
+				<div class='nav-element'><a href="/archive/events">events</a><div class='spinning-star'>🞱</div></div>
+				<div class='nav-element'><a href="/archive/opportunities">opportunities</a><div class='spinning-star'>🞱</div></div>
 			</div>
 			
 		</div>
--- a/templates/collection.html
+++ b/templates/collection.html
@ -0,0 +1,21 @@
+{% extends "base.html" %}
+{% block title %}Ø | {{ title }}{% endblock %}
+{% block content %}
+<div class='content-cont'>
+	<div class='collection-header'>{{ '(' + title + ')'}}</div>
+	<div class='collection-cont'>
+    {% for key, values in collection.items() %}
+		
+		<div class='collection-element'>
+			<a href={{ '/' + key }}><div class='collection-title'> {{ key }} </div></a>
+			<div class='collection-date'> {{ values.date }} </div>
+			<a href={{ '/' + key }}><div class='section-img'><img src={{ values.source}}></div></a>
+		</div>
+		
+	{% endfor %}
+	
+	</div>
+	<div class='foot'></div>
+</div>
+
+{% endblock %}
--- a/templates/home.html
+++ b/templates/home.html
@ -3,7 +3,7 @@
 {% block content %}
 <div class='section-cont'>
 	<div class='section'>
-		<div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 3.3px; font-size: 25px; font-style: italic; object-fit: contain; font-family: monospace; color: white; text-shadow: white 0px 5px 5px; text-decoration: none; width: 100%;">articles&nbsp;<img src="https://i-love-everything.com/buttons/img/7.gif" style="max-height: 32px;"></div></div>
+		<a class='section-header' href='/archive/articles'><div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 3.3px; font-size: 25px; font-style: italic; object-fit: contain; font-family: monospace; color: white; text-shadow: white 0px 5px 5px; text-decoration: none; width: 100%;">articles&nbsp;<img src="https://i-love-everything.com/buttons/img/7.gif" style="max-height: 32px;"></div></div></a>
 		<div class='section-group'>
 		{% for key, values in articles.items() %}
 			<div class='section-element'><a href="{{ url_for('page_content', title=values.title) }}">↘ {{ values.title}}</a></div>
@ -13,7 +13,7 @@
 		</div>
 	</div>
 	<div class='section'>
-		<div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 2.2px; font-size: 25px; font-style: oblique; object-fit: contain; font-family: monospace;  color: white; text-shadow: red 0px 2px 5px; width: 100%;">newsletters<br><img src="https://i-love-everything.com/buttons/img/34.gif" style="max-height: 32px;"></div></div>
+		<a class='section-header' href='/archive/newsletters'><div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 2.2px; font-size: 25px; font-style: oblique; object-fit: contain; font-family: monospace;  color: white; text-shadow: red 0px 2px 5px; width: 100%;">newsletters<br><img src="https://i-love-everything.com/buttons/img/34.gif" style="max-height: 32px;"></div></div></a>
 		<div class='section-group'>
 			{% for key, values in newsletters.items() %}
 				<div class='section-element'><a href="{{ url_for('page_content', title=values.title) }}">↘ {{ values.title }}</a></div>
@ -23,7 +23,7 @@
 			</div>
 	</div>
 	<div class='section'>
-		<div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 3.3px; font-size: 25px; font-style: normal; object-fit: contain; font-family: monospace; color: white; border: 0px solid white; width: 100%;">projects<img src="https://i-love-everything.com/buttons/img/26.gif" style="max-height: 32px;"></div></div>
+		<a class='section-header' href='/archive/projects'><div class='section-title'><div style="display: inline-flex; text-align: center; justify-content: center; align-items: center; line-height: 100%; padding: 3.3px; font-size: 25px; font-style: normal; object-fit: contain; font-family: monospace; color: white; border: 0px solid white; width: 100%;">projects<img src="https://i-love-everything.com/buttons/img/26.gif" style="max-height: 32px;"></div></div></a>
 		<div class='section-group'>
 			{% for key, values in projects.items() %}
 				<div class='section-element'><a href="{{ url_for('page_content', title=values.title) }}">↘ {{ values.title }}</a></div>