2018-05-04 03:13:59 +08:00
|
|
|
// We should try to reuse the user page HTML for groups when possible
|
|
|
|
// To style group content differently, use the existing classes with a .group parent class.
|
2019-03-26 02:38:38 +08:00
|
|
|
// For example: .group .user-secondary-navigation
|
2018-05-04 03:13:59 +08:00
|
|
|
|
2020-09-17 23:23:19 +08:00
|
|
|
span.mention-group {
|
2021-02-23 08:02:47 +08:00
|
|
|
color: var(--primary);
|
2020-09-17 23:23:19 +08:00
|
|
|
}
|
|
|
|
|
2016-12-05 16:18:24 +08:00
|
|
|
.group-details-container {
|
2020-08-04 10:57:10 +08:00
|
|
|
background: var(--primary-very-low);
|
2016-12-05 16:18:24 +08:00
|
|
|
padding: 20px;
|
2016-12-22 13:07:30 +08:00
|
|
|
margin-bottom: 15px;
|
2018-03-29 14:57:10 +08:00
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
2021-03-25 22:07:38 +08:00
|
|
|
.group-delete-tooltip {
|
|
|
|
background-color: var(--tertiary-low);
|
|
|
|
padding: 0.1em 2.5em 0.1em 1em;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
}
|
|
|
|
|
2018-03-29 14:57:10 +08:00
|
|
|
.group-outlet {
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
2018-04-13 09:16:51 +08:00
|
|
|
.group-members-actions {
|
2018-05-08 22:08:31 +08:00
|
|
|
display: flex;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
width: 100%;
|
2018-04-13 09:16:51 +08:00
|
|
|
|
2018-05-09 00:27:25 +08:00
|
|
|
input + .group-members-manage {
|
2018-05-08 22:08:31 +08:00
|
|
|
margin-left: auto;
|
2018-04-13 09:16:51 +08:00
|
|
|
}
|
|
|
|
|
2018-05-08 22:08:31 +08:00
|
|
|
.group-username-filter {
|
|
|
|
margin: 0 0 5px 0;
|
2018-04-13 09:16:51 +08:00
|
|
|
vertical-align: middle;
|
|
|
|
}
|
2016-12-15 14:17:04 +08:00
|
|
|
}
|
|
|
|
|
2016-12-15 12:07:22 +08:00
|
|
|
.group-info {
|
2021-02-22 23:06:52 +08:00
|
|
|
align-items: flex-start;
|
|
|
|
display: flex;
|
|
|
|
gap: 10px;
|
|
|
|
|
|
|
|
.group-info-names {
|
|
|
|
flex-grow: 1;
|
|
|
|
}
|
2016-12-15 12:07:22 +08:00
|
|
|
|
|
|
|
.group-info-name {
|
2018-01-13 06:27:38 +08:00
|
|
|
font-size: $font-up-3;
|
2016-12-15 12:07:22 +08:00
|
|
|
font-weight: bold;
|
2020-08-04 10:57:10 +08:00
|
|
|
color: var(--primary);
|
2016-12-15 12:07:22 +08:00
|
|
|
}
|
|
|
|
|
|
|
|
.group-info-full-name {
|
2018-01-13 06:27:38 +08:00
|
|
|
font-size: $font-up-2;
|
2020-08-04 10:57:10 +08:00
|
|
|
color: var(--primary-high-or-secondary-low);
|
2016-12-15 12:07:22 +08:00
|
|
|
}
|
|
|
|
|
2016-12-22 14:30:49 +08:00
|
|
|
$size: 50px;
|
2018-11-30 01:02:11 +08:00
|
|
|
$icon-size: $size / 1.8;
|
2016-12-22 14:30:49 +08:00
|
|
|
|
|
|
|
.avatar-flair-image {
|
|
|
|
width: $size;
|
|
|
|
}
|
2016-12-15 12:07:22 +08:00
|
|
|
|
2016-12-22 14:30:49 +08:00
|
|
|
.avatar-flair {
|
2016-12-15 12:07:22 +08:00
|
|
|
background-size: $size;
|
|
|
|
height: $size;
|
2018-11-29 05:02:49 +08:00
|
|
|
width: $size;
|
|
|
|
border-radius: 50%;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: center;
|
2018-12-06 19:18:52 +08:00
|
|
|
background-repeat: no-repeat;
|
2016-12-15 12:07:22 +08:00
|
|
|
|
2018-11-27 05:49:57 +08:00
|
|
|
.d-icon {
|
2018-11-30 01:02:11 +08:00
|
|
|
height: $icon-size;
|
|
|
|
width: $icon-size;
|
2016-12-15 12:07:22 +08:00
|
|
|
}
|
|
|
|
}
|
2021-02-22 23:06:52 +08:00
|
|
|
|
|
|
|
.group-details-button {
|
|
|
|
display: flex;
|
2021-04-22 03:45:45 +08:00
|
|
|
flex-wrap: wrap;
|
|
|
|
button:not(:last-child) {
|
|
|
|
margin-right: 0.5em;
|
|
|
|
}
|
2021-02-22 23:06:52 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.group-nav {
|
|
|
|
.count {
|
|
|
|
margin-left: 5px;
|
|
|
|
}
|
2016-12-15 12:07:22 +08:00
|
|
|
}
|
|
|
|
|
2018-03-27 12:18:03 +08:00
|
|
|
.group-manage-logs-filter {
|
2016-12-11 23:36:15 +08:00
|
|
|
margin-right: 10px;
|
|
|
|
|
|
|
|
&:hover {
|
2020-08-04 10:57:10 +08:00
|
|
|
background-color: var(--danger);
|
2016-12-11 23:36:15 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-03-27 12:18:03 +08:00
|
|
|
table.group-manage-logs {
|
2016-12-11 23:36:15 +08:00
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
td {
|
2019-02-27 10:40:17 +08:00
|
|
|
padding: 0.5em;
|
2016-12-11 23:36:15 +08:00
|
|
|
}
|
|
|
|
|
2018-03-27 12:18:03 +08:00
|
|
|
.group-manage-logs-expand-details {
|
2016-12-11 23:36:15 +08:00
|
|
|
cursor: pointer;
|
|
|
|
|
2018-11-27 05:49:57 +08:00
|
|
|
.d-icon {
|
2020-08-04 10:57:10 +08:00
|
|
|
color: var(--primary-medium);
|
2016-12-11 23:36:15 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2016-11-30 16:11:02 +08:00
|
|
|
table.group-members {
|
|
|
|
width: 100%;
|
2016-12-07 17:28:43 +08:00
|
|
|
table-layout: fixed;
|
2016-11-30 16:11:02 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
th {
|
|
|
|
text-align: center;
|
2016-12-07 17:28:43 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
&.bulk-select {
|
|
|
|
height: 30px;
|
|
|
|
width: 30px;
|
|
|
|
}
|
2018-03-21 18:16:08 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
&.bulk-select-buttons {
|
|
|
|
text-align: left;
|
|
|
|
width: 20%;
|
|
|
|
}
|
2016-12-07 17:28:43 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
&.username {
|
|
|
|
text-align: left;
|
|
|
|
width: 30%;
|
|
|
|
}
|
2016-11-30 16:11:02 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
&.bulk-select-buttons + .username {
|
|
|
|
width: 10%;
|
|
|
|
}
|
|
|
|
|
|
|
|
&.group-members-actions {
|
|
|
|
width: 5%;
|
2016-11-30 16:11:02 +08:00
|
|
|
}
|
2021-02-03 22:11:08 +08:00
|
|
|
}
|
2016-11-30 16:11:02 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
td {
|
|
|
|
color: var(--primary-medium);
|
|
|
|
padding: 0.8em 0;
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
&.avatar {
|
2016-12-13 15:15:20 +08:00
|
|
|
text-align: left;
|
|
|
|
}
|
2021-02-03 22:11:08 +08:00
|
|
|
}
|
2016-12-13 15:15:20 +08:00
|
|
|
|
2021-02-03 22:11:08 +08:00
|
|
|
.user-info {
|
|
|
|
display: block;
|
|
|
|
|
|
|
|
.avatar-flair {
|
|
|
|
color: var(--primary);
|
2016-11-30 16:11:02 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.group-owner-label {
|
2020-08-04 10:57:10 +08:00
|
|
|
color: var(--primary);
|
2016-11-30 16:11:02 +08:00
|
|
|
}
|
|
|
|
|
2020-06-03 08:36:01 +08:00
|
|
|
.group-flair-inputs {
|
|
|
|
display: inline-block;
|
2016-11-30 16:11:02 +08:00
|
|
|
|
|
|
|
.avatar-flair-preview {
|
|
|
|
position: relative;
|
|
|
|
width: 45px;
|
|
|
|
|
|
|
|
.avatar-wrapper {
|
2020-08-04 10:57:10 +08:00
|
|
|
background-color: var(--primary-very-low);
|
2016-11-30 16:11:02 +08:00
|
|
|
}
|
|
|
|
}
|
2020-05-25 13:38:47 +08:00
|
|
|
|
|
|
|
.radios {
|
|
|
|
margin-bottom: 5px;
|
|
|
|
}
|
|
|
|
|
|
|
|
.radio-label {
|
|
|
|
display: inline-flex;
|
|
|
|
padding-right: 10px;
|
|
|
|
margin-bottom: 0;
|
|
|
|
align-items: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.uploaded-image-preview {
|
|
|
|
height: 75px;
|
|
|
|
width: 275px;
|
|
|
|
}
|
2016-11-30 16:11:02 +08:00
|
|
|
}
|
|
|
|
|
2018-03-29 14:57:10 +08:00
|
|
|
.group-form-save {
|
|
|
|
margin-right: 20px;
|
2016-12-07 14:42:58 +08:00
|
|
|
}
|
2018-03-26 14:30:37 +08:00
|
|
|
|
2018-04-06 11:36:57 +08:00
|
|
|
.group-add-members {
|
2020-02-07 03:47:53 +08:00
|
|
|
.ac-wrap {
|
|
|
|
overflow: hidden;
|
|
|
|
}
|
|
|
|
|
2018-04-06 11:36:57 +08:00
|
|
|
.group-add-members-make-owner {
|
2018-03-26 17:33:03 +08:00
|
|
|
label {
|
|
|
|
display: inline;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
|
2018-06-08 17:49:31 +08:00
|
|
|
input[type="checkbox"] {
|
2018-03-26 17:33:03 +08:00
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
}
|
2018-03-26 14:30:37 +08:00
|
|
|
}
|
2020-08-10 22:49:05 +08:00
|
|
|
|
|
|
|
label.group-category-permissions-desc {
|
|
|
|
font-size: 1.15em;
|
|
|
|
margin-bottom: 1em;
|
|
|
|
}
|
|
|
|
|
|
|
|
table.group-category-permissions {
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
tr {
|
|
|
|
line-height: 3em;
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
.category-name {
|
|
|
|
font-size: 1.25em;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|