From 42790930d6fb07e98356ffbd85d946bf96b1d604 Mon Sep 17 00:00:00 2001
From: piensaenpixel <piensaenpixel@gmail.com>
Date: Mon, 25 Apr 2016 18:31:52 +0200
Subject: [PATCH 1/2] add new component

---
 src/scss/cdb-components/boxes.scss           |  9 +++
 src/scss/cdb-components/forms/dropdowns.scss | 62 ++++++++++++++++++++
 src/scss/cdb-components/forms/inputs.scss    |  8 +++
 src/scss/cdb-components/menu.scss            |  6 ++
 4 files changed, 85 insertions(+)

diff --git a/src/scss/cdb-components/boxes.scss b/src/scss/cdb-components/boxes.scss
index 7289585..d7211ae 100644
--- a/src/scss/cdb-components/boxes.scss
+++ b/src/scss/cdb-components/boxes.scss
@@ -21,6 +21,15 @@
   box-shadow: 0  $baseSize  $baseSize * 2 0 rgba(0, 0, 0, 0.16);
 }
 
+.CDB-Box-ModalHeader {
+  background: $cSecondaryBackground;
+}
+.CDB-Box-ModalHeaderItem {
+  @include display-flex();
+  @include align-items(center);
+  padding: $baseSize + 4 $baseSize * 2;
+  border-bottom: 1px solid $cMainLine;
+}
 
 /* SG
 # Boxes/Loader
diff --git a/src/scss/cdb-components/forms/dropdowns.scss b/src/scss/cdb-components/forms/dropdowns.scss
index 5ca9443..f78bd63 100644
--- a/src/scss/cdb-components/forms/dropdowns.scss
+++ b/src/scss/cdb-components/forms/dropdowns.scss
@@ -44,6 +44,68 @@
     </ul>
   </div>
 </div>
+
+
+  <div class="CDB-Box-Modal">
+    <div class="CDB-Box-ModalHeader">
+      <nav class="CDB-NavMenu">
+        <ul class="CDB-NavMenu-Inner CDB-NavMenu-Inner--no-margin CDB-NavMenu-Inner--is-dropdown CDB-Text is-semibold CDB-Size-medium">
+          <li class="CDB-NavMenu-Item">
+            <button class="CDB-NavMenu-Link">SOLID</button>
+          </li>
+          <li class="CDB-NavMenu-Item is-selected">
+            <button class="CDB-NavMenu-Link">BY VALUE</button>
+          </li>
+        </ul>
+      </nav>
+      <div class="CDB-Box-ModalHeaderItem">
+        <input type="text" name="text" placeholder="DejaVu Sans" class="CDB-InputTextPlain CDB-Text">
+        <button class="u-lSpace--xl">
+          <div class="CDB-Shape">
+            <div class="CDB-Shape-magnify is-blue is-small"></div>
+          </div>
+        </button>
+      </div>
+    </div>
+    <br/>
+    <br/>
+    <br/>
+    <br/>
+  </div>
+
+  <br/>
+  <br/>
+  <br/>
+  <br/>
+
+  <div class="CDB-Box-Modal">
+    <div class="CDB-Box-ModalHeader">
+      <nav class="CDB-NavMenu">
+        <ul class="CDB-NavMenu-Inner CDB-NavMenu-Inner--no-margin CDB-NavMenu-Inner--is-dropdown CDB-Text is-semibold CDB-Size-medium">
+          <li class="CDB-NavMenu-Item">
+            <button class="CDB-NavMenu-Link">SOLID</button>
+          </li>
+          <li class="CDB-NavMenu-Item is-selected">
+            <button class="CDB-NavMenu-Link">BY VALUE</button>
+          </li>
+        </ul>
+      </nav>
+      <div class="CDB-Box-ModalHeaderItem">
+        <input type="text" name="text" placeholder="DejaVu Sans" class="CDB-InputTextPlain CDB-Text">
+        <button class="u-lSpace--xl">
+          <div class="CDB-Shape">
+            <div class="CDB-Shape-close is-blue is-large"></div>
+          </div>
+        </button>
+      </div>
+    </div>
+    <br/>
+    <br/>
+    <br/>
+    <br/>
+  </div>
+
+
 ```
 */
 
diff --git a/src/scss/cdb-components/forms/inputs.scss b/src/scss/cdb-components/forms/inputs.scss
index 950aa91..151975c 100644
--- a/src/scss/cdb-components/forms/inputs.scss
+++ b/src/scss/cdb-components/forms/inputs.scss
@@ -38,6 +38,14 @@
     @include default-form-error-style();
   }
 }
+.CDB-InputTextPlain {
+  width: 100%;
+  border: 0;
+  background: transparent;
+  font-size: $sFontSize-medium;
+  line-height: $sLineHeight-medium;
+  box-sizing: border-box;
+}
 
 .CDB-FieldError .CDB-InputText {
   @include default-form-error-style();
diff --git a/src/scss/cdb-components/menu.scss b/src/scss/cdb-components/menu.scss
index f3d0336..9e260cb 100644
--- a/src/scss/cdb-components/menu.scss
+++ b/src/scss/cdb-components/menu.scss
@@ -107,6 +107,12 @@
   margin-bottom: 18px;
   border-bottom: 1px solid $cMainLine;
 }
+.CDB-NavMenu-Inner--no-margin {
+  margin-bottom: 0;
+}
+.CDB-NavMenu-Inner--is-dropdown {
+  padding: $baseSize 0 0 $baseSize * 2;
+}
 
 .CDB-NavMenu-Link {
   display: block;

From a7b2fbc6375b994886da704d44b2b8f6529bb31c Mon Sep 17 00:00:00 2001
From: piensaenpixel <piensaenpixel@gmail.com>
Date: Tue, 26 Apr 2016 10:34:21 +0200
Subject: [PATCH 2/2] fix pr

---
 src/scss/cdb-components/boxes.scss           | 4 ++--
 src/scss/cdb-components/forms/dropdowns.scss | 6 +++---
 src/scss/cdb-components/menu.scss            | 4 ++--
 3 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/scss/cdb-components/boxes.scss b/src/scss/cdb-components/boxes.scss
index d7211ae..5f4e5e2 100644
--- a/src/scss/cdb-components/boxes.scss
+++ b/src/scss/cdb-components/boxes.scss
@@ -21,10 +21,10 @@
   box-shadow: 0  $baseSize  $baseSize * 2 0 rgba(0, 0, 0, 0.16);
 }
 
-.CDB-Box-ModalHeader {
+.CDB-Box-modalHeader {
   background: $cSecondaryBackground;
 }
-.CDB-Box-ModalHeaderItem {
+.CDB-Box-modalHeaderItem {
   @include display-flex();
   @include align-items(center);
   padding: $baseSize + 4 $baseSize * 2;
diff --git a/src/scss/cdb-components/forms/dropdowns.scss b/src/scss/cdb-components/forms/dropdowns.scss
index f78bd63..5258392 100644
--- a/src/scss/cdb-components/forms/dropdowns.scss
+++ b/src/scss/cdb-components/forms/dropdowns.scss
@@ -79,9 +79,9 @@
   <br/>
 
   <div class="CDB-Box-Modal">
-    <div class="CDB-Box-ModalHeader">
+    <div class="CDB-Box-modalHeader">
       <nav class="CDB-NavMenu">
-        <ul class="CDB-NavMenu-Inner CDB-NavMenu-Inner--no-margin CDB-NavMenu-Inner--is-dropdown CDB-Text is-semibold CDB-Size-medium">
+        <ul class="CDB-NavMenu-Inner CDB-NavMenu-inner--no-margin CDB-NavMenu-inner--is-dropdown CDB-Text is-semibold CDB-Size-medium">
           <li class="CDB-NavMenu-Item">
             <button class="CDB-NavMenu-Link">SOLID</button>
           </li>
@@ -90,7 +90,7 @@
           </li>
         </ul>
       </nav>
-      <div class="CDB-Box-ModalHeaderItem">
+      <div class="CDB-Box-modalHeaderItem">
         <input type="text" name="text" placeholder="DejaVu Sans" class="CDB-InputTextPlain CDB-Text">
         <button class="u-lSpace--xl">
           <div class="CDB-Shape">
diff --git a/src/scss/cdb-components/menu.scss b/src/scss/cdb-components/menu.scss
index 9e260cb..75ea375 100644
--- a/src/scss/cdb-components/menu.scss
+++ b/src/scss/cdb-components/menu.scss
@@ -107,10 +107,10 @@
   margin-bottom: 18px;
   border-bottom: 1px solid $cMainLine;
 }
-.CDB-NavMenu-Inner--no-margin {
+.CDB-NavMenu-inner--no-margin {
   margin-bottom: 0;
 }
-.CDB-NavMenu-Inner--is-dropdown {
+.CDB-NavMenu-inner--is-dropdown {
   padding: $baseSize 0 0 $baseSize * 2;
 }