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/_admin-console.scss17
-rw-r--r--web/sass-files/sass/partials/_base.scss21
-rw-r--r--web/sass-files/sass/partials/_colorpicker.scss251
-rw-r--r--web/sass-files/sass/partials/_files.scss9
-rw-r--r--web/sass-files/sass/partials/_forms.scss1
-rw-r--r--web/sass-files/sass/partials/_headers.scss5
-rw-r--r--web/sass-files/sass/partials/_loading.scss2
-rw-r--r--web/sass-files/sass/partials/_markdown.scss67
-rw-r--r--web/sass-files/sass/partials/_mentions.scss9
-rw-r--r--web/sass-files/sass/partials/_modal.scss42
-rw-r--r--web/sass-files/sass/partials/_post.scss16
-rw-r--r--web/sass-files/sass/partials/_search.scss1
-rw-r--r--web/sass-files/sass/partials/_settings.scss45
-rw-r--r--web/sass-files/sass/partials/_sidebar--left.scss6
-rw-r--r--web/sass-files/sass/partials/_sidebar--right.scss11
-rw-r--r--web/sass-files/sass/partials/_videos.scss10
-rw-r--r--web/sass-files/sass/styles.scss2
17 files changed, 473 insertions, 42 deletions
diff --git a/web/sass-files/sass/partials/_admin-console.scss b/web/sass-files/sass/partials/_admin-console.scss
index 9823d2611..11794a269 100644
--- a/web/sass-files/sass/partials/_admin-console.scss
+++ b/web/sass-files/sass/partials/_admin-console.scss
@@ -1,5 +1,5 @@
-.sidebar--left {
- &.sidebar--collapsable {
+
+.sidebar--left { &.sidebar--collapsable {
background: #333;
.team__header {
background: transparent;
@@ -9,7 +9,7 @@
li {
padding: 0;
.icon {
- width: 15px;
+ width: 17px;
}
> a {
color: #fff;
@@ -19,6 +19,11 @@
background-color: $primary-color;
}
}
+ > h4 {
+ background: #333;
+ padding: 10px 10px;
+ margin: 1px 0 0;
+ }
}
.menu-icon--right {
vertical-align: top;
@@ -29,12 +34,15 @@
font-size: 13px;
right: -2px;
position: relative;
+ color: #fff;
}
}
&.nav__sub-menu {
- padding: 5px 0;
background: #111;
-webkit-font-smoothing: auto;
+ &.padded {
+ padding: 5px 0;
+ }
li {
> a {
font-size: 13px;
@@ -88,6 +96,7 @@
overflow: auto;
background-color: #f1f1f1;
padding: 0 20px 20px;
+ min-height: 600px;
}
.wrapper--fixed {
max-width: 800px;
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index cdc2152e9..87d9b8200 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -34,20 +34,27 @@ body {
}
}
-b, strong {
- font-weight: 600;
+.popover {
+ color: #333;
+ a {
+ color: $primary-color;
+ &:hover, &:focus {
+ color: $primary-color;
+ }
+ }
}
-a {
- word-break: break-word;
+.word-break--all {
+ word-break: break-all;
}
-a.theme {
+a {
+ word-break: break-word;
color: $primary-color;
}
-div.theme {
- background-color: $primary-color;
+a:focus, a:hover {
+ color: $primary-color;
}
.tooltip {
diff --git a/web/sass-files/sass/partials/_colorpicker.scss b/web/sass-files/sass/partials/_colorpicker.scss
new file mode 100644
index 000000000..431f9d8d0
--- /dev/null
+++ b/web/sass-files/sass/partials/_colorpicker.scss
@@ -0,0 +1,251 @@
+/*!
+ * Bootstrap Colorpicker
+ * http://mjolnic.github.io/bootstrap-colorpicker/
+ *
+ * Originally written by (c) 2012 Stefan Petre
+ * Licensed under the Apache License v2.0
+ * http://www.apache.org/licenses/LICENSE-2.0.txt
+ *
+ */
+
+.colorpicker-saturation {
+ float: left;
+ width: 100px;
+ height: 100px;
+ cursor: crosshair;
+ background-image: url("../images/bootstrap-colorpicker/saturation.png");
+}
+
+.colorpicker-saturation i {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: block;
+ width: 5px;
+ height: 5px;
+ margin: -4px 0 0 -4px;
+ border: 1px solid #000;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
+.colorpicker-saturation i b {
+ display: block;
+ width: 5px;
+ height: 5px;
+ border: 1px solid #fff;
+ -webkit-border-radius: 5px;
+ -moz-border-radius: 5px;
+ border-radius: 5px;
+}
+
+.colorpicker-hue,
+.colorpicker-alpha {
+ float: left;
+ width: 15px;
+ height: 100px;
+ margin-bottom: 4px;
+ margin-left: 4px;
+ cursor: row-resize;
+}
+
+.colorpicker-hue i,
+.colorpicker-alpha i {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: block;
+ width: 100%;
+ height: 1px;
+ margin-top: -1px;
+ background: #000;
+ border-top: 1px solid #fff;
+}
+
+.colorpicker-hue {
+ background-image: url("../images/bootstrap-colorpicker/hue.png");
+}
+
+.colorpicker-alpha {
+ display: none;
+ background-image: url("../images/bootstrap-colorpicker/alpha.png");
+}
+
+.colorpicker-saturation,
+.colorpicker-hue,
+.colorpicker-alpha {
+ background-size: contain;
+}
+
+.colorpicker {
+ top: 0;
+ left: 0;
+ z-index: 2500;
+ min-width: 130px;
+ padding: 4px;
+ margin-top: 1px;
+ -webkit-border-radius: 4px;
+ -moz-border-radius: 4px;
+ border-radius: 4px;
+ *zoom: 1;
+}
+
+.colorpicker:before,
+.colorpicker:after {
+ display: table;
+ line-height: 0;
+ content: "";
+}
+
+.colorpicker:after {
+ clear: both;
+}
+
+.colorpicker:before {
+ position: absolute;
+ top: -7px;
+ left: 6px;
+ display: inline-block;
+ border-right: 7px solid transparent;
+ border-bottom: 7px solid #ccc;
+ border-left: 7px solid transparent;
+ border-bottom-color: rgba(0, 0, 0, 0.2);
+ content: '';
+}
+
+.colorpicker:after {
+ position: absolute;
+ top: -6px;
+ left: 7px;
+ display: inline-block;
+ border-right: 6px solid transparent;
+ border-bottom: 6px solid #ffffff;
+ border-left: 6px solid transparent;
+ content: '';
+}
+
+.colorpicker div {
+ position: relative;
+}
+
+.colorpicker.colorpicker-with-alpha {
+ min-width: 140px;
+}
+
+.colorpicker.colorpicker-with-alpha .colorpicker-alpha {
+ display: block;
+}
+
+.colorpicker-color {
+ height: 10px;
+ margin-top: 5px;
+ clear: both;
+ background-image: url("../images/bootstrap-colorpicker/alpha.png");
+ background-position: 0 100%;
+}
+
+.colorpicker-color div {
+ height: 10px;
+}
+
+.colorpicker-selectors {
+ display: none;
+ height: 10px;
+ margin-top: 5px;
+ clear: both;
+}
+
+.colorpicker-selectors i {
+ float: left;
+ width: 10px;
+ height: 10px;
+ cursor: pointer;
+}
+
+.colorpicker-selectors i + i {
+ margin-left: 3px;
+}
+
+.colorpicker-element .input-group-addon i,
+.colorpicker-element .add-on i {
+ display: inline-block;
+ width: 16px;
+ height: 16px;
+ vertical-align: text-top;
+ cursor: pointer;
+}
+
+.colorpicker.colorpicker-inline {
+ position: relative;
+ z-index: auto;
+ display: inline-block;
+ float: none;
+}
+
+.colorpicker.colorpicker-horizontal {
+ width: 110px;
+ height: auto;
+ min-width: 110px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-saturation {
+ margin-bottom: 4px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-color {
+ width: 100px;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+ float: left;
+ width: 100px;
+ height: 15px;
+ margin-bottom: 4px;
+ margin-left: 0;
+ cursor: col-resize;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue i,
+.colorpicker.colorpicker-horizontal .colorpicker-alpha i {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: block;
+ width: 1px;
+ height: 15px;
+ margin-top: 0;
+ background: #ffffff;
+ border: none;
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-hue {
+ background-image: url("../images/bootstrap-colorpicker/hue-horizontal.png");
+}
+
+.colorpicker.colorpicker-horizontal .colorpicker-alpha {
+ background-image: url("../images/bootstrap-colorpicker/alpha-horizontal.png");
+}
+
+.colorpicker.colorpicker-hidden {
+ display: none;
+}
+
+.colorpicker.colorpicker-visible {
+ display: block;
+}
+
+.colorpicker-inline.colorpicker-visible {
+ display: inline-block;
+}
+
+.colorpicker-right:before {
+ right: 6px;
+ left: auto;
+}
+
+.colorpicker-right:after {
+ right: 7px;
+ left: auto;
+} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index 405265f92..6dbb82810 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -157,23 +157,23 @@
border-left: 1px solid #ddd;
font-size: 13px;
padding: 7px;
+ color: #333;
.post-image__name {
margin-bottom: 3px;
display: block;
- color: #333;
}
.post-image__download {
display: inline-block;
padding-right: 7px;
cursor: pointer;
- color: #555;
+ @include opacity(0.7);
}
.post-image__type {
- color: grey;
+ @include opacity(0.6);
}
.post-image__size {
margin-left: 4px;
- color: grey;
+ @include opacity(0.6);
}
}
a {
@@ -214,4 +214,3 @@
}
}
}
-
diff --git a/web/sass-files/sass/partials/_forms.scss b/web/sass-files/sass/partials/_forms.scss
index c8b08f44d..65ea161d4 100644
--- a/web/sass-files/sass/partials/_forms.scss
+++ b/web/sass-files/sass/partials/_forms.scss
@@ -18,6 +18,7 @@
.input__help {
color: #777;
margin: 10px 0 0 10px;
+ word-break: break-word;
&.dark {
color: #222;
}
diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss
index 702f0fd60..b5fcb6145 100644
--- a/web/sass-files/sass/partials/_headers.scss
+++ b/web/sass-files/sass/partials/_headers.scss
@@ -39,6 +39,7 @@
text-overflow: ellipsis;
color: #888;
margin-top: 2px;
+ max-height: 45px;
}
&.popover {
white-space: normal;
@@ -231,6 +232,10 @@
width: 45px;
color: #999;
cursor: pointer;
+ .fa {
+ margin-left: 3px;
+ font-size: 16px;
+ }
}
&.alt {
margin: 0;
diff --git a/web/sass-files/sass/partials/_loading.scss b/web/sass-files/sass/partials/_loading.scss
index d71055722..ab8601df6 100644
--- a/web/sass-files/sass/partials/_loading.scss
+++ b/web/sass-files/sass/partials/_loading.scss
@@ -37,4 +37,4 @@
to { opacity: 0.1; }
}
}
-}
+} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_markdown.scss b/web/sass-files/sass/partials/_markdown.scss
new file mode 100644
index 000000000..122586354
--- /dev/null
+++ b/web/sass-files/sass/partials/_markdown.scss
@@ -0,0 +1,67 @@
+.markdown__heading {
+ font-weight: 700;
+}
+.markdown__paragraph-inline {
+ display: inline;
+ + .markdown__paragraph-inline {
+ margin-left: 4px;
+ }
+}
+.post-body {
+ hr {
+ height: 4px;
+ padding: 0;
+ margin: 15px 0 16px;
+ background-color: #e7e7e7;
+ border: 0 none;
+ @include opacity(0.2);
+ }
+}
+.markdown__table {
+ background: #fff;
+ margin: 5px 0 10px;
+ th, td {
+ padding: 6px 13px;
+ border: 1px solid #ddd;
+ }
+ tbody tr {
+ background: #fff;
+ &:nth-child(2n) {
+ background-color: #f8f8f8;
+ }
+ }
+}
+blockquote {
+ border: none;
+ position: relative;
+ font-size: 16px;
+ padding: 10px 10px 10px 38px;
+ margin-bottom: 0;
+ &:before {
+ font-family: FontAwesome;
+ font-weight: normal;
+ font-style: normal;
+ display: inline-block;
+ text-decoration: inherit;
+ content: "\f10d";
+ left: 8px;
+ top: 5px;
+ position: absolute;
+ font-size: 20px;
+ @include opacity(0.6);
+ }
+}
+pre {
+ border: none;
+ background-color: #f7f7f7;
+ margin: 5px 0;
+ .current--user & {
+ background: #fff;
+ }
+ code {
+ color: #c7254e;
+ }
+}
+code {
+ background: #fff;
+}
diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss
index aa893c535..48746ba01 100644
--- a/web/sass-files/sass/partials/_mentions.scss
+++ b/web/sass-files/sass/partials/_mentions.scss
@@ -63,10 +63,11 @@
padding-left: 10px;
}
-.mention-highlight {
- background-color:#fff2bb;
+.mention-link {
+ color: $primary-color;
}
-.mention-link {
- color:$primary-color;
+.mention-highlight {
+ background-color:#fff2bb;
+ color: #333;
} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index a046cd904..e4e8b20b6 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -3,11 +3,36 @@
}
.modal {
width: 100%;
+ color: #333;
&.image_modal {
.modal-backdrop.in {
@include opacity(0.7);
}
}
+ a, a:focus, a:hover {
+ color: #2389D7;
+ &.text-danger {
+ color: #a94442;
+ }
+ }
+ .custom-textarea {
+ color: inherit;
+ border-color: #ccc;
+ &:focus {
+ border-color: #ccc;
+ box-shadow: none;
+ }
+ }
+ .btn {
+ font-size: 13px;
+ &.btn-primary {
+ background: #4285f4;
+ &:hover, &:focus, &:active {
+ background: $primary-color--hover;
+ color: #fff;
+ }
+ }
+ }
.info__label {
font-weight: 600;
text-align: right;
@@ -171,16 +196,13 @@
position: relative;
max-width: 90%;
min-height: 100px;
- min-width: 320px;
+ min-width: 240px;
@include border-radius(3px);
display: table;
margin: 0 auto;
&:hover {
@include border-radius(3px 3px 0 0);
}
- &:hover .modal-close {
- @include opacity(1);
- }
&.default {
width: 100%;
height: 80%;
@@ -194,8 +216,15 @@
right: -13px;
top: -13px;
@include opacity(0);
+ -webkit-transition: opacity 0.6s;
+ -moz-transition: opacity 0.6s;
+ -o-transition: opacity 0.6s;
+ transition: opacity 0.6s;
cursor: pointer;
z-index: 9999;
+ &.modal-close--show {
+ @include opacity(1);
+ }
}
> a {
background: #FFF;
@@ -207,7 +236,7 @@
max-height: 100%;
}
}
- .image-content {
+ .modal-content{
box-shadow: none;
background: rgba(0, 0, 0, 0);
width: 100%;
@@ -291,6 +320,7 @@
}
}
+
// Invite New Member
.invite {
margin-right: 40px;
@@ -305,4 +335,4 @@
padding-left: 0;
}
}
-} \ No newline at end of file
+}
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 6940cf2fb..7532875d6 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -2,13 +2,17 @@
white-space:pre-wrap;
word-wrap:break-word;
background:transparent;
- border:1px solid #ccc !important;
+ border:1px solid #ccc;
position:absolute;
top:0px;
height:auto;
resize: none;
line-height:20px;
min-height:36px;
+ &:focus {
+ border-color: #ccc;
+ box-shadow: none;
+ }
}
.bad-connection {
@@ -225,17 +229,17 @@ body.ios {
right: 0;
position: absolute;
top: 1px;
- color: #999;
+ color: #444;
+ @include opacity(0.5);
@include single-transition(all, 0.15s);
font-size: 16px;
padding: 7px 9px 6px;
&:hover, &:active {
- color: #444;
+ @include opacity(0.9);
box-shadow: none;
}
}
textarea {
- border: none;
box-shadow: none;
}
}
@@ -253,7 +257,7 @@ body.ios {
line-height: 18px;
display: inline-block;
font-size: 13px;
- color: #777;
+ @include opacity(0.6);
}
}
}
@@ -275,7 +279,7 @@ body.ios {
&.current--user {
.post-body {
@include border-radius(4px);
- background: #f5f5f5;
+ background: rgba(#000, 0.05);
}
}
&.post--comment {
diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss
index 9ae41ebb0..9abdd40da 100644
--- a/web/sass-files/sass/partials/_search.scss
+++ b/web/sass-files/sass/partials/_search.scss
@@ -107,4 +107,5 @@
.search-highlight.theme, .search-highlight {
background-color: #FFF2BB;
+ color: #333;
}
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 2b59a943b..3aab05d70 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -32,6 +32,7 @@
}
.settings-table {
display: table;
+ table-layout: fixed;
width: 100%;
> div {
display: table-cell;
@@ -79,6 +80,36 @@
}
}
+ .appearance-section {
+ .premade-themes {
+ .theme-label {
+ font-weight: 400;
+ margin-top: 5px;
+ }
+ img {
+ border: 3px solid transparent;
+ }
+ .active {
+ img {
+ border-color: $primary-color;
+ }
+ }
+ }
+ .custom-label {
+ font-weight: normal;
+ font-size: 13px;
+ width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-bottom: 0;
+ }
+ .radio {
+ label {
+ font-weight: 600;
+ }
+ }
+ }
+
.section-title {
margin-bottom: 5px;
font-weight: 600;
@@ -95,6 +126,10 @@
}
}
+ .font--small {
+ font-size: 13px;
+ }
+
.section-describe {
color:grey;
}
@@ -125,8 +160,18 @@
.has-error {
color: #a94442;
}
+ .padding-top {
+ padding-top: 7px;
+ &.x2 {
+ padding-top: 14px;
+ }
+ }
.control-label {
color: #555;
+ font-weight: 600;
+ &.text-left {
+ text-align: left;
+ }
}
hr {
border-color: #ccc;
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index 94583b153..6a418e270 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -16,6 +16,12 @@
overflow-y: auto;
max-width: 200px;
width: 200px;
+ a {
+ color: #262626 !important;
+ &:hover, &:focus {
+ background: #f5f5f5 !important;
+ }
+ }
}
.search__form {
margin: 0;
diff --git a/web/sass-files/sass/partials/_sidebar--right.scss b/web/sass-files/sass/partials/_sidebar--right.scss
index d02a92448..b37dbf421 100644
--- a/web/sass-files/sass/partials/_sidebar--right.scss
+++ b/web/sass-files/sass/partials/_sidebar--right.scss
@@ -51,9 +51,10 @@
margin: 11px 0 0 0;
width: 22px;
height: 22px;
- background: url("../images/closeSidebar.png");
- @include background-size(100% 100%);
opacity: 0.5;
+ font-size: 22px;
+ line-height: 0;
+ background: none;
float: right;
outline: none;
border: none;
@@ -61,11 +62,15 @@
&:hover, &:active {
opacity: 0.8;
}
+ i {
+ position: relative;
+ top: -2px;
+ }
}
.sidebar--right__header {
font-size: 1em;
text-transform: uppercase;
- color: #444;
+ color: inherit;
height: 44px;
padding: 0 1em;
line-height: 44px;
diff --git a/web/sass-files/sass/partials/_videos.scss b/web/sass-files/sass/partials/_videos.scss
index de18aa08a..9e1ce29b7 100644
--- a/web/sass-files/sass/partials/_videos.scss
+++ b/web/sass-files/sass/partials/_videos.scss
@@ -1,6 +1,7 @@
.video-div {
position:relative;
max-width: 480px;
+ margin-bottom: 8px;
.video-thumbnail {
max-width: 100%;
height: auto;
@@ -19,18 +20,15 @@
}
.video-type {
- color:grey;
+ @include opacity(0.8);
font-size:15px;
- font-weight:200;
margin:0px;
padding:0px;
}
.video-uploader {
- font-size:15px;
- margin-top:3px;
- margin-bottom:0px;
- padding:0px;
+ font-size: 13px;
+ margin: 0 0 15px;
}
.video-title {
diff --git a/web/sass-files/sass/styles.scss b/web/sass-files/sass/styles.scss
index de1db57e8..e704536a8 100644
--- a/web/sass-files/sass/styles.scss
+++ b/web/sass-files/sass/styles.scss
@@ -10,6 +10,7 @@
@import "partials/perfect-scrollbar";
@import "partials/font-awesome";
@import "partials/base";
+@import "partials/colorpicker";
// Channel Css
@import "partials/headers";
@@ -36,6 +37,7 @@
@import "partials/error-bar";
@import "partials/loading";
@import "partials/get-link";
+@import "partials/markdown";
// Responsive Css
@import "partials/responsive";