diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index a1cf9dbc..50504034 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -9,6 +9,7 @@ *= require osem-rating *= require osem-schedule *= require osem-schedule-print + *= require osem-dashboard *= require font-awesome *= require bootstrap-markdown.min */ diff --git a/app/assets/stylesheets/breakpoints.css.scss b/app/assets/stylesheets/breakpoints.css.scss new file mode 100644 index 00000000..46986e2e --- /dev/null +++ b/app/assets/stylesheets/breakpoints.css.scss @@ -0,0 +1,21 @@ +@mixin breakpoint($class) { + @if $class == xs { + @media (max-width: 767px) { @content; } + } + + @else if $class == sm { + @media (min-width: 750px) { @content; } + } + + @else if $class == md { + @media (min-width: 970px) { @content; } + } + + @else if $class == lg { + @media (min-width: 1170px) { @content; } + } + + @else { + @warn "Breakpoint mixin supports: xs, sm, md, lg"; + } +} \ No newline at end of file diff --git a/app/assets/stylesheets/osem-dashboard.css.scss b/app/assets/stylesheets/osem-dashboard.css.scss new file mode 100644 index 00000000..a9eca071 --- /dev/null +++ b/app/assets/stylesheets/osem-dashboard.css.scss @@ -0,0 +1,14 @@ +@import "breakpoints.css.scss"; + +.dashbox span.fa { + line-height: 1.1em; + @include breakpoint(sm) { + font-size: 3em; + } + @include breakpoint(md) { + font-size: 4em; + } + @include breakpoint(lg) { + font-size: 5em; + } +} \ No newline at end of file diff --git a/app/views/admin/conference/index.html.haml b/app/views/admin/conference/index.html.haml index a8d44eae..11958df7 100644 --- a/app/views/admin/conference/index.html.haml +++ b/app/views/admin/conference/index.html.haml @@ -1,25 +1,41 @@ .row - .col-sm-4 + .col-sm-4.col-xs-4 .dashbox.text-center - .icon - %i.glyphicon.glyphicon-user - .text - %label.text-muted total user: #{@total_user} - %label.text-muted new user: #{@new_user} - .col-sm-4 + %span.fa.fa-user.fa-lg + %span.fa.fa-lg + = @total_user + %p + %small + #{'User'.pluralize(@total_user)} + - if @new_user + %span.label.label-success{title: "+ #{@new_user} since you last logged in!"} + + + = @new_user + .col-sm-4.col-xs-4 .dashbox.text-center - .icon - %i.glyphicon.glyphicon-star - .text - %label.text-muted total registrations: #{@total_reg} - %label.text-muted new registrations: #{@new_reg} - .col-sm-4 + %span.fa.fa-check-square.fa-lg + %span.fa.fa-lg + = @total_reg + %p + %small + #{'Registration'.pluralize(@total_reg)} + - if @new_reg + %span.label.label-success{title: "+#{@new_reg} since you last logged in!"} + + + = @new_reg + .col-sm-4.col-xs-4 .dashbox.text-center - .icon - %i.glyphicon.glyphicon-comment - .text - %label.text-muted total submissions: #{@total_submissions} - %label.text-muted new submissions: #{@new_submissions} + %span.fa.fa-file-text.fa-lg + %span.fa.fa-lg + = @total_submissions + %p + %small + #{'Submission'.pluralize(@total_submissions)} + - if @new_submissions + %span.label.label-success{title: "+#{@new_submissions} since you last logged in!"} + + + = @new_submissions + .row#registrations .col-md-8 = render partial: 'line_chart', locals: { title: 'Registrations over time',