From 3c50cd039d036d394bb7b65158062632831dea4c Mon Sep 17 00:00:00 2001
From: Tony Air <tony@thewebdevelopmentagency.com>
Date: Wed, 27 May 2020 09:15:52 +0700
Subject: [PATCH] Minor improvements

---
 app/client/src/scss/_elements.scss     |  1 +
 app/client/src/scss/_variables.scss    | 11 +++++++++++
 app/client/src/scss/app.scss           | 17 +++++++++--------
 app/src/Pages/Page.php                 | 16 ++++++++++++++++
 app/templates/Includes/NavItem.ss      |  5 +----
 app/templates/Includes/NavItem_link.ss | 10 ++++++++++
 6 files changed, 48 insertions(+), 12 deletions(-)
 create mode 100644 app/client/src/scss/_elements.scss
 create mode 100644 app/templates/Includes/NavItem_link.ss

diff --git a/app/client/src/scss/_elements.scss b/app/client/src/scss/_elements.scss
new file mode 100644
index 0000000..4aefc04
--- /dev/null
+++ b/app/client/src/scss/_elements.scss
@@ -0,0 +1 @@
+/* style elements here */
diff --git a/app/client/src/scss/_variables.scss b/app/client/src/scss/_variables.scss
index 8511473..bfd0149 100644
--- a/app/client/src/scss/_variables.scss
+++ b/app/client/src/scss/_variables.scss
@@ -36,6 +36,17 @@ $grid-gutter-width: 2rem;
 $grid-gutter-height: 2rem;
 $grid-gutter-element-height: $grid-gutter-height;
 
+$border-radius: 0.25rem;
+$border-radius-lg: 0.3rem;
+$border-radius-sm: 0.2rem;
+
+$font-size-base: 1rem;
+$h1-font-size: $font-size-base * 2.25;
+$h3-font-size: $font-size-base * 1.75;
+$h4-font-size: $font-size-base * 1.5;
+$h5-font-size: $font-size-base * 1.25;
+$h6-font-size: $font-size-base;
+
 @import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_variables';
 
 // Add your site-wide + content editor typography styling
diff --git a/app/client/src/scss/app.scss b/app/client/src/scss/app.scss
index bca26dc..bf8813d 100644
--- a/app/client/src/scss/app.scss
+++ b/app/client/src/scss/app.scss
@@ -4,27 +4,28 @@
 //@import "~bootstrap-timepicker/css/bootstrap-timepicker.css";
 
 // Your custom variables
-@import "_variables";
+@import '_variables';
 
 //@import "~bootstrap-select/dist/css/bootstrap-select.css";
 // conflicts to bootstrap-select
 //@import "~select2/dist/css/select2.css";
 
-@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.bootstrap";
+@import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.bootstrap';
 
 // By default we prefer font awesome CDN
 //@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/js/_components/_ui.fontawesome";
-@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.lightbox";
+@import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.lightbox';
 
 // Flyout UI
 //@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.flyout";
 
-@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.main";
-@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.form.basics";
-@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.elemental";
+@import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.main';
+@import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.form.basics';
+@import '~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.elemental';
 
 //@import "~@a2nt/ss-bootstrap-ui-webpack-boilerplate/src/scss/_components/_ui.form.stepped";
 
 // Your custom styling
-@import "_typography";
-@import "_layout";
+@import '_typography';
+@import '_layout';
+@import '_elements';
diff --git a/app/src/Pages/Page.php b/app/src/Pages/Page.php
index 79adb6f..26a8c36 100644
--- a/app/src/Pages/Page.php
+++ b/app/src/Pages/Page.php
@@ -4,19 +4,35 @@
 // extends global Page class
 //namespace Site\Pages;
 
+use Sheadawson\Linkable\Forms\LinkField;
 use SilverStripe\CMS\Model\SiteTree;
 use DNADesign\Elemental\Models\ElementContent;
+use SilverStripe\FontAwesome\FontAwesomeField;
 
 class Page extends SiteTree
 {
     private static $default_container_class = 'container';
     protected $_cached = [];
+    private static $db = [
+        'BlockIcon' => 'Varchar(255)',
+    ];
 
     public static function DefaultContainer()
     {
         return self::config()->get('default_container_class');
     }
 
+    public function getSettingsFields()
+    {
+        $fields = parent::getSettingsFields();
+
+        $fields->addFieldsToTab('Root.Icon', [
+            FontAwesomeField::create('BlockIcon', 'Page link Icon'),
+        ]);
+
+        return $fields;
+    }
+
     /*
      * Shows custom summary of the post, otherwise
      * Displays summary of the first content element
diff --git a/app/templates/Includes/NavItem.ss b/app/templates/Includes/NavItem.ss
index fdfce37..6b1c772 100644
--- a/app/templates/Includes/NavItem.ss
+++ b/app/templates/Includes/NavItem.ss
@@ -23,9 +23,6 @@
     </li>
 <% else %>
     <li class="nav-item {$CSSClass} $ExtraClass <% if $isCurrent || $isSection %> active<% end_if %>">
-        <a class="nav-link" href="{$Link}" title="$Title.XML">
-            $MenuTitle.XML
-            <% if $isCurrent || $isSection %><i class="sr-only">(current)</i><% end_if %>
-        </a>
+        <% include NavItem_link %>
     </li>
 <% end_if %>
diff --git a/app/templates/Includes/NavItem_link.ss b/app/templates/Includes/NavItem_link.ss
new file mode 100644
index 0000000..deef3e9
--- /dev/null
+++ b/app/templates/Includes/NavItem_link.ss
@@ -0,0 +1,10 @@
+<a
+    class="nav-item-link <% if $LinkClass %>{$LinkClass}<% else %>nav-link<% end_if %>" href="{$Link}"
+    <% if $ExternalURL || $OpenInNewWindow %> target="_blank"<% end_if %>
+>
+	<% if $BlockIcon %>
+	    <i class="fa-icon $BlockIcon"></i>
+	<% end_if %>
+    $MenuTitle.XML
+    <% if $isCurrent || $isSection %><i class="sr-only">(current)</i><% end_if %>
+</a>