CSS is better

Upgraded to Rails 7.1.3.3

Gemfile

@@ -4,7 +4,7 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 ruby "3.3.1"
 
 # Bundle edge Rails instead: gem "rails", github: "rails/rails", branch: "main"
-gem "rails", "7.1.3.2"
+gem "rails", "7.1.3.3"
 
 gem 'devise'
 

Gemfile.lock

@@ -1,35 +1,35 @@
 GEM
   remote: https://rubygems.org/
   specs:
-    actioncable (7.1.3.2)
+    actioncable (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       nio4r (~> 2.0)
       websocket-driver (>= 0.6.1)
       zeitwerk (~> 2.6)
-    actionmailbox (7.1.3.2)
+    actionmailbox (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      activejob (= 7.1.3.2)
+      activejob (= 7.1.3.3)
-      activerecord (= 7.1.3.2)
+      activerecord (= 7.1.3.3)
-      activestorage (= 7.1.3.2)
+      activestorage (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       mail (>= 2.7.1)
       net-imap
       net-pop
       net-smtp
-    actionmailer (7.1.3.2)
+    actionmailer (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      actionview (= 7.1.3.2)
+      actionview (= 7.1.3.3)
-      activejob (= 7.1.3.2)
+      activejob (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       mail (~> 2.5, >= 2.5.4)
       net-imap
       net-pop
       net-smtp
       rails-dom-testing (~> 2.2)
-    actionpack (7.1.3.2)
+    actionpack (7.1.3.3)
-      actionview (= 7.1.3.2)
+      actionview (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       nokogiri (>= 1.8.5)
       racc
       rack (>= 2.2.4)
@@ -37,35 +37,35 @@ GEM
       rack-test (>= 0.6.3)
       rails-dom-testing (~> 2.2)
       rails-html-sanitizer (~> 1.6)
-    actiontext (7.1.3.2)
+    actiontext (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      activerecord (= 7.1.3.2)
+      activerecord (= 7.1.3.3)
-      activestorage (= 7.1.3.2)
+      activestorage (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       globalid (>= 0.6.0)
       nokogiri (>= 1.8.5)
-    actionview (7.1.3.2)
+    actionview (7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       builder (~> 3.1)
       erubi (~> 1.11)
       rails-dom-testing (~> 2.2)
       rails-html-sanitizer (~> 1.6)
-    activejob (7.1.3.2)
+    activejob (7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       globalid (>= 0.3.6)
-    activemodel (7.1.3.2)
+    activemodel (7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
-    activerecord (7.1.3.2)
+    activerecord (7.1.3.3)
-      activemodel (= 7.1.3.2)
+      activemodel (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       timeout (>= 0.4.0)
-    activestorage (7.1.3.2)
+    activestorage (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      activejob (= 7.1.3.2)
+      activejob (= 7.1.3.3)
-      activerecord (= 7.1.3.2)
+      activerecord (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       marcel (~> 1.0)
-    activesupport (7.1.3.2)
+    activesupport (7.1.3.3)
       base64
       bigdecimal
       concurrent-ruby (~> 1.0, >= 1.0.2)
@@ -167,20 +167,20 @@ GEM
     rackup (2.1.0)
       rack (>= 3)
       webrick (~> 1.8)
-    rails (7.1.3.2)
+    rails (7.1.3.3)
-      actioncable (= 7.1.3.2)
+      actioncable (= 7.1.3.3)
-      actionmailbox (= 7.1.3.2)
+      actionmailbox (= 7.1.3.3)
-      actionmailer (= 7.1.3.2)
+      actionmailer (= 7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      actiontext (= 7.1.3.2)
+      actiontext (= 7.1.3.3)
-      actionview (= 7.1.3.2)
+      actionview (= 7.1.3.3)
-      activejob (= 7.1.3.2)
+      activejob (= 7.1.3.3)
-      activemodel (= 7.1.3.2)
+      activemodel (= 7.1.3.3)
-      activerecord (= 7.1.3.2)
+      activerecord (= 7.1.3.3)
-      activestorage (= 7.1.3.2)
+      activestorage (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       bundler (>= 1.15.0)
-      railties (= 7.1.3.2)
+      railties (= 7.1.3.3)
     rails-dom-testing (2.2.0)
       activesupport (>= 5.0.0)
       minitest
@@ -188,9 +188,9 @@ GEM
     rails-html-sanitizer (1.6.0)
       loofah (~> 2.21)
       nokogiri (~> 1.14)
-    railties (7.1.3.2)
+    railties (7.1.3.3)
-      actionpack (= 7.1.3.2)
+      actionpack (= 7.1.3.3)
-      activesupport (= 7.1.3.2)
+      activesupport (= 7.1.3.3)
       irb
       rackup (>= 1.0.0)
       rake (>= 12.2)
@@ -262,7 +262,7 @@ DEPENDENCIES
   jbuilder
   mysql2 (~> 0.5)
   puma (~> 6.0)
-  rails (= 7.1.3.2)
+  rails (= 7.1.3.3)
   selenium-webdriver
   sprockets-rails
   stimulus-rails

app/assets/stylesheets/application.css

@@ -14,11 +14,68 @@
  *= require_self
  */
 
-body, nav, main, footer {
+/*
-  padding: 1rem;
+ * https://github.com/Lazzzer00/Best-CSS-Reset-2024
-  margin: 1rem;
+ */
+*, *::before, *::after{
+    box-sizing: border-box;
 }
 
+*{
+    margin: 0;
+    padding: 0;
+}
+
+ul[role='list'], ol[role='list']{
+    list-style: none;
+}
+
+html:focus-within{
+    scroll-behavior: smooth;
+}
+
+a:not([class]){
+    text-decoration-skip-ink: auto;
+}
+
+img, picture, svg, video, canvas{
+    max-width: 100%;
+    height: auto;
+    vertical-align: middle;
+    font-style: italic;
+    background-repeat: no-repeat;
+    background-size: cover;
+}
+
+input, button, textarea, select{
+    font: inherit;
+}
+
+@media (prefers-reduced-motion: reduce){
+    html:focus-within {
+        scroll-behavior: auto;
+    }
+    *, *::before, *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+        scroll-behavior: auto !important;
+        transition: none;
+    }
+}
+
+
+
+body, html{
+    height: 100%;
+    scroll-behavior: smooth;
+    padding:1rem;
+}
+
+/*
+ * Other CSS
+ */
+
 menu {
   display: flex;
   list-style: none;
@@ -32,6 +89,17 @@ menu > li {
   flex-grow: 1;
 }
 
+.domain {
+  background-color: #efefef;
+  border-radius:1rem;
+  padding:1rem;
+}
+.domain-header {
+    background-color: #fefefe;
+    border-radius:1rem;
+    padding:1rem 1rem;
+}
+
 .domain-header h2 {
   display: flex;
 }
@@ -42,7 +110,14 @@ menu > li {
 
 .domain-header button {
   margin:0 0 0 10px;
+}
 
+.email-list {
+  border-radius:1rem;
+  border:1rem black;
+  background-color:#e7eae7;
+  padding:2rem;
+  margin:1rem 0;
 }
 
 .email-list li {
@@ -54,14 +129,13 @@ menu > li {
   padding:0 10px;
 }
 
-main, body {
-    padding:1rem;
-    margin:1rem;
-}
-
 footer {
+  margin-top:1rem;
   background-color:#efefef;
-  margin:0 1rem;
   padding:1rem;
   border-radius:1rem;
 }
+
+footer ul, footer h3 , footer li {
+  margin:10px;
+}

app/views/domains/show.html.erb

@@ -1,21 +1,21 @@
-<div>
+<div class="domain">
   <div class="domain-header">
     <h2><%= @domain.domain %> <%#= link_to "Edit", edit_domain_path(@domain) %> <%= button_to "Delete", @domain, method: :delete %></h2>
   </div>
   <div class="email-list">
-    <h3>Credentials (<%= @domain.credentials.count %>) <%= link_to "Add #{@domain.domain} email address", new_domain_credential_path(@domain) %></h2>
+    <h3>Credentials (<%= @domain.credentials.count %>) <%= link_to "Add #{@domain.domain} email address", new_domain_credential_path(@domain) %></h3>
       <ul>
         <% @domain.credentials.each do |credential| %>
         <li><%= credential.email %> <%= link_to "Edit", edit_domain_credential_path(@domain,credential) %> <%= button_to "Delete this email address", [@domain, credential], method: :delete %></li>
         <% end %>
       </ul>
-
+  </div>
   <hr/>
-
+  <div class="email-list">
-    <h3>Virtuals (<%= @domain.virtuals.count %>) <%= link_to "Add #{@domain.domain} virtual email", new_domain_virtual_path(@domain) %></h2>
+    <h3>Virtuals (<%= @domain.virtuals.count %>) <%= link_to "Add #{@domain.domain} virtual email", new_domain_virtual_path(@domain) %></h3>
     <ul>
       <% @domain.virtuals.each do |virtual| %>
-      <li><%= virtual.email%> >> <%= virtual.destination%> <%= link_to "Edit", edit_domain_virtual_path(@domain,virtual)%> <%= button_to "Delete", [@domain, virtual], method: :delete, style: "display:inline" %></li>
+      <li><%= virtual.email%> >> <%= virtual.destination%> <%= link_to "Edit", edit_domain_virtual_path(@domain,virtual)%> <%= button_to "Delete", [@domain, virtual], method: :delete, data: { confirm: "Are you sure?" } %></li>
       <% end %>
     </ul>
 

app/views/layouts/application.html.erb

@@ -22,8 +22,8 @@
 
 
   <main>
-    <% if notice %><div class="bg-green-lightest green-darkest px-5 py-3 br-3 border-l bw-6 bc-green"><%= notice %></div><% end %>
+    <% if notice %><div class=""><%= notice %></div><% end %>
-    <% if alert %><div class="bg-red-lightest red-darkest px-5 py-3 br-3 border-l bw-6 bc-red"><%= alert %></div><% end %>
+    <% if alert %><div class=""><%= alert %></div><% end %>
     <%= yield %>
   </main>
   <footer>
@@ -32,7 +32,7 @@
     <hr/>
     <h3>To-Do (In order of importance):</h3>
     <ul>
-      <li>Tests for controllers and integration</li>
+      <li>Edit - plus tests</li>
       <li>2FA</li>
     </ul>
   </footer>