From e8b003fde4d44dfecd2620b188b28e55d479a450 Mon Sep 17 00:00:00 2001 From: Andreas Nedbal Date: Fri, 1 May 2020 19:29:05 +0200 Subject: [PATCH] Refactor entry styling and adjust layouts where used --- app/assets/stylesheets/application.css.scss | 1 + app/assets/stylesheets/base.css.scss | 1 - app/assets/stylesheets/components/_entry.scss | 48 +++++++++++++++++++ app/assets/stylesheets/scss/entry.scss | 45 ----------------- app/views/shared/_sidebar.haml | 11 +---- .../static/{about.html.haml => about.haml} | 31 +++++++----- 6 files changed, 68 insertions(+), 69 deletions(-) create mode 100644 app/assets/stylesheets/components/_entry.scss delete mode 100644 app/assets/stylesheets/scss/entry.scss rename app/views/static/{about.html.haml => about.haml} (63%) diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index fb746561..b8f75233 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -103,6 +103,7 @@ $navbar-inverse-toggle-border-color: #512da8; @import "components/avatars", "components/buttons", +"components/entry", "components/jumbotron", "components/profile", "components/question", diff --git a/app/assets/stylesheets/base.css.scss b/app/assets/stylesheets/base.css.scss index 6b4f84d4..0ae5baa6 100644 --- a/app/assets/stylesheets/base.css.scss +++ b/app/assets/stylesheets/base.css.scss @@ -12,7 +12,6 @@ body { @import "scss/generic"; @import "scss/answerbox"; @import "scss/comments"; -@import "scss/entry"; @import "scss/panel"; @import "scss/notifications"; diff --git a/app/assets/stylesheets/components/_entry.scss b/app/assets/stylesheets/components/_entry.scss new file mode 100644 index 00000000..50f36a47 --- /dev/null +++ b/app/assets/stylesheets/components/_entry.scss @@ -0,0 +1,48 @@ +.entry { + $this: &; + + &__value { + margin-bottom: 0; + } + + &__description { + color: var(--primary); + text-transform: uppercase; + font-weight: bold; + font-size: .8rem; + margin-top: 0px; + } + + &--statistics { + #{$this}__value, + #{$this}__description { + display: block; + text-align: center; + } + + #{$this}__value { + margin-top: map-get($spacers, 3); + } + + #{$this}__description { + margin-bottom: map-get($spacers, 3); + } + } + + &--users { + #{$this}__value, + #{$this}__description { + display: block; + text-align: center; + } + + #{$this}__value { + font-size: 4rem; + margin-top: map-get($spacers, 3); + } + + #{$this}__description { + margin-bottom: map-get($spacers, 3); + } + } +} \ No newline at end of file diff --git a/app/assets/stylesheets/scss/entry.scss b/app/assets/stylesheets/scss/entry.scss deleted file mode 100644 index 6dda7023..00000000 --- a/app/assets/stylesheets/scss/entry.scss +++ /dev/null @@ -1,45 +0,0 @@ -.entry-subtext { - color: $navbar-inverse-bg; - margin-top: 0px; - text-transform: uppercase; - font-weight: bold; - font-size: 80%; -} - -.entry-text { - margin-bottom: 0px; -} - -.entry-about { - margin-top: 0px; -} - -.statistics { - .entry-text { - display: block; - text-align: center; - margin-top: 5px; - } - - .entry-subtext { - text-align: center; - display: block; - margin-bottom: 5px; - } -} - -.users { - .entry-text { - display: block; - text-align: center; - margin-top: 7px; - font-size: 78px; - line-height: 1; - } - - .entry-subtext { - text-align: center; - display: block; - margin-bottom: 5px; - } -} \ No newline at end of file diff --git a/app/views/shared/_sidebar.haml b/app/views/shared/_sidebar.haml index 0bc5ef37..02d57908 100644 --- a/app/views/shared/_sidebar.haml +++ b/app/views/shared/_sidebar.haml @@ -5,18 +5,9 @@ .profile__name - unless current_user.display_name.blank? .profile__display-name - = current_user.screen_name + = current_user.display_name .profile__screen-name = current_user.screen_name - .row - .col-md-6.col-sm-6.col-xs-6 - %a{href: show_user_followers_path(current_user.screen_name)} - %h4.entry-text#follower-count= current_user.follower_count - %h6.entry-subtext= t('views.general.follower').pluralize(current_user.follower_count) - .col-md-6.col-sm-6.col-xs-6 - %a{href: show_user_friends_path(current_user.screen_name)} - %h4.entry-text#friend-count= current_user.friend_count - %h6.entry-subtext= t('views.general.following') .card .list-group = list_group_item t('views.general.timeline'), root_path diff --git a/app/views/static/about.html.haml b/app/views/static/about.haml similarity index 63% rename from app/views/static/about.html.haml rename to app/views/static/about.haml index de63f8a1..2471b269 100644 --- a/app/views/static/about.html.haml +++ b/app/views/static/about.haml @@ -43,18 +43,23 @@ .col-md-3.col-sm-12.col-xs-12 %h3= t 'views.about.statistics.title' %p= t('views.about.statistics.desc', app_title: APP_CONFIG['site_name']) - .col-md-3.col-sm-6.col-xs-6.statistics - %h2.entry-text#asked-count= Question.count - %h4.entry-subtext= t('views.general.question').pluralize(Question.count) - %h2.entry-text#answered-count= Answer.count - %h4.entry-subtext= t('views.general.answer').pluralize(Answer.count) - .col-md-3.col-sm-6.col-xs-6.statistics - %h2.entry-text#comment-count= Comment.count - %h4.entry-subtext= t('views.general.comment').pluralize(Comment.count) - %h2.entry-text#smile-count= Smile.count + CommentSmile.count - %h4.entry-subtext= t('views.general.smile').pluralize(Smile.count) - .col-md-3.col-sm-12.col-xs-12.users - .entry-text#follower-count= User.count - %h6.entry-subtext= t('views.general.user').pluralize(User.count) + .col-md-3.col-sm-6.col-xs-6 + .entry.entry--statistics + %h2.entry__value#asked-count= Question.count + %h4.entry__description= t('views.general.question').pluralize(Question.count) + .entry.entry--statistics + %h2.entry__value#answered-count= Answer.count + %h4.entry__description= t('views.general.answer').pluralize(Answer.count) + .col-md-3.col-sm-6.col-xs-6 + .entry.entry--statistics + %h2.entry__value#comment-count= Comment.count + %h4.entry__description= t('views.general.comment').pluralize(Comment.count) + .entry.entry--statistics + %h2.entry__value#smile-count= Smile.count + CommentSmile.count + %h4.entry__description= t('views.general.smile').pluralize(Smile.count) + .col-md-3.col-sm-12.col-xs-12 + .entry.entry--users + .entry__value#follower-count= User.count + %h4.entry__description= t('views.general.user').pluralize(User.count) = render "shared/links"