summaryrefslogtreecommitdiffstats
path: root/web/sass-files/sass
diff options
context:
space:
mode:
Diffstat (limited to 'web/sass-files/sass')
-rw-r--r--web/sass-files/sass/partials/_base.scss22
-rw-r--r--web/sass-files/sass/partials/_files.scss6
-rw-r--r--web/sass-files/sass/partials/_headers.scss4
-rw-r--r--web/sass-files/sass/partials/_loading.scss68
-rw-r--r--web/sass-files/sass/partials/_mentions.scss2
-rw-r--r--web/sass-files/sass/partials/_modal.scss13
-rw-r--r--web/sass-files/sass/partials/_post.scss49
-rw-r--r--web/sass-files/sass/partials/_post_right.scss4
-rw-r--r--web/sass-files/sass/partials/_responsive.scss80
-rw-r--r--web/sass-files/sass/partials/_search.scss2
-rw-r--r--web/sass-files/sass/partials/_settings.scss4
-rw-r--r--web/sass-files/sass/partials/_sidebar--left.scss3
-rw-r--r--web/sass-files/sass/partials/_sidebar--right.scss4
-rw-r--r--web/sass-files/sass/styles.scss1
14 files changed, 196 insertions, 66 deletions
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 5808aeb44..cf28e44e8 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -3,7 +3,7 @@ html, body {
}
body {
- font-family: 'Lato', sans-serif;
+ font-family: 'Open Sans', sans-serif;
-webkit-font-smoothing: antialiased;
background: #e9e9e9;
position: relative;
@@ -11,21 +11,29 @@ body {
&.white {
background: #fff;
.inner__wrap {
- height: 100%;
+ > .row.content {
+ min-height: 100%;
+ margin-bottom: -89px;
+ }
}
- .row.content {
- min-height: 100%;
- height: auto !important;
+ }
+ .inner__wrap {
+ height: 100%;
+ > .row.main {
height: 100%;
- margin-bottom: -89px;
}
}
> .container-fluid {
@include clearfix;
+ height: 100%;
position: relative;
}
}
+b, strong {
+ font-weight: 600;
+}
+
a {
word-break: break-word;
}
@@ -142,7 +150,7 @@ div.theme {
top: 0;
color: #FFF;
font-size: 20px;
- font-weight: bold;
+ font-weight: 600;
text-decoration: none;
padding: 0 10px;
}
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index b01d2e157..1268d8a07 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -13,6 +13,7 @@
vertical-align: top;
position: relative;
border: 1px solid #DDD;
+ @include clearfix;
&.custom-file {
width: 85px;
height: 100px;
@@ -31,8 +32,8 @@
}
}
.preview-img {
- width:100%;
- height:100%;
+ height: auto;
+ max-width: 100%;
}
.remove-preview {
position: absolute;
@@ -136,6 +137,7 @@
border: 1px solid #E2E2E2;
background-color: #FFF;
background-repeat: no-repeat;
+ background-position: left center;
}
a {
text-decoration: none;
diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss
index 89bbaef2b..1ec1109a5 100644
--- a/web/sass-files/sass/partials/_headers.scss
+++ b/web/sass-files/sass/partials/_headers.scss
@@ -65,7 +65,7 @@
float:left;
}
.channel-intro-title {
- font-weight:bold;
+ font-weight:600;
}
.channel-intro-text {
margin-top:35px;
@@ -88,7 +88,7 @@
}
.dropdown-menu {
li a {
- padding: 3 20px;
+ padding: 3px 20px;
color: #555;
}
}
diff --git a/web/sass-files/sass/partials/_loading.scss b/web/sass-files/sass/partials/_loading.scss
new file mode 100644
index 000000000..185a42180
--- /dev/null
+++ b/web/sass-files/sass/partials/_loading.scss
@@ -0,0 +1,68 @@
+.loading-screen {
+ display: table;
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ @include box-sizing(border-box);
+ text-align: center;
+ .loading__content {
+ display: table-cell;
+ vertical-align: middle;
+ h3 {
+ font-weight: 400;
+ margin: 0 0.2em 0;
+ display: inline-block;
+ }
+ }
+}
+
+.loading-screen {
+ .loading__content {
+ .round {
+ background-color: #444;
+ width: 4px;
+ height: 4px;
+ display: inline-block;
+ margin: 0 1px;
+ opacity: 0.1;
+ @include border-radius(10px);
+ -moz-animation: move 0.75s infinite linear;
+ -webkit-animation: move 0.75s infinite linear;
+ }
+
+ #round_1 {
+ -moz-animation-delay: .2s;
+ -webkit-animation-delay: .2s;
+ }
+
+ #round_2 {
+ -moz-animation-delay: .4s;
+ -webkit-animation-delay: .4s;
+ }
+
+ #round_3 {
+ -moz-animation-delay: .6s;
+ -webkit-animation-delay: .6s;
+ }
+
+ @-moz-keyframes move {
+ 0% {
+ opacity: 1;
+ }
+
+ 100% {
+ opacity: 0.1;
+ };
+ }
+
+ @-webkit-keyframes move {
+ 0% {
+ opacity: 1;
+ }
+
+ 100% {
+ opacity: 0.1;
+ };
+ }
+ }
+}
diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss
index ee254b546..d6e2ab368 100644
--- a/web/sass-files/sass/partials/_mentions.scss
+++ b/web/sass-files/sass/partials/_mentions.scss
@@ -9,7 +9,7 @@
.mentions--top {
position: absolute;
- z-index: 1040;
+ z-index: 1060;
.mentions-box {
position:absolute;
background-color:#fff;
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index 4427cb7dd..637f908ca 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -2,13 +2,14 @@
padding: 20px 15px;
}
.modal {
+ width: 100%;
&.image_modal {
.modal-backdrop.in {
@include opacity(0.7);
}
}
.info__label {
- font-weight: bold;
+ font-weight: 600;
text-align: right;
padding-right: 0;
}
@@ -21,7 +22,6 @@
margin-right: auto;
}
.modal-body {
- max-height: 75%;
overflow: auto;
}
.modal-push-down {
@@ -66,7 +66,6 @@
}
}
.btn {
- margin-right: 10px;
&.btn-primary {
float: right;
margin-top: -4px;
@@ -120,7 +119,7 @@
}
.more-channel-name {
color: #444;
- font-weight: bold;
+ font-weight: 600;
font-size: 0.95em;
}
tbody {
@@ -145,11 +144,12 @@
.modal-image {
position:relative;
width:100%;
+ height: 100%;
margin: 0 auto;
.image-wrapper {
background: #FFF;
position: relative;
- max-width: 80%;
+ max-width: 90%;
min-width: 280px;
@include border-radius(3px);
display: table;
@@ -262,6 +262,9 @@
color:white;
margin-left:5px;
}
+ .public-link {
+ margin-right: 5px;
+ }
}
}
}
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 745d50173..f33cedd16 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -63,13 +63,13 @@ body.ios {
}
&.hovered--after {
&:before {
- background: #f6f6f6;
+ background: #f5f5f5;
display: block;
}
}
&.hovered--before {
&:after {
- background: #f6f6f6;
+ background: #f5f5f5;
display: block;
}
}
@@ -86,10 +86,11 @@ body.ios {
background: #FFF;
display: inline-block;
padding: 0 1em;
- font-weight: 900;
+ font-weight: 700;
@include border-radius(50px);
position: relative;
z-index: 5;
+ font-size: 13px;
}
}
.new-separator {
@@ -165,7 +166,7 @@ body.ios {
color: #999;
@include single-transition(all, 0.15s);
font-size: 16px;
- padding: 9px;
+ padding: 7px 9px 6px;
&:hover, &:active {
color: #444;
box-shadow: none;
@@ -191,7 +192,7 @@ body.ios {
.post {
word-wrap: break-word;
- padding: 0.4em 1em;
+ padding: 8px 1em;
position: relative;
max-width: 100%;
@include legacy-pie-clearfix;
@@ -201,14 +202,36 @@ body.ios {
@include opacity(1);
}
}
- background: #f6f6f6;
+ background: #f5f5f5;
+ }
+ &.current--user {
+ .post-body {
+ @include border-radius(4px);
+ background: #f5f5f5;
+ }
}
&.post--comment {
&.other--root {
.post-comment {
border-left: 4px solid #EEE;
- margin-left: 30px;
- padding: 2px 0 2px 10px;
+ padding: 4px 0 6px 10px;
+ margin: 0 0 0 30px;
+ @include border-radius(0 4px 4px 0);
+ }
+ .post-body {
+ background: transparent;
+ margin: 0;
+ padding: 1px 0px;
+ }
+ &.current--user {
+ .post-comment {
+ background: #f5f5f5;
+ }
+ }
+ }
+ &.same--root {
+ .post-body {
+ @include border-radius(0 4px 4px 0);
}
}
}
@@ -217,6 +240,7 @@ body.ios {
@include opacity(0);
}
div.post-profile-img__container {
+ height: 1px;
.post-profile-img {
visibility: hidden;
}
@@ -249,9 +273,11 @@ body.ios {
}
p {
margin: 0 0 5px;
+ font-size: 0.97em;
white-space: pre-wrap;
}
.comment-icon__container {
+ margin-left: 7px;
fill: $primary-color;
.comment-icon {
display: inline-block;
@@ -269,7 +295,7 @@ body.ios {
float: left;
.post-profile-img {
margin-right: 10px;
- @include border-radius(3px);
+ @include border-radius(50px);
}
}
&.post__content {
@@ -290,6 +316,8 @@ body.ios {
width: 600px;
float: left;
word-wrap: break-word;
+ padding: 0.3em 0.5em 0.1em;
+ margin: -0.3em 0 0;
.post-link {
@include clearfix;
text-overflow: ellipsis;
@@ -336,7 +364,6 @@ body.ios {
}
.dropdown {
min-width: 18px;
- margin-right: 7px;
display: inline-block;
@include opacity(0);
}
@@ -359,7 +386,7 @@ body.ios {
.embed-title {
margin: 3px 0 1px;
color: #555;
- font-weight: bold;
+ font-weight: 600;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
diff --git a/web/sass-files/sass/partials/_post_right.scss b/web/sass-files/sass/partials/_post_right.scss
index 972aef29b..0d3e75689 100644
--- a/web/sass-files/sass/partials/_post_right.scss
+++ b/web/sass-files/sass/partials/_post_right.scss
@@ -11,7 +11,8 @@
.post {
&.post--root {
- padding: 1em;
+ padding: 1em 1em 0;
+ margin: 1em 0;
hr {
border-color: #DDD;
margin: 1em 0 0 0;
@@ -20,6 +21,7 @@
}
.post-create__container {
+ margin-top: 1em;
.custom-textarea {
min-height: 100px;
}
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 25533c770..1a2befc3f 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -2,13 +2,6 @@
.inner__wrap {
&.move--left {
.post {
- &.post--comment {
- &.other--root {
- .post-comment {
- margin-left: 0;
- }
- }
- }
&.same--root {
margin-left: 60px;
padding-left: 10px;
@@ -22,11 +15,27 @@
width: 825px;
}
.post-body {
- padding-left: 0;
+ width: 736px;
border: none;
- margin: 0;
+ margin: 3px 0 0;
}
}
+ &.post--comment {
+ &.other--root {
+ .post-comment {
+ margin-left: 0;
+ }
+ }
+ &.same--root {
+ margin-top: 10px;
+ margin-bottom: 10px;
+ }
+ }
+ .post-body {
+ float: none;
+ width: 750px;
+ margin: 3px 0 0;
+ }
.post__content {
width: 920px;
}
@@ -63,10 +72,6 @@
}
}
}
- .post-body {
- float: none;
- width: 750px;
- }
}
}
}
@@ -78,13 +83,6 @@
}
}
.post {
- &.post--comment {
- &.other--root {
- .post-comment {
- margin-left: 0;
- }
- }
- }
&.same--root {
margin-left: 60px;
padding-left: 10px;
@@ -98,9 +96,20 @@
width: 825px;
}
.post-body {
- padding-left: 0;
+ width: 736px;
border: none;
- margin: 0;
+ margin: 3px 0 0;
+ }
+ }
+ &.post--comment {
+ &.other--root {
+ .post-comment {
+ margin-left: 0;
+ }
+ }
+ &.same--root {
+ margin-top: 5px;
+ margin-bottom: 5px;
}
}
.post__content {
@@ -135,6 +144,7 @@
}
}
.post-body {
+ margin: 3px 0 0;
float: none;
width: 750px;
}
@@ -163,16 +173,9 @@
@media screen and (max-width: 960px) {
.post {
- &:hover {
- .post-header .post-header-col.post-header__reply {
- .comment-icon__container__hide {
- @include opacity(0);
- }
- }
- }
.post-header .post-header-col.post-header__reply {
.comment-icon__container__hide {
- @include opacity(0);
+ display: none;
}
.dropdown {
@include opacity(1);
@@ -205,12 +208,16 @@
@media screen and (max-width: 768px) {
#post-list {
- .date-seperator {
+ .date-seperator, .new-separator {
&.hovered--after {
- background: none;
+ &:before {
+ background: none;
+ }
}
&.hovered--before {
- background: none;
+ &:after {
+ background: none;
+ }
}
}
}
@@ -221,6 +228,13 @@
&:hover {
background: none;
}
+ &.post--comment {
+ &.other--root {
+ &:hover {
+ background: none;
+ }
+ }
+ }
}
.signup-team__container {
padding: 30px 0;
diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss
index ca5d25720..8d51d00c0 100644
--- a/web/sass-files/sass/partials/_search.scss
+++ b/web/sass-files/sass/partials/_search.scss
@@ -77,7 +77,7 @@
border: none;
}
.search-channel__name {
- font-weight: bold;
+ font-weight: 600;
margin: 0 0 10px 0;
}
}
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index dbaab8b58..af759c650 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -56,7 +56,7 @@
.section-title {
margin-bottom: 5px;
- font-weight: bold;
+ font-weight: 600;
}
.section-edit {
@@ -172,7 +172,7 @@
border-top:1px solid lightgrey;
}
.post-profile-img {
- @include border-radius(3px);
+ @include border-radius(50px);
margin-right: 8px;
}
.member-name {
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index b1dd470d2..89d1ff416 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -59,7 +59,7 @@
color: #999;
&.unread-title {
color: #333;
- font-weight: bold;
+ font-weight: 600;
}
&:hover, &:focus {
background: #e6f2fa;
@@ -70,6 +70,7 @@
color: #111;
background-color: #e1e1e1;
border-radius: 0;
+ font-weight: 400;
}
}
}
diff --git a/web/sass-files/sass/partials/_sidebar--right.scss b/web/sass-files/sass/partials/_sidebar--right.scss
index d6000a515..7a91caec9 100644
--- a/web/sass-files/sass/partials/_sidebar--right.scss
+++ b/web/sass-files/sass/partials/_sidebar--right.scss
@@ -23,8 +23,12 @@
}
}
}
+ .post-body {
+ margin: 3px 0 0;
+ }
}
.post-create__container {
+ margin-top: 10px;
.post-create-footer {
padding-top: 10px;
}
diff --git a/web/sass-files/sass/styles.scss b/web/sass-files/sass/styles.scss
index 8446f1c01..9cc26320c 100644
--- a/web/sass-files/sass/styles.scss
+++ b/web/sass-files/sass/styles.scss
@@ -29,6 +29,7 @@
@import "partials/modal";
@import "partials/mentions";
@import "partials/error";
+@import "partials/loading";
// Responsive Css
@import "partials/responsive";