Add Logo Section

thoughtbot · Jun 3, 2016 · 1a68e0a · 1a68e0a
1 parent db981d5
commit 1a68e0a
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 0 deletions.
diff --git a/source/_logo_section.html.erb b/source/_logo_section.html.erb
@@ -0,0 +1,8 @@
+<ul class="logo-section">
+ <li><img class="wide-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/master/source/images/placeholder_wide.png" alt=""></li>
+ <li><img class="square-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/49db8c0f2f8066c2c3a275781503fe3303a1a9fc/source/images/placeholder.png" alt=""></li>
+ <li><img class="square-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/49db8c0f2f8066c2c3a275781503fe3303a1a9fc/source/images/placeholder.png" alt=""></li>
+ <li><img class="wider-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/master/source/images/placeholder_wider.png" alt=""></li>
+ <li><img class="square-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/49db8c0f2f8066c2c3a275781503fe3303a1a9fc/source/images/placeholder.png" alt=""></li>
+ <li><img class="wide-logo" src="https://raw.githubusercontent.com/thoughtbot/refills/master/source/images/placeholder_wide.png" alt=""></li>
+</ul>
diff --git a/source/index.html.erb b/source/index.html.erb
@@ -115,6 +115,13 @@ title: Patterns
  <div class="refill-snippet"><%= code_for("maps") %></div>
  </section>
 
+ <section id="logo-section" class="refill">
+ <div class="refills-wrapper">
+ <div class="line-behind-text"><h6>Logo Section</h6></div>
+ <%= partial "logo_section" %>
+ </div>
+ </section>
+
  <section id="navigation" class="refill">
  <div class="refills-wrapper">
  <div class="line-behind-text"><h6>Navigation</h6></div>

diff --git a/source/stylesheets/all.css.scss b/source/stylesheets/all.css.scss
@@ -28,6 +28,7 @@
  @import "refills/grid-items-lines";
  @import "refills/hero";
  @import "refills/icon-bullet-points";
+ @import "refills/logo-section";
  @import "refills/maps";
  @import "refills/navigation";
  @import "refills/scroll-on-page";

diff --git a/source/stylesheets/refills/_logo-section.scss b/source/stylesheets/refills/_logo-section.scss
@@ -0,0 +1,25 @@
+.logo-section {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: center;
+ padding: 1em;
+
+ li {
+ align-self: center;
+ list-style: none;
+ padding: 2em;
+ text-align: center;
+
+ .square-logo {
+ max-height: 5em;
+ }
+
+ .wide-logo {
+ max-width: 10em;
+ }
+
+ .wider-logo {
+ max-width: 15em;
+ }
+ }
+}