summaryrefslogtreecommitdiffstats
path: root/webapp/sass
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/sass')
-rw-r--r--webapp/sass/components/_modal.scss2
-rw-r--r--webapp/sass/components/_popover.scss9
-rw-r--r--webapp/sass/components/_tooltip.scss6
-rw-r--r--webapp/sass/layout/_content.scss28
-rw-r--r--webapp/sass/layout/_forms.scss5
-rw-r--r--webapp/sass/layout/_headers.scss29
-rw-r--r--webapp/sass/layout/_post-right.scss9
-rw-r--r--webapp/sass/layout/_post.scss20
-rw-r--r--webapp/sass/layout/_webhooks.scss16
-rw-r--r--webapp/sass/responsive/_desktop.scss17
-rw-r--r--webapp/sass/responsive/_mobile.scss8
-rw-r--r--webapp/sass/responsive/_tablet.scss35
12 files changed, 162 insertions, 22 deletions
diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss
index 93bd9fda4..bfc082ad3 100644
--- a/webapp/sass/components/_modal.scss
+++ b/webapp/sass/components/_modal.scss
@@ -345,7 +345,7 @@
}
img {
- max-height: 100%;
+ max-height: calc(100vh - 200px);
max-width: 100%;
}
diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss
index 6b1c57725..93b567ad3 100644
--- a/webapp/sass/components/_popover.scss
+++ b/webapp/sass/components/_popover.scss
@@ -209,6 +209,15 @@
.more-modal__row {
min-height: inherit;
}
+
+ .more-modal__details {
+ line-height: 32px;
+ }
+
+ .more-modal__actions {
+ line-height: 31px;
+ margin: 0;
+ }
}
.popover-content {
diff --git a/webapp/sass/components/_tooltip.scss b/webapp/sass/components/_tooltip.scss
index 0049fe1b8..6953dad58 100644
--- a/webapp/sass/components/_tooltip.scss
+++ b/webapp/sass/components/_tooltip.scss
@@ -7,6 +7,12 @@
padding: 3px 10px 4px;
word-break: break-word;
}
+
+ &.text-nowrap {
+ .tooltip-inner {
+ white-space: nowrap;
+ }
+ }
}
#webrtcTooltip {
diff --git a/webapp/sass/layout/_content.scss b/webapp/sass/layout/_content.scss
index 02f063573..b6fe98eb4 100644
--- a/webapp/sass/layout/_content.scss
+++ b/webapp/sass/layout/_content.scss
@@ -9,10 +9,20 @@
.search-btns {
display: none;
}
- .header-list__members {
+ .header-list__right {
+ // the negative margin-right is used
+ // to prevent the icons in the header from
+ // moving to the left when the RHS is open
+ //
+ // the below z-index is used to ensure the icons
+ // stays on the top and don't get hidden by the
+ // search's input block
+ position: relative;
+ z-index: 6;
+
margin-right: -18px;
- float: right;
padding-right: 0px !important;
+ float: right;
}
}
@@ -23,10 +33,20 @@
.search-btns {
display: none;
}
- .header-list__members {
+ .header-list__right {
+ // the negative margin-right is used
+ // to prevent the icons in the header from
+ // moving to the left when the RHS is open
+ //
+ // the below z-index is used to ensure the icons
+ // stays on the top and don't get hidden by the
+ // search's input block
+ position: relative;
+ z-index: 6;
+
margin-right: -18px;
- float: right;
padding-right: 0px !important;
+ float: right
}
}
}
diff --git a/webapp/sass/layout/_forms.scss b/webapp/sass/layout/_forms.scss
index 7552290d8..64c74b0a5 100644
--- a/webapp/sass/layout/_forms.scss
+++ b/webapp/sass/layout/_forms.scss
@@ -62,7 +62,6 @@
.has-error {
.help-block,
- .control-label,
.radio,
.checkbox,
.radio-inline,
@@ -70,6 +69,10 @@
color: $red;
}
+ .control-label {
+ color: inherit;
+ }
+
&.radio,
&.checkbox,
&.radio-inline,
diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss
index 8ee6e8fdc..f8211d433 100644
--- a/webapp/sass/layout/_headers.scss
+++ b/webapp/sass/layout/_headers.scss
@@ -7,26 +7,43 @@
line-height: 56px;
width: 100%;
- .member-popover__trigger {
+ .member-popover__trigger,
+ .pinned-posts-button {
cursor: pointer;
- min-width: 60px;
- padding-right: 10px;
- text-align: right;
+ display: inline-block;
+ margin-left: 7px;
+ min-width: 30px;
+ text-align: center;
white-space: nowrap;
.fa {
font-size: 16px;
+ }
+ }
+
+ .member-popover__container,
+ .member-popover__trigger {
+ display: inline;
+ }
+
+ .member-popover__trigger {
+ .fa {
margin-left: 4px;
}
}
+ .pinned-posts-button svg {
+ position: relative;
+ top: 2px;
+ }
+
&.alt {
margin: 0;
th {
font-weight: normal !important;
- &.header-list__members {
+ &.header-list__right {
padding-right: 4px;
}
}
@@ -48,7 +65,7 @@
}
&:last-child {
- padding-right: 8px;
+ padding-right: 6px;
width: 8.9%;
}
}
diff --git a/webapp/sass/layout/_post-right.scss b/webapp/sass/layout/_post-right.scss
index 455ed7fff..9a0f658a2 100644
--- a/webapp/sass/layout/_post-right.scss
+++ b/webapp/sass/layout/_post-right.scss
@@ -53,6 +53,12 @@
border: none;
}
+ .date-separator {
+ hr {
+ border-top: 1px solid #eee;
+ }
+ }
+
.post-create__container {
width: 100%;
@@ -147,7 +153,8 @@
@include flex(1 1 auto);
overflow: auto;
position: relative;
-
+ padding-top: 10px;
+
.file-preview__container {
margin-top: 5px;
}
diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss
index 5ecd50468..1e1dd4b08 100644
--- a/webapp/sass/layout/_post.scss
+++ b/webapp/sass/layout/_post.scss
@@ -359,6 +359,9 @@
}
.post-create__container {
+ label {
+ font-weight: normal;
+ }
.custom-textarea {
overflow: hidden;
}
@@ -763,6 +766,7 @@
line-height: 1.6em;
margin: 0;
white-space: pre-wrap;
+ word-break: break-word;
}
.post__header--info {
@@ -800,7 +804,7 @@
.flag-icon__container {
left: 36px;
- margin-left: 5px;
+ margin-left: 7px;
position: absolute;
top: 8px;
}
@@ -1357,15 +1361,25 @@
}
}
-.bot-indicator {
+.bot-indicator,
+.post__pinned-badge {
border-radius: 2px;
font-family: inherit;
font-size: 10px;
font-weight: 600;
- margin: 2px 10px 0 -4px;
padding: 1px 4px;
}
+.bot-indicator {
+ margin: 2px 10px 0 -4px;
+}
+
+.post__pinned-badge {
+ margin-left: 7px;
+ position: relative;
+ top: -1px;
+}
+
.permalink-text {
overflow: hidden;
}
diff --git a/webapp/sass/layout/_webhooks.scss b/webapp/sass/layout/_webhooks.scss
index f3a8c6fd3..c36edb8a2 100644
--- a/webapp/sass/layout/_webhooks.scss
+++ b/webapp/sass/layout/_webhooks.scss
@@ -41,6 +41,7 @@
&.attachment--opengraph {
max-width: 800px;
}
+
.attachment__content {
border-radius: 4px;
border-style: solid;
@@ -71,16 +72,18 @@
&.attachment__container--danger {
border-left-color: #e40303;
}
+
&.attachment__container--opengraph {
display: table;
- table-layout: fixed;
- width: 100%;
margin: 0;
padding-bottom: 13px;
+ width: 100%;
+
div {
margin: 0;
}
}
+
.sitename {
color: #A3A3A3;
}
@@ -89,8 +92,8 @@
.attachment__body__wrap {
&.attachment__body__wrap--opengraph {
display: table-cell;
- width: 100%;
vertical-align: top;
+ width: 100%;
}
}
@@ -104,6 +107,7 @@
&.attachment__body--no_thumb {
width: 100%;
}
+
&.attachment__body--opengraph {
float: none;
padding-right: 0;
@@ -142,6 +146,7 @@
margin-top: 10px;
max-height: 200px;
max-width: 400px;
+ width: 100%;
&.loading {
height: 150px;
@@ -164,16 +169,17 @@
&.has-link {
color: #2f81b7;
- text-overflow: ellipsis;
overflow: hidden;
+ text-overflow: ellipsis;
white-space: nowrap;
}
&.attachment__title--opengraph {
height: auto;
word-wrap: break-word;
+
&.is-url {
- word-break: break-all
+ word-break: break-all;
}
}
}
diff --git a/webapp/sass/responsive/_desktop.scss b/webapp/sass/responsive/_desktop.scss
index 891431f20..f671104e1 100644
--- a/webapp/sass/responsive/_desktop.scss
+++ b/webapp/sass/responsive/_desktop.scss
@@ -76,6 +76,23 @@
}
}
}
+
+ &.move--left {
+ .post {
+ &.post--root,
+ &.other--root {
+ .post__header {
+ padding-right: 70px;
+ }
+ }
+
+ &.post--comment {
+ .post__header {
+ padding-right: 70px;
+ }
+ }
+ }
+ }
}
}
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 891b0ed48..4fbec082a 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -1,6 +1,10 @@
@charset 'UTF-8';
@media screen and (max-width: 768px) {
+ .table-responsive {
+ border: none;
+ }
+
.multi-select__container {
.btn {
display: block;
@@ -253,6 +257,7 @@
}
}
}
+
blockquote {
margin-top: 0;
}
@@ -274,6 +279,7 @@
.post__header {
margin-bottom: 0;
+ padding-right: 70px;
.col__reply {
top: -3px;
@@ -1342,7 +1348,7 @@
a {
border-bottom: 1px solid;
- line-height: 50px;
+ line-height: 45px;
position: relative;
text-align: center;
}
diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss
index 06a725a31..3bafc38d4 100644
--- a/webapp/sass/responsive/_tablet.scss
+++ b/webapp/sass/responsive/_tablet.scss
@@ -127,6 +127,15 @@
top: auto;
}
}
+
+ &.move--left,
+ &.webrtc--show,
+ &.move--right {
+ .header-list__right {
+ // hide it behind the RHS
+ z-index: -1;
+ }
+ }
}
.post {
.attachment {
@@ -182,6 +191,14 @@
}
}
}
+
+ .sidebar--right__title {
+ display: inline-block;
+ max-width: 300px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ }
}
.inner-wrap {
@@ -213,6 +230,11 @@
}
}
+ .post__pinned-badge {
+ margin-left: 0;
+ margin-right: 5px;
+ }
+
&:not(.post--thread) {
padding: 5px .5em 0 77px;
@@ -359,9 +381,16 @@
}
.post__header {
+ float: left;
+ padding-top: 3px;
+
.col__reply {
top: -21px;
}
+
+ .post__pinned-badge {
+ margin-right: 5px;
+ }
}
&:not(.post--compact) {
@@ -381,6 +410,12 @@
}
}
}
+
+ &.post--comment:not(.post--compact) {
+ .post__pinned-badge {
+ margin-left: 10px;
+ }
+ }
}
}
}