discourse/app/assets/stylesheets/desktop/components/user-card.scss
David Taylor 8d50f092b5
DEV: Use classes for styling user and group cards (#8913)
Styling based on element-ids, it is impossible for themes/plugins to display multiple cards on a single page. Using classes is a more flexible approach. The element-ids are maintained for backwards compatibility with existing plugins/themes.
2020-02-13 09:58:17 +00:00

51 lines
775 B
SCSS

// shared styles for user and group cards
.user-card,
.group-card {
position: absolute;
z-index: z("usercard");
&.fixed {
position: fixed;
z-index: z("header") + 1;
}
&.docked-card {
z-index: z("header") + 1;
}
// avatar - names - controls
.first-row {
.names {
flex: 1 1 auto;
}
.usercard-controls {
button {
min-width: 150px;
}
}
}
h1 {
.d-icon {
font-size: $font-down-1;
}
}
h2 {
font-size: $font-up-1;
}
h3 {
font-size: $font-0;
}
}
// styles for user cards only
.user-card {
// badges
.badge-section {
.user-badge {
display: block;
max-width: 185px;
margin: 0 0.5em 0 0;
}
.more-user-badges {
max-width: 125px;
}
}
}