summaryrefslogtreecommitdiffstats
path: root/webapp/sass
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/sass')
-rw-r--r--webapp/sass/components/_emoticons.scss7
-rw-r--r--webapp/sass/components/_popover.scss1
-rw-r--r--webapp/sass/components/_search.scss4
-rw-r--r--webapp/sass/components/_status-icon.scss8
-rw-r--r--webapp/sass/components/_webrtc.scss5
-rw-r--r--webapp/sass/layout/_headers.scss31
-rw-r--r--webapp/sass/layout/_navigation.scss2
-rw-r--r--webapp/sass/layout/_sidebar-left.scss14
-rw-r--r--webapp/sass/layout/_sidebar-right.scss12
-rw-r--r--webapp/sass/responsive/_desktop.scss10
-rw-r--r--webapp/sass/responsive/_mobile.scss32
-rw-r--r--webapp/sass/responsive/_tablet.scss16
12 files changed, 85 insertions, 57 deletions
diff --git a/webapp/sass/components/_emoticons.scss b/webapp/sass/components/_emoticons.scss
index b91630a47..c8fd50226 100644
--- a/webapp/sass/components/_emoticons.scss
+++ b/webapp/sass/components/_emoticons.scss
@@ -80,6 +80,8 @@
.emoji-picker__search-container {
position: relative;
+ border-top-style: solid;
+ border-top-width: 1px;
.emoji-picker__search-icon {
padding-left: 6px;
@@ -89,8 +91,7 @@
}
.emoji-picker__search {
- border-width: 1px 0px 1px 0px;
- border-style: solid;
+ border-width: 0px;
padding: 2px 0 2px 25px;
width: 100%;
height: 25px;
@@ -108,6 +109,8 @@
overflow-y: auto;
padding: 0px 8px 8px 8px;
position: relative;
+ border-top-style: solid;
+ border-top-width: 1px;
.emoji-picker__category-header {
font-size: 12px;
diff --git a/webapp/sass/components/_popover.scss b/webapp/sass/components/_popover.scss
index 46e83f32d..90573c7ec 100644
--- a/webapp/sass/components/_popover.scss
+++ b/webapp/sass/components/_popover.scss
@@ -242,6 +242,7 @@
border-top: 1px solid;
cursor: pointer;
height: 45px;
+ overflow: hidden;
padding: 5px 19px 5px 17px;
&:hover {
diff --git a/webapp/sass/components/_search.scss b/webapp/sass/components/_search.scss
index e7fab0290..c9b8d4c02 100644
--- a/webapp/sass/components/_search.scss
+++ b/webapp/sass/components/_search.scss
@@ -78,8 +78,8 @@
top: 27px;
.search-bar__container & {
- right: 7px;
- top: 8px;
+ right: 12px;
+ top: 11px;
}
}
}
diff --git a/webapp/sass/components/_status-icon.scss b/webapp/sass/components/_status-icon.scss
index 03d9d0705..022cffa69 100644
--- a/webapp/sass/components/_status-icon.scss
+++ b/webapp/sass/components/_status-icon.scss
@@ -49,14 +49,14 @@
&.status--group {
border-radius: 2px;
- font-size: 11px;
+ font-size: 10px;
font-weight: 600;
- height: 16px;
+ height: 15px;
left: 1px;
- line-height: 15px;
+ line-height: 14px;
margin: 0 9px 0 -1px;
text-align: center;
- top: -1px;
+ top: -2px;
width: 15px;
.mentions__name & {
diff --git a/webapp/sass/components/_webrtc.scss b/webapp/sass/components/_webrtc.scss
index 839f9c8c1..05ef408e2 100644
--- a/webapp/sass/components/_webrtc.scss
+++ b/webapp/sass/components/_webrtc.scss
@@ -328,9 +328,4 @@
#videos.small {
position: relative;
}
-
- .search__form {
- margin-left: 5px;
- width: calc(100% - 80px);
- }
}
diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss
index dd8440d19..9a4d6771e 100644
--- a/webapp/sass/layout/_headers.scss
+++ b/webapp/sass/layout/_headers.scss
@@ -128,15 +128,15 @@
white-space: nowrap;
.move--left & {
- max-width: calc(100vw - 830px);
+ max-width: calc(100vw - 850px);
.multi-teams & {
- max-width: calc(100vw - 880px);
+ max-width: calc(100vw - 905px);
}
}
.multi-teams & {
- max-width: calc(100vw - 830px);
+ max-width: calc(100vw - 850px);
}
}
@@ -195,12 +195,15 @@
.channel-header__description {
display: inline-block;
- height: 22px;
- margin-top: 3px;
- max-width: calc(100vw - 730px);
+ height: 35px;
+ margin-top: -10px;
+ max-width: calc(100vw - 740px);
overflow: hidden;
+ padding: 3px 0 0;
+ position: relative;
text-overflow: ellipsis;
- white-space: nowrap;
+ top: 10px;
+ white-space: pre;
word-break: break-word;
.markdown__heading {
@@ -209,7 +212,7 @@
}
.multi-teams & {
- max-width: calc(100vw - 780px);
+ max-width: calc(100vw - 810px);
}
&.light {
@@ -223,7 +226,11 @@
}
.move--left & {
- max-width: calc(100vw - 780px);
+ max-width: calc(100vw - 810px);
+
+ .multi-teams & {
+ max-width: calc(100vw - 860px);
+ }
}
.markdown-inline-img {
@@ -311,7 +318,7 @@
@include legacy-pie-clearfix;
@include display-flex();
@include flex-direction(row-reverse);
- padding: 16px 47px 12px 12px;
+ padding: 16px 40px 12px 12px;
position: relative;
&:before {
@@ -426,9 +433,9 @@
.team__name,
.user__name {
display: block;
- font-size: 16px;
+ font-size: 14px;
font-weight: 600;
- max-width: 85%;
+ max-width: 100%;
overflow: hidden;
text-decoration: none;
text-overflow: ellipsis;
diff --git a/webapp/sass/layout/_navigation.scss b/webapp/sass/layout/_navigation.scss
index 09b6534b0..f1bce335c 100644
--- a/webapp/sass/layout/_navigation.scss
+++ b/webapp/sass/layout/_navigation.scss
@@ -104,13 +104,13 @@
padding: 0 .5em;
.heading {
- color: $white;
display: inline-block;
font-weight: 600;
line-height: 50px;
margin-right: 5px;
max-width: calc(100% - 200px);
overflow: hidden;
+ text-overflow: ellipsis;
vertical-align: top;
}
diff --git a/webapp/sass/layout/_sidebar-left.scss b/webapp/sass/layout/_sidebar-left.scss
index cc0c4920f..4be608803 100644
--- a/webapp/sass/layout/_sidebar-left.scss
+++ b/webapp/sass/layout/_sidebar-left.scss
@@ -37,7 +37,7 @@
.sidebar-item__name {
display: inline-block;
- max-width: 167px;
+ max-width: 160px;
overflow: hidden;
text-overflow: ellipsis;
vertical-align: top;
@@ -81,8 +81,8 @@
@include single-transition(all, .15s, ease-in);
display: block;
font-weight: 600;
- height: 50px;
- line-height: 50px;
+ height: 45px;
+ line-height: 40px;
padding: 0;
text-decoration: none;
width: 100%;
@@ -144,7 +144,7 @@
.nav-pills__container {
-webkit-overflow-scrolling: touch;
- height: calc(100% - 120px);
+ height: calc(100% - 115px);
overflow: auto;
position: relative;
}
@@ -215,6 +215,10 @@
&.has-close {
&:hover {
+ .sidebar-item__name {
+ max-width: 152px;
+ }
+
.btn-close {
@include opacity(.8);
display: block;
@@ -228,7 +232,7 @@
font-size: 21px;
font-weight: 600;
position: absolute;
- right: 18px;
+ right: 15px;
top: 0px;
&:hover {
diff --git a/webapp/sass/layout/_sidebar-right.scss b/webapp/sass/layout/_sidebar-right.scss
index 8181ac270..6d31c1606 100644
--- a/webapp/sass/layout/_sidebar-right.scss
+++ b/webapp/sass/layout/_sidebar-right.scss
@@ -128,7 +128,7 @@
color: inherit;
display: inline-block;
font-size: 26px;
- margin: 0 0 0 -14px;
+ margin-left: -14px;
text-align: center;
vertical-align: top;
width: 30px;
@@ -207,6 +207,11 @@
}
}
+ .sidebar--right__title {
+ @include clearfix;
+ padding-left: 15px;
+ }
+
.sidebar--right__header {
@include flex(0 0 44px);
border-bottom: 1px solid;
@@ -214,13 +219,14 @@
font-size: 1em;
height: 44px;
line-height: 44px;
- padding: 0 5px 0 15px;
+ overflow: hidden;
+ padding: 0 5px 0 0;
text-transform: uppercase;
}
.sidebar--right__subheader {
font-size: 1em;
- padding: 0.5em 1em 0;
+ padding: .5em 1em 0;
h4 {
font-size: 1em;
diff --git a/webapp/sass/responsive/_desktop.scss b/webapp/sass/responsive/_desktop.scss
index 67ec9e3a7..184b57710 100644
--- a/webapp/sass/responsive/_desktop.scss
+++ b/webapp/sass/responsive/_desktop.scss
@@ -91,7 +91,15 @@
max-width: calc(100vw - 800px);
.multi-teams & {
- max-width: calc(100vw - 750px);
+ max-width: calc(100vw - 775px);
+ }
+ }
+ }
+
+ .channel-header__info {
+ .channel-header__description {
+ .multi-teams & {
+ max-width: calc(100vw - 730px);
}
}
}
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 862c3a59c..8f44a883f 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -781,10 +781,7 @@
.settings-content {
.section-edit {
- padding-right: 0;
- position: absolute;
- right: 15px;
- top: 14px;
+ text-align: left;
.fa {
display: inline-block;
@@ -873,16 +870,20 @@
.heading {
font-size: 17px;
font-weight: 400;
- line-height: normal;
+ line-height: 50px;
position: relative;
- top: 14px;
vertical-align: top;
+
+ .ios & {
+ line-height: 48px;
+ }
}
.header-dropdown__icon {
font-size: 12px;
+ line-height: 50px;
margin-left: 5px;
- top: 20px;
+ top: 0;
vertical-align: top;
}
}
@@ -1024,9 +1025,8 @@
.icon--refresh {
@include opacity(.6);
- color: $black;
- right: 30px;
- top: 15px;
+ right: 16px;
+ top: 9px;
}
.form-control {
@@ -1047,8 +1047,8 @@
@include single-transition(transform, .35s, ease);
@include translate3d(290px, 0, 0);
border: none;
- width: 290px;
visibility: hidden;
+ width: 290px;
&.visible {
display: block;
@@ -1078,7 +1078,7 @@
}
.nav-pills__container {
- height: calc(100% - 60px);
+ height: calc(100% - 55px);
}
> div {
@@ -1291,10 +1291,10 @@
.app__content {
margin: 0;
- padding-top: 56px;
+ padding-top: 50px;
.channel__wrap & {
- padding-top: 56px;
+ padding-top: 50px;
}
#channel-header {
@@ -1579,6 +1579,10 @@
}
@media screen and (max-width: 480px) {
+ #user-profile-popover {
+ left: 50px !important;
+ }
+
.post {
.img-div {
max-width: 100%;
diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss
index 8b81f30ca..ef4c2e8e5 100644
--- a/webapp/sass/responsive/_tablet.scss
+++ b/webapp/sass/responsive/_tablet.scss
@@ -5,20 +5,20 @@
&.move--left {
.channel-header {
.heading {
- max-width: calc(100vw - 600px);
+ max-width: calc(100vw - 620px);
.multi-teams & {
- max-width: calc(100vw - 650px);
+ max-width: calc(100vw - 670px);
}
}
}
.channel-header__info {
.channel-header__description {
- max-width: calc(100vw - 600px);
+ max-width: calc(100vw - 620px);
.multi-teams & {
- max-width: calc(100vw - 650px);
+ max-width: calc(100vw - 670px);
}
}
}
@@ -34,20 +34,20 @@
.channel-header__info {
.channel-header__description {
- max-width: calc(100vw - 660px);
+ max-width: calc(100vw - 680px);
.multi-teams & {
- max-width: calc(100vw - 710px);
+ max-width: calc(100vw - 730px);
}
}
}
.channel-header {
.heading {
- max-width: calc(100vw - 700px);
+ max-width: calc(100vw - 720px);
.multi-teams & {
- max-width: calc(100vw - 750px);
+ max-width: calc(100vw - 770px);
}
}
}