.directory { margin-bottom: 100px; &.users-directory { .period-chooser { .selected-name { margin: 0; } .period-chooser-header .caret-icon { margin: 0; } } } .user-info { margin-bottom: 0; } .spinner { clear: both; } .directory-controls { display: flex; justify-content: space-between; .filter-name { height: 1em; } } .directory-last-updated { margin-bottom: 0.5em; color: $primary-medium; font-size: $font-down-1; } table { width: 100%; margin-bottom: 1em; td, th { padding: 0.5em; text-align: left; border-bottom: 1px solid $primary-low; @media screen and (max-width: $small-width) { padding: 0.5em 0.25em; } .number, .time-read { font-size: $font-up-3; color: $primary-medium; @media screen and (max-width: $small-width) { font-size: $font-up-1; } } .time-read { white-space: nowrap; } } th.sortable { width: 13%; .d-icon-heart { color: $love; margin: 0 0.25em 0 0; } } } .me { background-color: $highlight-low-or-medium; .username a, .name, .title, .number, .time-read { color: $primary-medium; } } }