More cleanup of the event form: fixing admins

 * Can now remove and add event admins
 * Cleaning up styles
 * Changing rubocop hash alignment to align goddamit
 * Adding Hashie ruby gem
 * Moving Puma concurrency config into config/puma.yml
 * Fixing Bootstrap icons

.rubocop.yml

@@ -1,16 +1,24 @@
 inherit_from: .rubocop_todo.yml
+
 AllCops:
-    NewCops: enable
+  NewCops: enable
 
 require:
- - rubocop-factory_bot
- - rubocop-rails
- - rubocop-rake
- - rubocop-rspec
- - rubocop-rspec_rails
+  - rubocop-factory_bot
+  - rubocop-rails
+  - rubocop-rake
+  - rubocop-rspec
+  - rubocop-rspec_rails
 
 Style/IfUnlessModifier:
   Enabled: false
 
 RSpecRails/InferredSpecType:
   Enabled: false
+
+Layout/HashAlignment:
+  Enabled: true
+  EnforcedColonStyle: table
+  EnforcedLastArgumentHashStyle: ignore_implicit
+  EnforcedHashRocketStyle: table
+

Gemfile

@@ -64,6 +64,7 @@ gem 'country_select'
 gem 'flatpickr'
 
 gem 'colorize'
+gem 'hashie'
 
 gem 'haml'
 gem 'haml-rails'

Gemfile.lock

@@ -165,6 +165,7 @@ GEM
       activesupport (>= 5.1)
       haml (>= 4.0.6)
       railties (>= 5.1)
+    hashie (5.0.0)
     i18n (1.14.4)
       concurrent-ruby (~> 1.0)
     image_processing (1.12.2)
@@ -471,6 +472,7 @@ DEPENDENCIES
   foreman
   haml
   haml-rails
+  hashie
   jbuilder
   jsbundling-rails
   lograge

app/assets/stylesheets/application.scss

@@ -13,19 +13,37 @@
  */
 
 @import 'bootstrap/scss/bootstrap';
-@import 'bootstrap-icons/font/bootstrap-icons';
+@import url("https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css");
+
+// Required
+@import "bootstrap/scss/functions";
+@import "bootstrap/scss/variables";
+@import "bootstrap/scss/mixins";
+
+$theme-colors: map-remove($theme-colors, "info", "light", "dark");
+
+// Optional
+@import "bootstrap/scss/root";
+@import "bootstrap/scss/reboot";
+@import "bootstrap/scss/type";
+
+// Icons
 
 @import 'flatpickr/dist/flatpickr';
 @import 'flatpickr/dist/themes/material_orange';
 
 //@import '../../../node_modules/flatpickr/dist/flatpickr.min';
 //@import '../../../node_modules/flatpickr/dist/themes/material_orange';
 
-@import './events.css.scss';
+@import './fonts.css.scss';
 @import './home.css.scss';
 @import './jobs.css.scss';
 @import './payments.css.scss';
 @import './shifts.css.scss';
 @import './time_slots.css.scss';
 @import './links.css.scss';
 @import './global.css.scss';
+@import './forms.css.scss';
+@import './events.css.scss';
+@import './nav.css.scss';
+

app/assets/stylesheets/events.css.scss

@@ -1,6 +1,5 @@
 .event-admins {
   margin-left: 0;
-  max-width: 400px;
 
   li {
     clear: right;
@@ -13,13 +12,26 @@
   margin-bottom: 10px;
 }
 
-.remove-admin {
-  float: right;
-}
-
 img.event-preview {
   max-width: 200px;
   max-height: 200px;
-  margin: 0 30px;
-  float: right !important;
+  margin-left: 20px;
+}
+
+.card.event-nav {
+  .card-body {
+    .btn-group {
+      .btn {
+        font-size: 12pt !important;
+      }
+    }
+  }
+}
+
+// Hide navbar text for small screens
+@media (max-width: 600px) {
+  img.event-preview {
+    max-width: 80px;
+    max-height: 80px;
+  }
 }

app/assets/stylesheets/fonts.css.scss

@@ -0,0 +1,71 @@
+@mixin bebas-neue-regular {
+  font-family: "Bebas Neue", sans-serif;
+  font-weight: 400;
+  font-style: normal;
+}
+
+@mixin titillium-web-extralight {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 200;
+  font-style: normal;
+}
+
+@mixin titillium-web-light {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 300;
+  font-style: normal;
+}
+
+@mixin titillium-web-regular {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 400;
+  font-style: normal;
+}
+
+@mixin titillium-web-semibold {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 600;
+  font-style: normal;
+}
+
+@mixin titillium-web-bold {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 700;
+  font-style: normal;
+}
+
+@mixin titillium-web-black {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 900;
+  font-style: normal;
+}
+
+@mixin titillium-web-extralight-italic {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 200;
+  font-style: italic;
+}
+
+@mixin titillium-web-light-italic {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 300;
+  font-style: italic;
+}
+
+@mixin titillium-web-regular-italic {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 400;
+  font-style: italic;
+}
+
+@mixin titillium-web-semibold-italic {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 600;
+  font-style: italic;
+}
+
+@mixin titillium-web-bold-italic {
+  font-family: "Titillium Web", sans-serif;
+  font-weight: 700;
+  font-style: italic;
+}

app/assets/stylesheets/forms.css.scss

@@ -0,0 +1,62 @@
+@import "fonts.css.scss";
+@import "bootstrap/scss/functions";
+
+form {
+  label {
+    margin-top: 25px;
+    margin-bottom: 2px;
+    display: block;
+    min-width: auto;
+    font-size: 12pt;
+    vertical-align: top;
+  }
+
+  input {
+    background-color: #efe;
+    color: #000;
+    border: 0.5px solid #777;
+    border-radius: 5px;
+    padding: 5px 0;
+    margin-top: 0;
+    margin-right: 5px;
+    margin-bottom: 0;
+    display: inline-block !important;
+    max-width: 80%;
+  }
+
+  input[type=text]#event_name {
+    width: 400px !important;
+    min-width: 400px !important;
+    font-size: 14pt;
+    background-color: $primary-bg-subtle !important;
+  }
+
+  input[type=text] {
+    min-width: 100px;
+    width: 300px;
+    text-align: left;
+    padding-left: 10px;
+  }
+
+  input[name="event[name]"] {
+    width: 500px !important;
+  }
+
+  input[type=submit] {
+    margin-top: 20px;
+    margin-bottom: 20px;
+  }
+
+  input[type=number] {
+    text-align: right;
+    width: 80px;
+    min-width: 30px;
+  }
+
+  input[type=email], input[type=password] {
+    padding: 9px !important;
+    width: 300px;
+    min-width: 100px;
+  }
+}
+