Merge pull request #10 from ClubCedille/feature/EHP/add-changements

add changes into about sections

assets/scss/layout/_home.scss

@@ -31,6 +31,35 @@
 		}
 	}
 
+	.about-section{
+		background: #121212;
+		.content {
+			h4 {
+				padding-bottom: 13px;
+				font-family: $roboto;
+				font-size: 18px;
+				text-transform: uppercase;
+				color: $primary-color;
+				font-weight:bold;
+			}
+			p {
+				font-size: 16px;
+				color: rgba(175, 175, 175, 0.8) ;
+
+			}
+			ul {
+				list-style: inside;
+			}
+			li {
+				font-size: 16px;
+				color: rgba(175, 175, 175, 0.8);
+			}
+			.btn {
+				margin-top: 30px;
+			}
+		}
+	}
+
 	/* Case Study Title */
 	.box-subtitle,
 	.box-title{
@@ -57,6 +86,17 @@
 		padding-bottom: 180px;
 	}
 
+	.about-section-content{
+	    padding-top: 58px;
+	    padding-bottom: 90px;
+	}
+
+	.about-section-content:nth-child(odd){
+		// background: #121212;
+		padding-top: 100px;
+		padding-bottom: 90px;
+	}
+
 
 /**********************************************
  Clients Logo Style

assets/scss/layout/_pricing-table.scss

@@ -45,7 +45,7 @@
 }
 
 .pricing-list{
-    padding: 43px 0 30px;
+    padding: 43px 15px 30px;
 }
 
 .features-list{
@@ -129,6 +129,9 @@ hr.hr-border{
 		-webkit-transform: scale(0);
 		transition: 0.5s;
 	}
+	h4{
+		line-height: 1.5;
+	}
 }
 
 .border-effect {

component-library/components/sections/about-section/about-section.bookshop.yml

@@ -0,0 +1,27 @@
+# Metadata about this component, to be used in the CMS
+spec:
+  structures:
+    - content_blocks
+  label: About section
+  description: Title and left right blocks
+  icon: vertical_split
+  tags: []
+
+# Defines the structure of this component, as well as the default values
+blueprint:
+  background: grey
+  left_right_blocks: [bookshop:simple/left-right-block]
+
+# Overrides any fields in the blueprint when viewing this component in the component browser
+preview:
+  left_right_blocks: 
+   - bookshop:simple/left-right-block
+
+# Any extra CloudCannon inputs configuration to apply to the blueprint
+_inputs:
+  background:
+    type: select
+    options:
+      values:
+        - grey
+        - black

component-library/components/sections/about-section/about-section.hugo.html

@@ -0,0 +1,5 @@
+<section class="about-section case-study--{{ .background }}">
+    {{ range .left_right_blocks }}
+        {{ partial "bookshop" (slice "simple/left-right-content" .)}}
+    {{ end }}
+  </section>

component-library/components/sections/about-section/about-section.scss

@@ -0,0 +1,3 @@
+.case-study--black {
+    background-color: #121212;
+}

component-library/components/simple/left-right-content/left-right-content.bookshop.yml

@@ -0,0 +1,46 @@
+# Metadata about this component, to be used in the CMS
+spec:
+  structures:
+    - ""
+  label: Left right block
+  description: Content and image in two columns
+  icon: vertical_split
+  tags: []
+
+# Defines the structure of this component, as well as the default values
+blueprint:
+  image_alignment: right
+  background: grey
+  heading: ""
+  content_html: ""
+  link: bookshop:generic/link
+  image: ""
+  image_alt: ""
+
+# Overrides any fields in the blueprint when viewing this component in the component browser
+preview:
+  heading: E Banks That Accept Us Casino Players
+  content_html: Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
+    nonummy nibh euiyd tincidunt ut laoreet dolore magna aliquam nibh
+    utpat.Ullamcorper suscipit lobo nibh euiyd tinci- dunt ut laoreet.</br>
+    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rem impedit
+    molestias cumque dolorum, sunt, provident blanditiis tempora, aut explicabo
+    error ipsa repudiandae. Dolores eius eaque eum mollitia esse nisi
+    necessitatibus distinctio ea, dolorem non, optio minima temporibus
+    blanditiis, quidem aperiam!</p>
+  image: /images/case-study/case-study-img1.png
+
+# Any extra CloudCannon inputs configuration to apply to the blueprint
+_inputs:
+  image_alignment:
+    type: select
+    options:
+      values:
+        - right
+        - left
+  background:
+    type: select
+    options:
+      values:
+        - grey
+        - black

component-library/components/simple/left-right-content/left-right-content.hugo.html

@@ -0,0 +1,21 @@
+<!-- About Section Description top section -->
+<div class="about-section-content left-right-block--{{ .background }} left-right-block--{{ .image_alignment }}">
+    <div class="container">
+        <div class="row">
+            <div class="col-md-6">
+                <!-- inner sub-title -->
+                <div class="content">
+                    <h4 class="inner-title"> {{ .heading }}</h4>
+                    <p class="case-description">{{ .content_html | safeHTML }}</p>
+                    <!-- View More Details -->
+                    {{ partial "bookshop" (slice "generic/link" .link )}}
+                </div>
+            </div>
+            <div class="col-md-6">
+                <div class="img-content">
+                    <img class="img-responsive" src="{{ .image }}" alt="{{ .image_alt }}">
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

component-library/components/simple/left-right-content/left-right-content.scss

@@ -0,0 +1,72 @@
+.content h4 {
+    padding-bottom: 13px;
+    font-family: "Roboto", sans-serif;
+    font-size: 18px;
+    text-transform: uppercase;
+    color: #facd8a;
+    font-weight: bold;
+}
+.content p {
+    font-size: 16px;
+    color: rgba(175, 175, 175, 0.8);
+}
+
+.content .btn {
+    margin-top: 30px;
+}
+
+.left-right-block--black {
+    background-color: #121212;
+}
+.left-right-block--grey {
+    background-color: #171717;
+}
+
+.left-right-block--right {
+    .row {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        .col-md-6 {
+            grid-row: 1;
+            width: 100%;
+        }
+    }
+    @media only screen and (min-width: 1px) and (max-width: 991px) {
+        .row {
+            grid-template-columns: 1fr;
+            .col-md-6:last-child {
+                grid-row: 2;
+            }
+        }
+    }
+}
+
+.left-right-block--left {
+    .row {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        .col-md-6 {
+            grid-row: 1;
+            width: 100%;
+        }
+        .col-md-6:first-child {
+            grid-column: 2;
+        }
+        .col-md-6:last-child {
+            grid-column: 1;
+        }
+    }
+    @media only screen and (min-width: 1px) and (max-width: 991px) {
+        .row {
+            grid-template-columns: 1fr;
+            .col-md-6:last-child {
+                grid-column: 1;
+                grid-row: 1;
+            }
+            .col-md-6:first-child {
+                grid-column: 1;
+                grid-row: 2;
+            }
+        }
+    }
+}

component-library/components/simple/pricing-plan/pricing-plan.hugo.html

@@ -7,7 +7,7 @@ <h4 class="pricing-title">{{ .heading }}</h4>
             <br>
         </div>
         <div class="pricing-list border-effect">
-            <h5>{{ .text }}</h5>
+            <h4>{{ .text }}</h4>
         </div>
     </div>
 </div>

content/about.md

@@ -15,10 +15,10 @@ content_blocks:
       heading: Les Raconteurs d'Angles
     content: >
         La troupe de théâtre Les Raconteurs d'angles vise à combler un manque dans les activités culturelles de l’ÉTS par l’implémentation d’une troupe de création théâtrale et par la mise en place d’activités promouvant les arts de la scène sous toutes ses formes. On parle donc ici d’aider à développer la créativité, les habiletés de communication et de gestion de projet de la communauté de l'ÉTS tout en mettant en valeur ce que les différents génies peuvent offrir dans une production théâtrale.
-  - _bookshop_name: sections/case-study
+  - _bookshop_name: sections/about-section
     background: grey
     left_right_blocks:
-      - _bookshop_name: simple/left-right-block
+      - _bookshop_name: simple/left-right-content
         image_alignment: right
         background: grey
         heading: Nos objectifs
@@ -33,7 +33,7 @@ content_blocks:
           minima temporibus blanditiis, quidem aperiam!</p>
         image: /images/case-study/case-study-img1.png
         image_alt:
-      - _bookshop_name: simple/left-right-block
+      - _bookshop_name: simple/left-right-content
         image_alignment: left
         background: black
         heading: Nos valeurs

content/partnership/_index.md

@@ -1,5 +1,5 @@
 ---
-title: Blog
+title: Partenaires
 seo_options:
   description: Landing page for all blog posts
   featured_image: