summaryrefslogtreecommitdiffstats
path: root/web/sass-files
diff options
context:
space:
mode:
Diffstat (limited to 'web/sass-files')
-rw-r--r--web/sass-files/sass/partials/_base.scss22
-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.scss30
-rw-r--r--web/sass-files/sass/partials/_modal.scss40
-rw-r--r--web/sass-files/sass/partials/_post.scss16
-rw-r--r--web/sass-files/sass/partials/_responsive.scss51
-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/styles.scss1
11 files changed, 179 insertions, 62 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/_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 11cd4e9e4..d6e2ab368 100644
--- a/web/sass-files/sass/partials/_mentions.scss
+++ b/web/sass-files/sass/partials/_mentions.scss
@@ -3,21 +3,19 @@
background: $primary-color;
position: relative;
z-index: 10;
- padding-bottom: 1px;
+ padding-bottom: 2px;
@include border-radius(3px);
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
}
.mentions--top {
position: absolute;
- z-index:99999;
+ z-index: 1060;
.mentions-box {
position:absolute;
background-color:#fff;
- border:1px solid #ddd;
- overflow:scroll;
+ border: $border-gray;
+ overflow-x: hidden;
+ overflow-y: scroll;
bottom:0;
}
}
@@ -29,10 +27,10 @@
height:37px;
padding:2px;
z-index:101;
-}
-
-.mentions-name:hover {
- background-color:#e8eaed;
+ cursor: pointer;
+ &:hover {
+ background-color:#e8eaed;
+ }
}
.mentions-text {
@@ -46,6 +44,11 @@
border-radius: 10%;
}
+.mention-fullname {
+ color: grey;
+ padding-left: 10px;
+}
+
.mention-highlight {
background-color:#fff2bb;
}
@@ -53,3 +56,8 @@
.mention-link {
color:$primary-color;
}
+
+.mention-align {
+ position:relative;
+ top:5px;
+}
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index 43dbdc077..971ed0935 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -1,9 +1,17 @@
+.modal-body {
+ padding: 20px 15px;
+}
.modal {
&.image_modal {
.modal-backdrop.in {
@include opacity(0.7);
}
}
+ .info__label {
+ font-weight: 600;
+ text-align: right;
+ padding-right: 0;
+ }
.remove__member {
float: right;
}
@@ -13,7 +21,6 @@
margin-right: auto;
}
.modal-body {
- max-height: 75%;
overflow: auto;
}
.modal-push-down {
@@ -29,7 +36,7 @@
border-radius: 0;
background: $primary-color;
color: #FFF;
- padding: 15px 15px 11px;
+ padding: 15px 15px 11px;
border: none;
min-height: 56px;
@include clearfix;
@@ -41,14 +48,23 @@
margin: 0;
}
button.close {
- margin-top: 0;
+ margin: -2px -2px 0 0;
color: #fff;
@include opacity(1);
z-index: 5;
+ width: 30px;
+ height: 30px;
+ line-height: 30px;
+ @include single-transition(all, 0.25s, ease-in);
position: relative;
+ &:hover {
+ background: rgba(0, 0, 0, 0.1);
+ }
+ span {
+ line-height: 10px;
+ }
}
.btn {
- margin-right: 10px;
&.btn-primary {
float: right;
margin-top: -4px;
@@ -102,7 +118,7 @@
}
.more-channel-name {
color: #444;
- font-weight: bold;
+ font-weight: 600;
font-size: 0.95em;
}
tbody {
@@ -127,17 +143,19 @@
.modal-image {
position:relative;
width:100%;
+ height: 100%;
margin: 0 auto;
.image-wrapper {
- padding: 4px;
background: #FFF;
position: relative;
max-width: 80%;
- min-height: 280px;
min-width: 280px;
- @include border-radius(4px);
+ @include border-radius(3px);
display: table;
margin: 0 auto;
+ &:hover {
+ @include border-radius(3px 3px 0 0);
+ }
&:hover .modal-close {
@include opacity(1);
}
@@ -217,10 +235,11 @@
}
.modal-button-bar {
position:absolute;
- bottom:0px;
+ bottom:-40px;
left:0px;
right:0px;
- background-color:rgba(0, 0, 0, 0.8);
+ background-color: #222;
+ @include border-radius(0 0 3px 3px);
@include opacity(0);
-webkit-transition: opacity 0.6s;
-moz-transition: opacity 0.6s;
@@ -228,7 +247,6 @@
transition: opacity 0.6s;
line-height: 40px;
padding: 0 10px;
- margin: 4px;
&.footer--show {
@include opacity(1);
}
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 745d50173..769cb1091 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -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 {
@@ -212,6 +213,12 @@ body.ios {
}
}
}
+ &.current--user {
+ .post-body {
+ @include border-radius(0 4px 4px 0);
+ background: #f5f5f5;
+ }
+ }
&.same--root {
.comment-icon__container {
@include opacity(0);
@@ -249,6 +256,7 @@ body.ios {
}
p {
margin: 0 0 5px;
+ font-size: 0.97em;
white-space: pre-wrap;
}
.comment-icon__container {
@@ -269,7 +277,7 @@ body.ios {
float: left;
.post-profile-img {
margin-right: 10px;
- @include border-radius(3px);
+ @include border-radius(50px);
}
}
&.post__content {
@@ -290,6 +298,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;
@@ -359,7 +369,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/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index bed2f6324..0037879cf 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -5,7 +5,7 @@
&.post--comment {
&.other--root {
.post-comment {
- margin-left: 0;
+ margin-left: -7px;
}
}
}
@@ -22,11 +22,16 @@
width: 825px;
}
.post-body {
- padding-left: 0;
+ width: 736px;
border: none;
margin: 0;
}
}
+ .post-body {
+ float: none;
+ width: 750px;
+ margin: 0;
+ }
.post__content {
width: 920px;
}
@@ -63,10 +68,6 @@
}
}
}
- .post-body {
- float: none;
- width: 750px;
- }
}
}
}
@@ -81,7 +82,7 @@
&.post--comment {
&.other--root {
.post-comment {
- margin-left: 0;
+ margin-left: -7px;
}
}
}
@@ -89,6 +90,7 @@
margin-left: 60px;
padding-left: 10px;
border-left: 4px solid #EEE;
+ margin-bottom: 10px;
div.post-profile-img__container {
.post-profile-img {
display: none;
@@ -98,7 +100,7 @@
width: 825px;
}
.post-body {
- padding-left: 0;
+ width: 736px;
border: none;
margin: 0;
}
@@ -135,6 +137,7 @@
}
}
.post-body {
+ margin: 0;
float: none;
width: 750px;
}
@@ -231,17 +234,14 @@
}
}
.modal {
+ .info__label {
+ text-align: left;
+ padding-bottom: 5px;
+ }
.modal-header {
- padding-left: 20px;
- padding-right: 20px;
.modal-action {
margin-top: 10px;
}
- button.close {
- width: 35px;
- height: 32px;
- margin: -5px -10px 0;
- }
.modal-title {
float: none;
}
@@ -261,9 +261,11 @@
.settings-table {
display: block;
.settings-content {
- display: block;
- .section-edit {
- text-align: left;
+ &.minimize-settings {
+ display: block;
+ .section-edit {
+ text-align: left;
+ }
}
}
.settings-links {
@@ -287,10 +289,12 @@
}
.settings-table {
.settings-content {
- padding: 0;
- display: none;
- .user-settings {
- padding: 70px 20px 30px;
+ &.minimize-settings {
+ padding: 0;
+ display: none;
+ .user-settings {
+ padding: 70px 20px 30px;
+ }
}
}
.settings-links {
@@ -538,7 +542,6 @@
.modal {
.modal-image {
.image-wrapper {
- padding-bottom: 40px;
.modal-close {
@include opacity(1);
}
@@ -575,7 +578,7 @@
&.post--comment {
&.other--root {
.post-comment {
- margin-left: 11px;
+ margin-left: 4px;
}
}
}
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/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";