.directory { margin-bottom: 100px; .user-info { margin-bottom: 0; } .period-chooser { float: left; } .filter-name { float: right; } .total-rows { color: blend-primary-secondary(50%); text-align: right; } .spinner { clear: both; } table { width: 100%; margin-bottom: 1em; td, th { padding: 0.5em; text-align: left; border-bottom: 1px solid $primary-low; .number, .time-read { font-size: 1.4em; color: $primary-medium; } } tr.me { td { background-color: $highlight-low; .username a, .name, .title, .number, .time-read { color: dark-light-choose(scale-color($highlight, $lightness: -50%), scale-color($highlight, $lightness: 50%)); } } } th.sortable { cursor: pointer; white-space: nowrap; width: 13%; .d-icon-heart { color: $love; margin-right: 0.5em; } .d-icon-chevron-down, .d-icon-chevron-up { margin-left: 0.5em; } &:hover { background-color: $primary-low; } } } }