2013-09-06 03:37:07 +08:00
|
|
|
// Styles for the topic admin menu
|
|
|
|
|
2014-10-07 02:19:07 +08:00
|
|
|
.show-topic-admin {
|
2013-09-06 03:37:07 +08:00
|
|
|
position: fixed;
|
2015-02-04 07:01:23 +08:00
|
|
|
top: 120px;
|
2013-09-06 03:37:07 +08:00
|
|
|
right: 10px;
|
2018-01-17 08:05:12 +08:00
|
|
|
z-index: z("dropdown");
|
2017-06-23 15:36:50 +08:00
|
|
|
height: 35px;
|
2013-09-06 03:37:07 +08:00
|
|
|
}
|
|
|
|
|
2015-09-16 01:28:50 +08:00
|
|
|
.popup-menu {
|
2014-05-06 13:50:51 +08:00
|
|
|
background-color: $secondary;
|
2018-02-24 02:51:06 +08:00
|
|
|
width: 215px;
|
2013-09-06 03:37:07 +08:00
|
|
|
padding: 10px;
|
2018-02-21 01:18:20 +08:00
|
|
|
border: 1px solid $primary-low;
|
2018-01-17 08:05:12 +08:00
|
|
|
z-index: z("dropdown");
|
2018-02-21 01:18:20 +08:00
|
|
|
box-shadow: shadow("card");
|
2013-09-06 03:37:07 +08:00
|
|
|
|
|
|
|
ul {
|
|
|
|
list-style: none;
|
|
|
|
margin: 10px 0 0 0;
|
|
|
|
}
|
|
|
|
|
2015-09-16 01:28:50 +08:00
|
|
|
.btn {
|
|
|
|
text-align: left;
|
|
|
|
}
|
|
|
|
|
2013-09-06 03:37:07 +08:00
|
|
|
button {
|
2018-02-24 02:51:06 +08:00
|
|
|
width: 100%;
|
2013-09-06 03:37:07 +08:00
|
|
|
margin-bottom: 5px;
|
|
|
|
}
|
2019-12-30 05:15:46 +08:00
|
|
|
|
|
|
|
.header {
|
|
|
|
.close-button {
|
|
|
|
display: none;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
@include breakpoint(mobile-extra-large) {
|
|
|
|
width: 100%;
|
|
|
|
padding: 0;
|
2019-12-31 08:52:25 +08:00
|
|
|
padding-bottom: env(safe-area-inset-bottom);
|
2020-05-08 04:24:47 +08:00
|
|
|
z-index: z("modal", "popover");
|
2019-12-31 08:52:25 +08:00
|
|
|
|
|
|
|
@keyframes slideUp {
|
|
|
|
0% {
|
|
|
|
transform: translateY(100%);
|
|
|
|
}
|
|
|
|
100% {
|
|
|
|
transform: translateY(0);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
animation: slideUp 0.3s;
|
2019-12-30 05:15:46 +08:00
|
|
|
|
|
|
|
.header {
|
|
|
|
padding: 10px 0 0 10px;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
.close-button {
|
|
|
|
display: block;
|
|
|
|
background: transparent;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
ul {
|
|
|
|
margin-top: 0;
|
|
|
|
}
|
|
|
|
}
|
2020-05-08 04:24:47 +08:00
|
|
|
|
|
|
|
.mobile-view & {
|
|
|
|
z-index: z("modal", "popover");
|
|
|
|
}
|
2014-03-08 21:25:03 +08:00
|
|
|
}
|
2015-03-14 14:53:41 +08:00
|
|
|
|
2015-07-29 22:34:21 +08:00
|
|
|
.modal-body.feature-topic {
|
|
|
|
max-height: 500px;
|
2017-06-23 23:51:04 +08:00
|
|
|
input.date-picker {
|
|
|
|
margin: 0;
|
|
|
|
}
|
2015-07-29 22:34:21 +08:00
|
|
|
.feature-section {
|
|
|
|
display: block;
|
2020-02-20 00:24:45 +08:00
|
|
|
padding: 1em 0;
|
2020-02-20 00:08:15 +08:00
|
|
|
&:not(:last-of-type) {
|
|
|
|
border-bottom: 1px solid $primary-low;
|
|
|
|
}
|
2015-07-29 22:34:21 +08:00
|
|
|
.badge-wrapper {
|
|
|
|
margin-right: 0;
|
|
|
|
}
|
|
|
|
.desc {
|
|
|
|
display: inline-block;
|
|
|
|
vertical-align: middle;
|
|
|
|
p:first-of-type {
|
|
|
|
margin: 0;
|
|
|
|
}
|
|
|
|
p {
|
|
|
|
margin: 10px 0 0;
|
|
|
|
}
|
2015-03-14 14:53:41 +08:00
|
|
|
}
|
2015-08-27 04:23:08 +08:00
|
|
|
.with-validation {
|
|
|
|
position: relative;
|
|
|
|
}
|
2015-03-14 14:53:41 +08:00
|
|
|
}
|
2020-02-20 02:50:12 +08:00
|
|
|
}
|
2020-02-20 00:08:15 +08:00
|
|
|
|
2020-02-20 02:50:12 +08:00
|
|
|
.feature-topic-modal {
|
2020-02-20 00:08:15 +08:00
|
|
|
.d-modal-cancel {
|
|
|
|
margin-left: 0;
|
|
|
|
}
|
2015-03-14 14:53:41 +08:00
|
|
|
}
|
2015-07-29 22:34:21 +08:00
|
|
|
|
2018-06-16 15:19:08 +08:00
|
|
|
.desktop-view .feature-topic-modal {
|
|
|
|
.feature-topic {
|
|
|
|
overflow: visible;
|
|
|
|
}
|
|
|
|
|
|
|
|
.modal-inner-container {
|
|
|
|
min-width: 700px;
|
|
|
|
}
|
2018-07-19 05:27:12 +08:00
|
|
|
|
|
|
|
.pin-until {
|
|
|
|
position: relative;
|
|
|
|
display: inline-block;
|
|
|
|
}
|
2018-06-16 15:19:08 +08:00
|
|
|
}
|
|
|
|
|
2015-03-14 14:53:41 +08:00
|
|
|
.mobile-view .feature-topic .feature-section {
|
|
|
|
.desc {
|
|
|
|
display: block;
|
|
|
|
clear: both;
|
|
|
|
max-width: 90%;
|
2020-02-20 00:08:15 +08:00
|
|
|
margin: 0;
|
2015-03-14 14:53:41 +08:00
|
|
|
}
|
|
|
|
}
|
2018-07-21 04:37:43 +08:00
|
|
|
|
|
|
|
// Select posts
|
|
|
|
|
|
|
|
.selected-posts {
|
|
|
|
border: 1px solid $tertiary-medium;
|
|
|
|
background-color: $tertiary-low;
|
|
|
|
.btn {
|
|
|
|
border: none;
|
|
|
|
color: $secondary;
|
|
|
|
font-weight: normal;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
&:not(.btn-danger) {
|
|
|
|
background: $tertiary;
|
|
|
|
border-color: $tertiary;
|
|
|
|
&[href] {
|
|
|
|
color: $secondary;
|
|
|
|
}
|
|
|
|
&:hover {
|
|
|
|
color: $secondary;
|
|
|
|
background: $tertiary-high;
|
|
|
|
}
|
|
|
|
&:active {
|
|
|
|
@include linear-gradient(
|
|
|
|
darken($tertiary, 18%),
|
|
|
|
darken($tertiary, 12%)
|
|
|
|
);
|
|
|
|
color: $secondary;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
&[disabled] {
|
|
|
|
text-shadow: 0 1px 0 rgba($primary, 0.2);
|
|
|
|
@include linear-gradient($tertiary, darken($tertiary, 20%));
|
|
|
|
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.33);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|