From 9cf94eec5ae98f750f9babc0c37373df87e3981c Mon Sep 17 00:00:00 2001 From: Kelly Rauchenberger Date: Sun, 2 Jul 2017 15:30:30 -0400 Subject: Styled flash and errors in admin panel --- app/assets/stylesheets/admin/layout.scss | 46 +++++++++++++++++++++++++++++++- app/views/admin/blogs/_form.html.haml | 10 ++++--- app/views/layouts/admin.html.haml | 19 ++++++------- 3 files changed, 61 insertions(+), 14 deletions(-) (limited to 'app') diff --git a/app/assets/stylesheets/admin/layout.scss b/app/assets/stylesheets/admin/layout.scss index 811c2aa..bbe5383 100644 --- a/app/assets/stylesheets/admin/layout.scss +++ b/app/assets/stylesheets/admin/layout.scss @@ -12,7 +12,7 @@ body { background-color: #7bf; a { - display: block; + display: inline-block; text-decoration: none; font-size: 2em; margin: .25em 1em; @@ -188,3 +188,47 @@ body { border: 1px solid #ddd; } } + +#errors { + padding-left: 0; + border: 2px solid red; + + h3 { + margin: 0 0 .25em 0; + text-align: center; + } + + ul { + margin: 0; + padding-left: 1em; + font-size: 0.75em; + } + + li { + display: block; + } +} + +#flash { + display: inline-block; + color: black; + background-color: white; + padding: .5em .75em; + font-size: .8em; + -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75); + -moz-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75); + box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.75); + vertical-align: text-bottom; +} + +.flash-tag { + font-weight: bold; +} + +.flash-alert { + border-left: 5px solid red; +} + +.flash-notice { + border-left: 5px solid green; +} diff --git a/app/views/admin/blogs/_form.html.haml b/app/views/admin/blogs/_form.html.haml index 55a297a..4a1c410 100644 --- a/app/views/admin/blogs/_form.html.haml +++ b/app/views/admin/blogs/_form.html.haml @@ -1,7 +1,3 @@ -- if f.object.errors.any? - %ul#errors - - f.object.errors.full_messages.each do |error| - %li= error %fieldset#content .title-field = f.label :title @@ -13,6 +9,12 @@ = f.label :body = f.cktext_area :body %fieldset#details + - if f.object.errors.any? + #errors.details-module + %h3 Error! + %ul + - f.object.errors.full_messages.each do |error| + %li= error .details-module = f.fields_for :records, Record.new do |builder| .should-create-record-field diff --git a/app/views/layouts/admin.html.haml b/app/views/layouts/admin.html.haml index a2c2d95..7f8c171 100644 --- a/app/views/layouts/admin.html.haml +++ b/app/views/layouts/admin.html.haml @@ -6,7 +6,16 @@ = stylesheet_link_tag 'admin', media: 'all', 'data-turbolinks-track': 'reload' = javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %body - #banner= link_to "Thoughts", root_url + #banner + = link_to "Thoughts", root_url + - if flash[:alert] + #flash.flash-alert + %span.flash-tag ERROR: + = flash.alert + - if flash[:notice] + #flash.flash-notice + %span.flash-tag NOTICE: + = flash.notice #container %ul#sidebar %li{major_sidebar_attrs("dashboard")} @@ -16,12 +25,4 @@ %ul.minors %li.minor= link_to "New blog", new_admin_blog_url #main - - if flash[:alert] - #flash.flash-alert - %span.flash-tag ERROR: - = flash.alert - - if flash[:notice] - #flash.flash-notice - %span.flash-tag NOTICE: - = flash.notice = yield -- cgit 1.4.1