Make flash messages fixed and sticked to bottom

GitLab
1 parent 0e387919
Showing 2 changed files with 5 additions and 1 deletions Show diff stats
app/assets/javascripts/main.js.coffee
app/assets/stylesheets/common.scss
@@ -89,7 +89,7 @@ $ -&gt;
   if (flash = $(".flash-container")).length > 0
     flash.click -> $(@).fadeOut()
     flash.show()
-    setTimeout (-> flash.fadeOut()), 9000
+    setTimeout (-> flash.fadeOut()), 3000
  
   # Disable form buttons while a form is submitting
   $('body').on 'ajax:complete, ajax:beforeSend, submit', 'form', (e) ->
@@ -51,6 +51,10 @@ table a code {
   text-align: center;
   color: #fff;
   font-size: 14px;
+  position: fixed;
+  bottom: 0;
+  width: 100%;
+  opacity: 0.8;
  
   .flash-notice {
     background: #49C;
...	...	@@ -89,7 +89,7 @@ $ ->
89	89	if (flash = $(".flash-container")).length > 0
90	90	flash.click -> $(@).fadeOut()
91	91	flash.show()
92		- setTimeout (-> flash.fadeOut()), 9000
	92	+ setTimeout (-> flash.fadeOut()), 3000
93	93
94	94	# Disable form buttons while a form is submitting
95	95	$('body').on 'ajax:complete, ajax:beforeSend, submit', 'form', (e) ->
...	...
...	...	@@ -51,6 +51,10 @@ table a code {
51	51	text-align: center;
52	52	color: #fff;
53	53	font-size: 14px;
	54	+ position: fixed;
	55	+ bottom: 0;
	56	+ width: 100%;
	57	+ opacity: 0.8;
54	58
55	59	.flash-notice {
56	60	background: #49C;
...	...