activity list added

app.py

@@ -16,6 +16,7 @@ class WikiApp(Flask):
         # Define routes
         # self.route('/', methods=['GET'])(self.homepage)
         self.route('/', methods=['GET'])(self.home)
+        self.route('/activities', methods=['GET'])(self.activities)
         self.route('/data', methods=['GET'])(self.data_int)
         self.route('/newsletter/<string:title>', methods=['GET'])(self.generate_newsletter)
         self.route('/publications', methods=['GET'])(self.fetch_publications)
@@ -39,6 +40,21 @@ class WikiApp(Flask):
         print(table)
         return render_template('index.html', title=pages[0], cont=homepage_content, table=table)
     
+    def activities(self):
+        # fetch publications as test
+        activity_list = self.get_activities()
+        return render_template('activities.html', title="Activities", activities=activity_list)
+    
+    def get_activities(self):
+        concepts = ['Newsletters', 'Projects']
+        publication_page_list = self.fetch_all_pages(concepts)
+        updated_cat_list = self.fetch_pages_cat(publication_page_list)
+        projects = updated_cat_list.get('Projects', [])
+        sorted_prj = dict(sorted(projects.items(), key=lambda item: datetime.strptime(item[1]['date'], "%d.%m.%Y" ), reverse=True) )
+        newsletters = updated_cat_list.get('Newsletters', [])
+        sorted_nl = dict(sorted(newsletters.items(), key=lambda item: datetime.strptime(item[1]['date'], "%d.%m.%Y" ), reverse=True) )
+        return sorted_nl
+       
     def data_int(self):
         return render_template('data.html')
          

static/assets/styles.css

@@ -136,6 +136,12 @@ a {
     background-color: black; /* Color of the line */
 }
 
+#activity-list {
+    display: flex;
+    flex-direction: column;
+    gap: 40px;
+}
+
 /*
     table
 */
@@ -149,7 +155,8 @@ table {
     border-spacing: 20px;
     border-color: gray;
     border-radius: 30px;
-    font-size: 16px;
+    font-size: 20px;
+    text-align: left;
 }
 
 th {
@@ -208,6 +215,31 @@ p {
     font-weight: bold;
 }
 
+.activity {
+    color: black;
+    display: flex;
+    flex-direction: column;
+    gap:20px;
+}
+
+.activity-title {
+    text-decoration: underline;
+    font-weight: bold;
+}
+
+.activity-image {
+    width: 60%;
+    height: 400px;
+    overflow: hidden;
+}
+
+.activity-image img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    object-position: center;
+}
+
 /* headers */
 h4 {
     font-size: 24px;

templates/_activities.html

@@ -0,0 +1,5 @@
+<div id="main-container">
+    {% include "_nav.html" %}
+    <div id="line-divider"></div>
+    {% include "_list.html" %}
+</div>

templates/_article.html

@@ -0,0 +1,14 @@
+<div id="content-container" class="disable-scrollbar">
+    <div id="content-title" class="title">{{ title | safe }}</div>
+    <div id="content-body">
+        {{ cont | safe }}
+    </div>
+    <div class="astr-line">&#x2732; &#x2732; &#x2732;</div>
+    <div id="content-metadata">
+        {%if table != None %}
+        <div id="wiki-box">
+            {{ table | safe }}
+        </div>
+        {%endif%}
+    </div>
+</div>

templates/_list.html

@@ -0,0 +1,25 @@
+<div id="content-container" class="disable-scrollbar">
+    <div id="content-title" class="title">{{ title | safe }}</div>
+    <p>This is our activities!</p>
+    <div class="astr-line">&#x2732; &#x2732; &#x2732;</div>
+    <div id="content-body">
+        <div id="activity-list">
+        {% for key, value in activities.items() %}
+            <a href="/{{key}}">
+                <div class="activity">
+                    <h1 class="activity-title"> {{ key }} ({{ value.date }})</h1>
+                    <div class="activity-image"><img src="{{ value.source }}"></div>
+                </div>
+            </a>
+        {% endfor %}
+        </div>
+    </div>
+    <div class="astr-line">&#x2732; &#x2732; &#x2732;</div>
+    <div id="content-metadata">
+        {%if table != None %}
+        <div id="wiki-box">
+            {{ table | safe }}
+        </div>
+        {%endif%}
+    </div>
+</div>

templates/_main.html

@@ -0,0 +1,5 @@
+<div id="main-container">
+{% include "_nav.html" %}
+<div id="line-divider"></div>
+{% include "_article.html" %}
+</div>

templates/_nav.html

@@ -0,0 +1,32 @@
+<div id="index-container" class="disable-scrollbar">
+    <a href="/"><div id="index-header">
+        <div class="ascii">  
+  .g8"""bgd   .g8""8q. `7MN.   `7MF' .g8"""bgd `7MM"""YMM  `7MM"""Mq. MMP""MM""YMM 
+.dP'     `M .dP'    `YM. MMN.    M .dP'     `M   MM    `7    MM   `MM.P'   MM   `7 
+dM'       ` dM'      `MM M YMb   M dM'       `   MM   d      MM   ,M9      MM      
+MM          MM        MM M  `MN. M MM            MMmmMM      MMmmdM9       MM      
+MM.         MM.      ,MP M   `MM.M MM.           MM   Y  ,   MM            MM      
+`Mb.     ,' `Mb.    ,dP' M     YMM `Mb.     ,'   MM     ,M   MM            MM      
+  `"bmmmd'    `"bmmd"' .JML.    YM   `"bmmmd'  .JMMmmmmMMM .JMML.        .JMML.  </div>       
+<div class="ascii">  
+`7MN.   `7MF'`7MMF'   `7MF'`7MMF'      `7MMF'      
+  MMN.    M    MM       M    MM          MM        
+  M YMb   M    MM       M    MM          MM        
+  M  `MN. M    MM       M    MM          MM        
+  M   `MM.M    MM       M    MM      ,   MM      , 
+  M     YMM    YM.     ,M    MM     ,M   MM     ,M 
+.JML.    YM     `bmmmmd"'  .JMMmmmmMMM .JMMmmmmMMM </div> 
+        <div class="astr-line">&#x2732; &#x2732; &#x2732;</div>
+    </div></a>
+    <div id="index-content">
+        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum consequat dignissim justo, posuere imperdiet justo condimentum at.</p>
+                      
+    </div>
+    <div id="index-links">
+        <div id="index-link-list">
+            <div><a href="#" class="button-link">e-mail &#8595;</a></div>
+            <div><a href="/activities" class="button-link">activities &#8595;</a></div>
+            <div><a href="#" class="button-link">newsletter &#8595;</a></div>
+        </div>
+    </div>
+</div>

templates/activities.html

@@ -0,0 +1,9 @@
+{% extends "_base.html" %}
+
+{% block title %}CONCEPT NULL{% endblock %}
+
+{% block content %}
+
+{% include "_activities.html" %}
+
+{% endblock %}

templates/index.html

@@ -3,56 +3,7 @@
 {% block title %}CONCEPT NULL{% endblock %}
 
 {% block content %}
-<div id="main-container">
-    <div id="index-container" class="disable-scrollbar">
-        <a href="/"><div id="index-header">
-            <div class="ascii">  
-  .g8"""bgd   .g8""8q. `7MN.   `7MF' .g8"""bgd `7MM"""YMM  `7MM"""Mq. MMP""MM""YMM 
-.dP'     `M .dP'    `YM. MMN.    M .dP'     `M   MM    `7    MM   `MM.P'   MM   `7 
-dM'       ` dM'      `MM M YMb   M dM'       `   MM   d      MM   ,M9      MM      
-MM          MM        MM M  `MN. M MM            MMmmMM      MMmmdM9       MM      
-MM.         MM.      ,MP M   `MM.M MM.           MM   Y  ,   MM            MM      
-`Mb.     ,' `Mb.    ,dP' M     YMM `Mb.     ,'   MM     ,M   MM            MM      
-  `"bmmmd'    `"bmmd"' .JML.    YM   `"bmmmd'  .JMMmmmmMMM .JMML.        .JMML.  </div>       
-<div class="ascii">  
-`7MN.   `7MF'`7MMF'   `7MF'`7MMF'      `7MMF'      
-  MMN.    M    MM       M    MM          MM        
-  M YMb   M    MM       M    MM          MM        
-  M  `MN. M    MM       M    MM          MM        
-  M   `MM.M    MM       M    MM      ,   MM      , 
-  M     YMM    YM.     ,M    MM     ,M   MM     ,M 
-.JML.    YM     `bmmmmd"'  .JMMmmmmMMM .JMMmmmmMMM </div> 
-            <div class="astr-line">&#x2732; &#x2732; &#x2732;</div>
-        </div></a>
-        <div id="index-content">
-            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum consequat dignissim justo, posuere imperdiet justo condimentum at. Sed eget odio vitae velit efficitur facilisis lacinia eget libero. Donec ex magna, laoreet id hendrerit at, varius et sem. Phasellus tempor ante in felis vehicula, vitae rhoncus tellus posuere. Ut nec sodales urna. Sed molestie lectus vel dolor maximus, sed cursus urna mattis. Cras eu mauris sit amet mauris lacinia accumsan vitae eu arcu. Duis quis mollis mauris. Maecenas condimentum ac tortor vel sodales. Fusce eget erat ut odio interdum porta. Donec placerat nisl id dui dapibus, finibus volutpat massa placerat. Donec commodo pellentesque ipsum eget ullamcorper. Praesent fermentum sit amet turpis sit amet sagittis. Aliquam tempus, sapien eget tincidunt luctus, urna felis molestie dolor, ac blandit arcu erat vitae eros. Morbi a lacus laoreet, varius eros ut, rutrum nibh.</p>
 
-        </div>
+{% include "_main.html" %}
-        <div id="index-links">
-            <div id="index-link-list">
-                <div><a href="#" class="button-link">e-mail &#8595;</a></div>
-                <div><a href="#" class="button-link">activities &#8595;</a></div>
-                <div><a href="#" class="button-link">newsletter &#8595;</a></div>
-            </div>
-        </div>
-    </div>
 
-    <div id="line-divider"></div>
-
-    <div id="content-container" class="disable-scrollbar">
-        <div id="content-title" class="title">{{ title | safe }}</div>
-        <div id="content-body">
-            {{ cont | safe }}
-        </div>
-        <div class="title astr-line">&#x2732; &#x2732; &#x2732;</div>
-        <div id="content-metadata">
-            {%if table != None %}
-            <div id="wiki-box">
-                {{ table | safe }}
-            </div>
-            {%endif%}
-        </div>
-        
-    </div>
-</div>
 {% endblock %}