9ddb87a6fd
- avatars via css only - random colors for entities - improves print view - added colors for teams - added color to tag
79 lines
1.8 KiB
SCSS
79 lines
1.8 KiB
SCSS
|
|
$avatar-base-size: 30;
|
|
|
|
.avatar {
|
|
text-align: center;
|
|
background-color: #d2d6de;
|
|
border-radius: 50%;
|
|
display: inline-block;
|
|
height: ($avatar-base-size)+px;
|
|
width: ($avatar-base-size)+px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.initials {
|
|
line-height: 1;
|
|
position: relative;
|
|
font-weight: bold;
|
|
font-size: ($avatar-base-size / 2 - 2)+px;
|
|
top: ($avatar-base-size / 4 - 1)+px;
|
|
}
|
|
|
|
.avatar-xs {
|
|
width: ($avatar-base-size * 0.75)+px;
|
|
height: ($avatar-base-size * 0.75)+px;
|
|
.initials {
|
|
font-size: ($avatar-base-size * .75 / 2 - 2)+px;
|
|
top: ($avatar-base-size * .75 / 4 - 1)+px;
|
|
}
|
|
}
|
|
|
|
.avatar-sm {
|
|
width: ($avatar-base-size * 1.25)+px;
|
|
height: ($avatar-base-size * 1.25)+px;
|
|
.initials {
|
|
font-size: ($avatar-base-size * 1.25 / 2 - 2)+px;
|
|
top: ($avatar-base-size * 1.25 / 4 - 1)+px;
|
|
}
|
|
}
|
|
|
|
.avatar-md {
|
|
width: ($avatar-base-size * 1.5)+px;
|
|
height: ($avatar-base-size * 1.5)+px;
|
|
.initials {
|
|
font-size: ($avatar-base-size * 1.5 / 2 - 2)+px;
|
|
top: ($avatar-base-size * 1.5 / 4 - 1)+px;
|
|
}
|
|
}
|
|
|
|
.avatar-lg {
|
|
width: ($avatar-base-size * 2)+px;
|
|
height: ($avatar-base-size * 2)+px;
|
|
.initials {
|
|
font-size: ($avatar-base-size * 2 / 2 - 2)+px;
|
|
top: ($avatar-base-size * 2 / 4 - 1)+px;
|
|
}
|
|
}
|
|
|
|
.widget-user-image {
|
|
border-radius: 50%;
|
|
border: 3px solid #fff;
|
|
.avatar {
|
|
width: ($avatar-base-size * 2.75)+px;
|
|
height: ($avatar-base-size * 2.75)+px;
|
|
.initials {
|
|
font-size: ($avatar-base-size * 2.75 / 2 - 2)+px;
|
|
top: ($avatar-base-size * 2.75 / 4 - 1)+px;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Detail tables like my teams (Dashboard) or */
|
|
table.dataTable.table > tbody > tr > td {
|
|
&.avatars {
|
|
.avatar {
|
|
margin: 1px;
|
|
}
|
|
}
|
|
}
|