From 96132da81b57572ca270027d4ba90ef741d0e489 Mon Sep 17 00:00:00 2001
From: Steve Sutton <steve@gaslightmedia.com>
Date: Wed, 17 Jul 2019 16:56:40 -0400
Subject: [PATCH] New UI elements

Adding form and grid start and end.
---
 views/ui/f6/checkbox.html   |  2 +-
 views/ui/f6/form-end.html   |  2 ++
 views/ui/f6/form-start.html | 16 +++++++++
 views/ui/f6/grid-end.html   |  5 +++
 views/ui/f6/grid-start.html | 70 +++++++++++++++++++++++++++++++++++++
 5 files changed, 94 insertions(+), 1 deletion(-)
 create mode 100644 views/ui/f6/form-end.html
 create mode 100644 views/ui/f6/form-start.html
 create mode 100644 views/ui/f6/grid-end.html
 create mode 100644 views/ui/f6/grid-start.html

diff --git a/views/ui/f6/checkbox.html b/views/ui/f6/checkbox.html
index a5b535ad..91e01f99 100644
--- a/views/ui/f6/checkbox.html
+++ b/views/ui/f6/checkbox.html
@@ -19,7 +19,7 @@
 <div class="cell small-12 glm-f6-ui-field">
     <div class="grid-x grid-margin-x">
         <div class="cell shrink glm-f6-ui-field-input">
-            <div class="switch">
+            <div class="switch small glm-f6-ui-field-input-switch">
                 <input class="switch-input" id="{$ui.field}" type="checkbox" name="{$ui.field}"{if $ui.value} checked{/if}{if $ui.required} required{/if}>
                 <label for="{$ui.field}" class="switch-paddle">
                     <span class="show-for-sr">{$ui.label}</span>
diff --git a/views/ui/f6/form-end.html b/views/ui/f6/form-end.html
new file mode 100644
index 00000000..323f6ebb
--- /dev/null
+++ b/views/ui/f6/form-end.html
@@ -0,0 +1,2 @@
+{* Form End *}
+</form>
diff --git a/views/ui/f6/form-start.html b/views/ui/f6/form-start.html
new file mode 100644
index 00000000..669693d9
--- /dev/null
+++ b/views/ui/f6/form-start.html
@@ -0,0 +1,16 @@
+{*
+    Foundation 6 Form Start
+    {$ui = [
+        'id'     => string Form id
+        'action' => string URL
+        'method' => string Method POST or GET
+        'File'   => Bool   0 or 1
+    ]}
+*}
+<form
+    id="{$ui.id}"
+    action="{$ui.action}"
+    method="{$ui.method}"
+    {if $ui.file}enctype="multipart/form-data"{/if}
+    data-abide novalidate data-validate-on-blur="true">
+
diff --git a/views/ui/f6/grid-end.html b/views/ui/f6/grid-end.html
new file mode 100644
index 00000000..7b1f70f6
--- /dev/null
+++ b/views/ui/f6/grid-end.html
@@ -0,0 +1,5 @@
+{*
+    Foundation 6 - Grid End
+    </div>
+*}
+</div>
diff --git a/views/ui/f6/grid-start.html b/views/ui/f6/grid-start.html
new file mode 100644
index 00000000..266c5bd2
--- /dev/null
+++ b/views/ui/f6/grid-start.html
@@ -0,0 +1,70 @@
+{*
+    Foundation 6 - Grid Start
+
+    {$ui = [
+        'nowrap'            => string   True if no sections should wrap to the right,
+        'backgroundColor'   => string   Background color of overall grid area,
+        'sectionColor'      => string   background color of sections
+    ]}
+
+*}
+{$glm_f6_ui_wrapsize = 6 scope="global"}
+{if isset($ui.nowrap) && $ui.nowrap}
+    {$glm_f6_ui_wrapsize = 12 scope="global"}
+{/if}
+{$glm_f6_ui_background_color = 'white' scope="global"}
+{if isset($ui.backgroundColor)}
+    {$glm_f6_ui_background_color = $ui.backgroundColor scope="global"}
+{/if}
+{$glm_f6_ui_section_color = 'white' scope="global"}
+{if isset($ui.sectionColor)}
+    {$glm_f6_ui_section_color = $ui.sectionColor scope="global"}
+{/if}
+
+<style>
+    .glm-foundation-6-ui {
+        background-color: {$glm_f6_ui_background_color} !important;
+    }
+    .glm-f6-ui-section {
+    }
+    .glm-f6-ui-section-title {
+        margin-top: 1rem;
+    }
+    .glm-f6-ui-section-start {
+        background-color: {$glm_f6_ui_section_color} !important;
+    }
+    .glm-f6-ui-field {
+        margin-bottom: 1rem !important;
+    }
+    .glm-f6-ui-label-container {
+    }
+    .glm-f6-ui-label-container-right {
+        margin-left: 0 !important;
+    }
+    .glm-f6-ui-field-label {
+    }
+    .glm-f6-ui-field-input {
+        margin-bottom: 0 !important;
+    }
+    .glm-f6-ui-field-input-switch {
+        margin-bottom: 0 !important;
+    }
+    .glm-f6-ui-field-input-number {
+        margin-bottom: 0 !important;
+    }
+    .glm-f6-ui-field-data-error {
+    }
+    .glm-f6-ui-field-help-text {
+        margin-bottom: 0 !important;
+    }
+    .glm-f6-ui-field-error-text {
+        margin-top: 0 !important;
+    }
+    .glm-f6-ui-text-line {
+        margin-bottom: 1rem !important;
+    }
+</style>
+<div class="callout grid-container glm-foundation-6-ui">
+    {* <div class="grid-x grid-margin-x"> *}
+
+
-- 
2.17.1