discourse/app/assets/stylesheets/common/base/topic.scss

210 lines
3.7 KiB
SCSS
Raw Normal View History

@keyframes button-jump-up {
0% { bottom: 0;}
50% { bottom: 45px;}
65% { bottom: 40px;}
77% { bottom: 43px;}
100% { bottom: 40px;}
}
.progress-back-container {
position: fixed;
bottom: 40px;
z-index: 950;
margin-right: 0px;
animation-duration: 0.5s;
animation-name: button-jump-up;
width: 145px;
text-align: center;
.btn {
margin: 0;
}
}
#topic-progress-wrapper {
.topic-admin-menu-button-container {
position: relative;
right: 38px;
top: 35px;
.widget-button {
height: 35px;
border-right: 1px solid dark-light-diff($primary, $secondary, 80%, -70%);
}
}
.topic-admin-popup-menu.right-side {
position: relative;
right: 35px;
}
}
#topic-progress-wrapper.docked {
.topic-admin-popup-menu.right-side {
right: 40px;
}
}
2014-10-06 23:50:18 +08:00
#topic-title {
2015-01-15 04:36:38 +08:00
.title-wrapper {
float: left;
width: 90%;
2017-08-31 17:16:08 +08:00
2015-01-15 04:36:38 +08:00
.btn-small {
margin: 0 6px 0 0;
}
2015-04-15 03:54:17 +08:00
.badge-wrapper {
margin-right: 12px;
2015-04-15 03:54:17 +08:00
}
a.topic-featured-link {
display: inline-block;
}
2015-01-15 04:36:38 +08:00
}
2014-10-06 23:50:18 +08:00
h1 {
margin: 0 0 4px 0;
}
2014-10-06 23:50:18 +08:00
a.badge-category {
margin-top: 5px;
2015-01-15 04:36:38 +08:00
}
2014-10-06 23:50:18 +08:00
2014-12-19 16:46:24 +08:00
a.edit-topic i { font-size: 0.8em; }
2014-10-06 23:50:18 +08:00
}
.topic-title-outlet {
clear: both;
}
2015-04-15 03:54:17 +08:00
.extra-info-wrapper {
.badge-wrapper {
float: left;
&.bullet {
margin-top: 5px;
}
2015-04-15 03:54:17 +08:00
}
}
.has-pending-posts {
padding: 0.5em;
2017-06-12 10:20:14 +08:00
background-color: $highlight-medium;
a[href] {
float: right;
}
margin-top: 1em;
max-width: 757px;
}
// Target the .badge-category text, the bullet icon needs to maintain `display: block`
#suggested-topics h3 .badge-wrapper.bullet span.badge-category,
#suggested-topics h3 .badge-wrapper.box span,
#suggested-topics h3 .badge-wrapper.bar span {
display: inline;
}
#suggested-topics h3 .badge-wrapper.bullet span.badge-category {
// Override vertical-align: text-top from `badges.css.scss`
vertical-align: baseline;
line-height: 1.2;
}
#suggested-topics h3 .badge-wrapper.bullet,
#suggested-topics h3 .badge-wrapper.bullet span.badge-category-parent-bg,
#suggested-topics h3 .badge-wrapper.bullet span.badge-category-bg {
// Top of bullet aligns with top of line - adjust line height to vertically align bullet.
line-height: 0.8;
}
#suggested-topics .badge-wrapper.bullet span.badge-category,
#suggested-topics .badge-wrapper.bar span.badge-category {
max-width: 150px;
}
.topic-unsubscribe {
.notifications-button {
display: inline-block;
float: none;
line-height: 2em;
.dropdown-toggle {
float: none;
}
.dropdown-menu {
bottom: initial;
}
}
}
.post-links-container {
@include unselectable;
clear: both;
.post-links {
margin-top: 1em;
padding-top: 1em;
2017-06-12 10:20:14 +08:00
border-top: 1px solid $primary-low;
}
.expand-links {
2017-10-11 04:07:46 +08:00
color: dark-light-choose($primary-medium, $secondary-medium);
}
.track-link {
padding-left: 0;
display: inline-block;
overflow: hidden;
}
ul {
margin: 0;
list-style: none;
li {
margin-bottom: 0.5em;
a[href] {
2017-10-11 04:07:46 +08:00
color: dark-light-choose($primary-medium, $secondary-medium);
}
.clicks {
margin-left: 0.5em;
}
i {
2016-06-08 15:59:34 +08:00
float: left;
font-size: 0.857em;
2016-06-08 15:59:34 +08:00
margin: 0.3em 0.5em 0 0;
}
}
}
a.reply-new {
i {
background: $secondary;
border-radius: 20px;
transition: all linear .15s;
}
&:hover {
color: $tertiary;
i {
2017-06-12 10:20:14 +08:00
background: $tertiary-low;
}
}
}
}
a.topic-featured-link {
display: inline-block;
text-transform: lowercase;
color: dark-light-choose($primary-medium, $secondary-medium);
font-size: 0.875rem;
&::before {
position: relative;
top: 0.1em;
padding-right: 3px;
font-family: FontAwesome;
content: "\f08e";
}
}