Updated community site style

config/_default/config.toml

@@ -17,7 +17,10 @@ disablePathToLower = true
 enableRobotsTXT = true
 
 # Pagination for the blog posts (x posts per page)
-paginate = 9
+[pagination]
+  disableAliases = false
+  pagerSize = 9
+  path = 'page'
 
 
 # https://gohugo.io/getting-started/configuration-markup/

content/community/_index.adoc

@@ -1,13 +1,26 @@
 ---
-title: "Welcome to the PINE64 community!"
-date: 
-draft: false
-description:
+title: "Community"
+description: PINE64 is a community-driven company focused on creating high-quality, low-cost ARM devices and, more recently, RISC-V devices for individuals and businesses around the globe.
 aliases:
   - /web-irc/ # from pine64.com
 ---
 
-*PINE64* is a community-driven company focused on creating high-quality, low-cost ARM devices and, more recently, RISC-V devices for individuals and businesses around the globe. PINE64 made its debut with the link:/documentation/Pine_A64[PINE A64] single-board computer, which successfully launched on Kickstarter in 2015. PINE64 has since released a multitude of other devices, including both development boards and end-user devices.
+{{< box style="themewhite pad" >}}
+
+{{< box style="pad_s blueshadow" type="image" link="/img/slider_index_1.jpg" width="350" >}}{{</ box >}}
+
+  {{< box style="pad f50 rows" title="" content="markdown" >}}
+
+**Welcome to the PINE64 community!**
+
+_PINE64_ has a large, diverse and active community, and offers a variety of resources for hobbyists and businesses to successfully leverage various PINE64 products.
+
+To become connected and involved with the community, please see the channel list below for a list of available channels and chat platforms.
+  {{</ box >}}
+{{</ box >}}
+
+
+_PINE64_ is a community-driven company focused on creating high-quality, low-cost ARM devices and, more recently, RISC-V devices for individuals and businesses around the globe. PINE64 made its debut with the link:/documentation/Pine_A64[PINE A64] single-board computer, which successfully launched on Kickstarter in 2015. PINE64 has since released a multitude of other devices, including both development boards and end-user devices.
 
 For information about PINE64 branding, including the usage of the PINE64 logo in non-commercial and other applications, please read the link:Brand_and_logo[article about our brand and logo].
 

themes/pinetheme/assets/css/style.css

@@ -94,6 +94,9 @@ time {
 .pad_s h3 {
     padding-top: 0;
 }
+.blueshadow {
+    filter: drop-shadow(-10px 10px 0px #003380);
+}
 .gap {
     column-gap: 30px;
     row-gap: 30px;
@@ -163,17 +166,48 @@ div.themewhite h3 {
     color: #333;
 }
 div.themewhite p { 
-    color: #777;
+    color: #222222;
 }
 div.themecommunity {
-    background-color: rgb(34, 102, 153);
+    background-color: #003380;
     color: white;
-    text-shadow: 2px 2px 8px black;
-    font-weight: 500;
+    height: 15vw;
+    min-height: 300px;
+    background-image: url('/img/community_top_left.svg'), url('/img/community_top_right.svg');
+    background-repeat: no-repeat, no-repeat;
+    background-size: contain;
+    background-position: left, right;
+}
+div.themecommunity h1 {
+    font-size: 48pt;
+    font-weight: 400;
+    width: 600px;
+}
+div.themecommunity .box {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+@media screen and (max-width: 1000px){
+    div.themecommunity {
+        min-height: 200px;
+    }
+    div.themecommunity h1 {
+        font-size: 30pt;
+        max-width: 100%;
+    }
+}
+div.community_round {
+    background-color: #003380;
+    max-width: none !important;
+    width: 100%;
+    height: 10px;
+    border-bottom-left-radius: 50%;
+    border-bottom-right-radius: 50%;
 }
 div.themecontest {
     background-color: rgb(211, 211, 211);
-    background-image: url("/artwork/tria2_i.svg");
+    background-image: url("/img/tria2_i.svg");
     background-repeat: no-repeat;
     background-size: cover;
     color: white;
@@ -193,7 +227,7 @@ div.themeblog {
     color: white;
     font-weight: 400;
     background-color: #333;
-    background-image: url("/artwork/bg2.svg");
+    background-image: url("/img/bg2.svg");
     background-repeat: no-repeat;
     background-size: cover;
 }

themes/pinetheme/layouts/community/list.html

@@ -2,13 +2,10 @@
 
 <div class="box full themecommunity">
     <div class="box pad rows">
-        <h1>{{.Title}}</h1>
-
-        <p>PINE64 has a large, diverse and active community, and offers a variety of resources for hobbyists and businesses to successfully leverage various PINE64 products.</p>
-
-        <p>To become connected and involved with the community, please see the channel list below for a list of available channels and chat platforms.</p>
+        <h1>open. friendly.<br>community-driven.</h1>
     </div>
 </div>
+<div class="community_round"></div>
 
 <div class="box rows pad">
     {{.Content}}