add style to alert

Yaronkr · Jun 16, 2022 · e95d9d1 · e95d9d1
1 parent c9ec091
commit e95d9d1
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 20 deletions.
diff --git a/app/assets/stylesheets/components/_flash_message.scss b/app/assets/stylesheets/components/_flash_message.scss
@@ -1,12 +1,21 @@
-// .notice-flash {
-//   width: auto;
-//   position: fixed;
-//   top: 100px;
-//   right: 16px;
-//   height: 50px;
-//   background-color: rgb(241, 247, 159);
-//   box-shadow: 0 10px 30px rgba(0,0,0,.1);
-//   border: 1px solid black;
-//   border-radius: 4px;
-
-// }
+.notice-flash {
+  width: auto;
+  position: fixed;
+  top: 100px;
+  right: 16px;
+  height: 50px;
+  color: #325288;
+  background-color: #F4F4F4;
+  box-shadow: 0 10px 30px rgba(0,0,0,.1);
+  border-radius: 4px;
+}
+.button-alert {
+  background-color: #d0eaf7 !important;
+  color: black;
+  font-size: 14px;
+  font-weight: 400;
+  border: none;
+  border-radius: 2em;
+  padding: 5px 12px;
+  margin: 4px 5px 0 0;
+}
diff --git a/app/controllers/applications_controller.rb b/app/controllers/applications_controller.rb
@@ -25,7 +25,7 @@ def create
       # end
     end
     ChildcareMailer.with(applications: @applications, user:current_user).new_childcare_email.deliver_now
-    redirect_to root_path, flash: {notice: "Application was submitted Successfully, check your email"}
+    redirect_to root_path, flash: {notice: "Application was submitted Successfully. Check your email for details."}
   end
 
   def destroy

diff --git a/app/views/shared/_flashes.html.erb b/app/views/shared/_flashes.html.erb
@@ -1,12 +1,12 @@
-<%# <% if notice %>
-  <%# <div class="alert alert-info alert-dismissible fade show m-1 notice-flash" role="alert">
-    <button type="button" class="button-primary" data-bs-dismiss="alert" aria-label="Close">close</button>
+<% if notice %>
+  <div class="alert alert-info alert-dismissible fade show m-1 notice-flash" role="alert">
+    <button type="button" class="button-alert" data-bs-dismiss="alert" aria-label="Close">close</button>
     <%= notice %>
-  <%# </div>
+  </div>
 <% end %>
-<%# <% if alert %>
-  <%# <div class="alert alert-warning alert-dismissible fade show m-1" role="alert">
+<% if alert %>
+  <div class="alert alert-warning alert-dismissible fade show m-1" role="alert">
     <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close">CLOSE</button>
     <%= alert %>
-  <%# </div>
+  </div>
 <% end %>