Feedback improvements (#174)

* Add goodies page Add logo to main banner on mobite Donation page improvements * sidebar on tablet: fix positioning funders: add CTA * Review fixes
qgis · Feb 22, 2024 · 8927bd0 · 8927bd0
1 parent 7ff67a6
commit 8927bd0
Show file tree

Hide file tree

Showing 24 changed files with 154 additions and 23 deletions.
diff --git a/content/community/involve.md b/content/community/involve.md
@@ -10,7 +10,7 @@ sidebar: true
 {{< content-start  >}}
 ## Ways of Contributing
 
-[Participate in Support Channels](#participate-in-support-channels "scroll-on-page"), [Report Bugs](#report-bugs "scroll-on-page"), [QGIS Documentation](#qgis-documentation "scroll-on-page"), [Translate QGIS](#translate-qgis "scroll-on-page"), [Develop a Plugin](#develop-a-plugin "scroll-on-page"), [Develop QGIS Core](#develop-qgis-core "scroll-on-page"), [Sustain & Donate](#sustain--donate "scroll-on-page") 
+[Participate in Support Channels](#participate-in-support-channels "scroll-on-page") [Report Bugs](#report-bugs "scroll-on-page") [QGIS Documentation](#qgis-documentation "scroll-on-page") [Translate QGIS](#translate-qgis "scroll-on-page") [Develop a Plugin](#develop-a-plugin "scroll-on-page") [Develop QGIS Core](#develop-qgis-core "scroll-on-page") [Sustain & Donate](#sustain--donate "scroll-on-page") 
 
 {{< rich-box layoutClass="has-right rounded" >}}
 {{< rich-content themeClass="coloring-1" >}}

diff --git a/content/download/index.md b/content/download/index.md
@@ -11,7 +11,7 @@ url: '/download'
 
 {{< rich-box mode="html" layoutClass="has-right" id="donate-prompt">}}
 {{< rich-content themeClass="coloring-2" >}}
-## Support us
+## Before download starts
 
 QGIS is free of charge, and will always be free of charge if downloaded from QGIS.org.
 

diff --git a/content/goodies/img/hoodie.jpg b/content/goodies/img/hoodie.jpg
diff --git a/content/goodies/img/qgis-heart-logo.jpg b/content/goodies/img/qgis-heart-logo.jpg
diff --git a/content/goodies/img/qgis-q-logo (1).jpg b/content/goodies/img/qgis-q-logo (1).jpg
diff --git a/content/goodies/img/qgis-q-logo.jpg b/content/goodies/img/qgis-q-logo.jpg
diff --git a/content/goodies/img/qgis-q.jpg b/content/goodies/img/qgis-q.jpg
diff --git a/content/goodies/img/redbubble1.jpg b/content/goodies/img/redbubble1.jpg
diff --git a/content/goodies/img/redbubble2.jpg b/content/goodies/img/redbubble2.jpg
diff --git a/content/goodies/img/redbubble3.jpg b/content/goodies/img/redbubble3.jpg
diff --git a/content/goodies/img/redbubble4.jpg b/content/goodies/img/redbubble4.jpg
diff --git a/content/goodies/img/redbubble5.jpg b/content/goodies/img/redbubble5.jpg
diff --git a/content/goodies/img/thermos.jpg b/content/goodies/img/thermos.jpg
diff --git a/content/goodies/index.md b/content/goodies/index.md
@@ -0,0 +1,92 @@
+---
+type: "page"
+title: "Diversity statement"
+subtitle: ""
+draft: false
+sidebar: true
+---
+
+{{< content-start >}}
+
+
+Goodies
+===========================================
+
+If you are a fan of QGIS, you might want to visit our store so you can buy some momentos to show off your favourite desktop GIS. We have a number of great t-shirts, mugs, hoodies, caps and so on so pay a visit to one of our stores below!
+
+Buying QGIS apparel not only lets you show off the fact that you use QGIS, for every t-shirt sold a commission is given to the QGIS project.
+
+
+{{< columns-start >}}
+{{< column-start class="is-flex-direction-column is-one-third">}}
+## Spreadshirt
+We co-operate with Spreadshirt. They produce locally and ship the products to all countries in the world.
+
+[https://shop.spreadshirt.net/qgis/](https://shop.spreadshirt.net/qgis/)
+
+{{< column-end >}}
+
+{{< column-start class="is-flex-direction-column is-two-thirds">}}
+{{< columns-start >}}
+{{< column-start>}}
+![QGIS hoodie](img/hoodie.jpg)
+{{< column-end>}}
+{{< column-start>}}
+![QGIS tshirt](img/qgis-heart-logo.jpg)
+{{< column-end>}}
+{{< columns-end >}}
+
+{{< columns-start >}}
+{{< column-start>}}
+![QGIS mugs](img/qgis-q-logo.jpg)
+{{< column-end >}}
+{{< column-start>}}
+![QGIS thermos](img/thermos.jpg)
+{{< column-end >}}
+{{< column-start>}}
+![QGIS sign](img/qgis-q.jpg)
+{{< column-end>}}
+{{< columns-end >}}
+
+{{< column-end >}}
+{{< columns-end >}}
+
+
+
+
+{{< columns-start >}}
+{{< column-start class="is-flex-direction-column is-one-third">}}
+## Redbubble
+Some more creative and funny (but unofficial) designs can be found in the Red Bubble store.
+
+[https://www.redbubble.com/shop/qgis](https://www.redbubble.com/shop/qgis)
+
+{{< column-end >}}
+
+{{< column-start class="is-flex-direction-column is-two-thirds">}}
+{{< columns-start >}}
+{{< column-start>}}
+![QGIS hoodie](img/redbubble1.jpg)
+{{< column-end>}}
+{{< column-start>}}
+![QGIS tshirt](img/redbubble2.jpg)
+{{< column-end>}}
+{{< columns-end >}}
+
+{{< columns-start >}}
+{{< column-start>}}
+![QGIS mugs](img/redbubble3.jpg)
+{{< column-end >}}
+{{< column-start>}}
+![QGIS thermos](img/redbubble4.jpg)
+{{< column-end >}}
+{{< column-start>}}
+![QGIS sign](img/redbubble5.jpg)
+{{< column-end>}}
+{{< columns-end >}}
+
+{{< column-end >}}
+{{< columns-end >}}
+
+
+{{< content-end >}}
diff --git a/static/img/addsupporter.svg b/static/img/addsupporter.svg
diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/bulma/components/fund.sass b/themes/hugo-bulma-blocks-theme/assets/sass/bulma/components/fund.sass
@@ -44,6 +44,11 @@
     img
       filter: grayscale(1)
 
+.add-supporter 
+  a
+    text-align: center
+    color: #002033
+
 .supporters-grid 
   .large-supporter   
     border-radius: 10px

diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/bulma/components/sidebar.sass b/themes/hugo-bulma-blocks-theme/assets/sass/bulma/components/sidebar.sass
@@ -88,6 +88,9 @@
         margin: 0
 
 @media screen and (max-width: 1023px)
+    .content
+        >.columns >.is-3
+            padding: 0
     .sidebar
         background: #fff
         border-radius: 10px
@@ -110,6 +113,7 @@
         position: relative
         z-index: 3
         border-radius: 10px
+        margin-left: 0.75rem
         max-width: fit-content
 
         &.open

diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/bulma/elements/container.sass b/themes/hugo-bulma-blocks-theme/assets/sass/bulma/elements/container.sass
@@ -13,6 +13,8 @@ $container-max-width: $fullhd !default
     // padding-left: $gap
     // padding-right: $gap
     width: 100%
+  +tablet  
+    max-width: $tablet - $container-offset
   +desktop
     max-width: $desktop - $container-offset
   +until-widescreen

diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/bulma/elements/image.sass b/themes/hugo-bulma-blocks-theme/assets/sass/bulma/elements/image.sass
@@ -8,7 +8,6 @@ $dimensions: 16 24 32 48 64 96 128 !default
   img
     display: block
     height: auto
-    width: 100%
     &.is-rounded
       border-radius: $radius-rounded
   &.is-fullwidth

diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/bulma/layout/hero.sass b/themes/hugo-bulma-blocks-theme/assets/sass/bulma/layout/hero.sass
@@ -171,19 +171,23 @@ $hero-colors: $colors !default
   flex-shrink: 0
   padding: $hero-body-padding
   +mobile
-    padding: $hero-body-padding-v-large
     height: 100vh
+    min-height: 840px
+    display: flex
 
   .container 
     margin: auto
+    @media screen and (max-width: 769px)
+      display: flex
+      flex-direction: column-reverse
     .image 
       margin: auto
   .column
     @media screen and (max-width: 1024px)
       width: 100%
   .logo
     @media screen and (max-width: 1024px)
-      display: none
+      padding: 0rem
   .scroll-down
     margin-top: 9rem
     @media screen and (min-width: 769px)
@@ -199,18 +203,21 @@ $hero-colors: $colors !default
   padding: 3rem 0;
 
 .hero 
-  image 
+  img 
     max-height: 380px  
+    @media screen and (max-width: 769px)
+      max-height: 220px  
   .title:not(.is-spaced) + .subtitle
     margin-top: 0px
   .button  
     margin-right: 2.5rem
   .hero-container
     margin-bottom: 60px
   .label 
-    background: $warning;
-    display: inline-block;
-    padding: 5px 15px;
-    font-weight: 400;
-    border-radius: 100px;
+    border: 2px solid #ee7914
+    color: white
+    display: inline-block
+    padding: 5px 15px
+    font-weight: 400
+    border-radius: 100px
 
diff --git a/themes/hugo-bulma-blocks-theme/assets/sass/style.sass b/themes/hugo-bulma-blocks-theme/assets/sass/style.sass
@@ -21,6 +21,13 @@ h2
   @media screen and (max-width: 768px)
     font-size: 2.25rem
 
+@media screen and (max-width: 1024px)
+  .content
+    >.columns
+      display: block
+      .content 
+        width: 100%
+
 .alpha70
   opacity: 70%
 
@@ -393,6 +400,12 @@ h2
 
 .scroll-on-page
   font-size: 14px
+  padding: 3px 12px
+  margin: 0 2px 5px 0px
+  display: inline-block
+  white-space: nowrap
+  border-radius: 30px
+  background: #58963217
 
 .left-title
   padding-right: 4rem

diff --git a/themes/hugo-bulma-blocks-theme/layouts/partials/banner.html b/themes/hugo-bulma-blocks-theme/layouts/partials/banner.html
@@ -52,13 +52,6 @@ <h1 class="title hero-title pr-3">
                     </figure>
                 </div>
             {{ end }}
-            <div
-                class="scroll-down is-flex is-justify-content-center"
-            >
-                <figure>
-                    <img src="{{ absURL "img/scroll-down.svg" }}" />
-                </figure>
-            </div>
         </div>
     </section>
 {{ end }}
diff --git a/themes/hugo-bulma-blocks-theme/layouts/partials/funders-simple.html b/themes/hugo-bulma-blocks-theme/layouts/partials/funders-simple.html
@@ -1,10 +1,23 @@
 <section class="section">
     <div class="container">
-        <h2 class="pb-2">
-            QGIS supporters
-        </h2>
-
+        <div class="pb-2">
+            <h2>
+                QGIS supporters
+            </h2>
+        </div>
         <div class="supporters-grid large-grid">
+            <div class="large-supporter is-vertical is-flex fund-Flagship add-supporter">
+                <article class="tile is-child box is-transparent is-flex is-justify-content-center is-align-items-center">
+                    <a href="/community/members/sustaining_member/">
+                        <figure>
+                            <img src="{{ .Site.BaseURL }}/img/addsupporter.svg" alt="add supporter">
+                        </figure>
+                      </a>
+                </article>
+                <a class="partner-title" href="/community/members/sustaining_member/">
+                    Add your logo here?
+                </a>
+            </div>
             {{ $.Scratch.Set "counter" 0 }}
             {{ $headlessbundle := .Site.GetPage "/funders" }}
             {{ range ( $headlessbundle.Resources.ByType "page" ) }}

diff --git a/themes/hugo-bulma-blocks-theme/layouts/shortcodes/hide-donate-prompt.html b/themes/hugo-bulma-blocks-theme/layouts/shortcodes/hide-donate-prompt.html
@@ -1 +1 @@
-<button class="button is-info is-inverted" id="hide-donate-prompt" onclick="hidePrompt()">I don’t want to participate</button>
+<button class="button is-primary6" id="hide-donate-prompt" onclick="hidePrompt()">Skip it and go to download</button>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<button class="button is-info is-inverted" id="hide-donate-prompt" onclick="hidePrompt()">I don’t want to participate</button>
		<button class="button is-primary6" id="hide-donate-prompt" onclick="hidePrompt()">Skip it and go to download</button>