diff --git a/app/styles/dependencies/mixins.scss b/app/styles/dependencies/mixins.scss index c7524d4d..755f4511 100644 --- a/app/styles/dependencies/mixins.scss +++ b/app/styles/dependencies/mixins.scss @@ -32,7 +32,8 @@ } @mixin popover($width, $top: '', $left: '', $bottom: '', $right: '', $arrow-width: 0, $arrow-top: '', $arrow-left: '', $arrow-bottom: '', $arrow-height: 15px) { - @extend %text; + @extend %light; + @extend %small; background: $blackish; bottom: #{$bottom}; color: $white; diff --git a/app/styles/modules/team/team-table.scss b/app/styles/modules/team/team-table.scss index 5660a6ca..e6da30bd 100644 --- a/app/styles/modules/team/team-table.scss +++ b/app/styles/modules/team/team-table.scss @@ -3,8 +3,8 @@ padding: .5rem; } .username { - flex: 3; - min-width: 300px; + flex-basis: 220px; + min-width: 25%; } .member-stats { align-content: center; @@ -14,20 +14,18 @@ justify-content: flex-end; } .attribute { + @extend %light; flex: 1; position: relative; text-align: center; - .icon, - .points { - @extend %xlarge; - color: $grayer; - &.top { - color: $fresh-taiga; - } + .icon { + @extend %larger; + color: $blackish; } .points { - @extend %title; - @extend %bold; + @extend %larger; + @extend %light; + color: $grayer; } .top { color: $fresh-taiga; @@ -93,11 +91,11 @@ @extend %bold; } .position { + @extend %light; color: $gray-light; } } .popover { - @extend %small; @include popover(100%, '', 0, 30px, '', 15px, '', 50%, -5px); } }