Updated pages, created members page etc

themes/openalt/_config.yml

@@ -7,7 +7,6 @@ banner: images/assets/OpenAlt_RO_White.svg
 favicon: images/assets/OpenAltRomania.svg
 fontawesome: https://kit.fontawesome.com/bae8420862.js    # Use your own kit here
 primary_color: '#ce1126 !important'
-tag_border: false   # Add border to tags
 
 #Footer
 hexo: true    # Display "Powered by Hexo" in footer
@@ -36,6 +35,9 @@ topbar_menu:
   - enable: true
     name: About Us
     url: /p/AboutUs/AboutUs.html
+  - enable: true
+    name: Contact
+    url: /p/Contact/Contact.html
   - enable: true
     name: OpenAlt
     url: https://openalt.org

themes/openalt/layout/_partial/members.ejs

@@ -0,0 +1,35 @@
+<% counter = 0;
+site.data.members.forEach(function(member) { %>
+    <div class="member">
+        <% if (counter % 2 === 0 ) { %>
+            <div class="page-img">
+                <img src="<%= member.picture %>" alt="<%= member.name %>">
+            </div>
+        <% } %>
+        <div class="page-text">
+            <h1><%= member.name %></h1>
+            <p>Role: <%= member.role %></br>
+            <snap class="smoll">Since <%= member.join_date %></snap></br>
+            <%= member.bio %></p>
+            <span class="member-social">
+                <% member.contact.forEach(function(social) { %> 
+                    <span class="social-icon">
+                        <a href="<%= social.url %>" target="_blank">
+                            <% if (theme.fontawesome) { %>
+                                <i class="<%= social.icon %>"></i>
+                            <% } else { %>
+                                <img src='<%= url_for(theme.avatar) %>'></img>
+                            <% } %>
+                        </a>
+                    </span>
+                <% }); %>
+            </span>
+        </div>
+        <% if (counter % 2 === 1 ) { %>
+            <div class="page-img">
+                <img src="<%= member.picture %>" alt="<%= member.name %>">
+            </div>
+        <% } %>
+    </div>
+<% counter = counter + 1
+}); %>

themes/openalt/layout/_partial/post_feed.ejs

@@ -18,7 +18,7 @@
             <%- post.event.date %> at <%- post.event.time %>
         </h2>
 
-        <h3 class="event-spacer">
+        <h3 class="event-spacer"Bashy.jpg>
             <a href='<%- post.event.place.link %>'><i class="fa fa-map-marker-alt"></i> <%- post.event.place.name %></a>
         </h3>
 

themes/openalt/layout/page.ejs

@@ -1 +1,22 @@
-<%- include("_partial/article", { page: page }) %>
+<div class="page">
+    <% if(page.photos && page.photos.length) { %>
+        <div class="post-cover">
+            <img class="gallery" src="<%- config.root %><%- page.photos[0] %>" alt="<%- page.title || "Untitled" %>">
+        </div>
+    <% } %>
+
+    <div class="post-text-wrapper">
+        <div class="post-text">
+            <div class="post-header">
+                <h1 class="article"><%= page.title  || "Untitled" %></h1>
+            </div>
+            <div class="post-content">
+                <%- page.content %>
+            </div>
+        </div>
+    </div>
+</div>
+
+<% if (page.title === "Get in Touch") {%>
+    <%- include("_partial/members", { page: page })%>
+<% }%>

themes/openalt/source/css/style.css

@@ -66,7 +66,7 @@ a {
 
 /* Topbar menu section */
 nav {
-  width: 80%;
+  width: 70%;
   background-color: #0D1117 !important;
   list-style: none;
   display: flex;
@@ -110,7 +110,7 @@ nav a {
 
 /* Posts */
 main {
-    width: 80%;
+    width: 70%;
     margin: 30px auto 0 auto;
     flex: 1;
 }
@@ -189,7 +189,7 @@ iframe {
 
 /* Post - Top section */
 .post-page{
-    width: 75%;
+    width: 80%;
     margin: 0 auto;
 }
 
@@ -204,7 +204,7 @@ iframe {
 }
 
 .post-page .post-text{
-    width: 75%;
+    width: 80%;
     margin: 0 auto;
     padding: 40px 0;
 }
@@ -332,3 +332,60 @@ section {
 .footer a {
     color: #dcdcdf !important;
 }
+
+
+/* Page - Members */
+.member {
+    display: flex !important;
+    flex-wrap: nowrap !important;
+    align-items: center;
+    gap: 5%;
+    margin-top: 50px;
+    margin: 0 auto;
+}
+.member-wrapper{
+    width: 80%;
+}
+
+.member .page-img  img {
+    border-radius: 250px;
+    border: 2px solid #ce1126; 
+    width: auto;
+    height: auto;
+    max-width: 90%;
+    margin: auto;
+    display: block;
+}
+
+.member .page-img {
+    flex: 0 0 25%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.member .page-text {
+    flex: 0 0 70%; 
+    border-radius: 5px;
+    margin: 0 auto;
+    padding: 25px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+}
+
+
+/* page settings */
+.page{
+    width: 50%;
+    margin: 0 auto;
+}
+
+.page,
+.page h1,
+.page h2,
+.member,
+.member h1,
+.member h2{
+    color: #dcdcdf;
+}