summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--web/react/components/channel_header.jsx2
-rw-r--r--web/react/components/mention_list.jsx12
-rw-r--r--web/react/components/post_list.jsx14
-rw-r--r--web/react/components/user_profile.jsx2
-rw-r--r--web/sass-files/sass/partials/_base.scss4
-rw-r--r--web/sass-files/sass/partials/_files.scss61
-rw-r--r--web/sass-files/sass/partials/_headers.scss14
-rw-r--r--web/sass-files/sass/partials/_modal.scss9
-rw-r--r--web/sass-files/sass/partials/_navbar.scss1
-rw-r--r--web/sass-files/sass/partials/_popover.scss7
-rw-r--r--web/sass-files/sass/partials/_responsive.scss10
-rw-r--r--web/templates/channel.html4
12 files changed, 99 insertions, 41 deletions
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index 76dbe370b..1702175d6 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -59,7 +59,7 @@ var PopoverListMembers = React.createClass({
return (
<div id="member_popover" data-toggle="popover" data-content={popoverHtml} data-original-title="Members" >
- <div id="member_tooltip" data-toggle="tooltip" title="View Channel Members">
+ <div id="member_tooltip" title="View Channel Members">
{count} <span className="glyphicon glyphicon-user" aria-hidden="true"></span>
</div>
</div>
diff --git a/web/react/components/mention_list.jsx b/web/react/components/mention_list.jsx
index 71a6083d2..829462456 100644
--- a/web/react/components/mention_list.jsx
+++ b/web/react/components/mention_list.jsx
@@ -20,6 +20,10 @@ module.exports = React.createClass({
PostStore.addMentionDataChangeListener(this._onChange);
var self = this;
+ $('.post-right__scroll').scroll(function(){
+ self.forceUpdate();
+ });
+
$('body').on('keydown.mentionlist', '#'+this.props.id,
function(e) {
if (!self.isEmpty() && self.state.mentionText != '-1' && (e.which === 13 || e.which === 9)) {
@@ -32,7 +36,7 @@ module.exports = React.createClass({
e.preventDefault();
var tempSelectedMention = -1;
- if (e.which === 38) {
+ if (e.which === 38) {
if (self.getSelection(self.state.selectedMention - 1))
self.setState({ selectedMention: self.state.selectedMention - 1, selectedUsername: self.refs['mention' + (self.state.selectedMention - 1)].props.username });
else {
@@ -106,13 +110,13 @@ module.exports = React.createClass({
this.setState({ selectedMention: listId, selectedUsername: this.refs['mention' + listId].props.username });
},
getSelection: function(listId) {
- if (!this.refs['mention' + listId])
+ if (!this.refs['mention' + listId])
return false;
else
return true;
},
addCurrentMention: function() {
- if (!this.getSelection(this.state.selectedMention))
+ if (!this.getSelection(this.state.selectedMention))
this.addFirstMention();
else
this.refs['mention' + this.state.selectedMention].handleClick();
@@ -132,7 +136,7 @@ module.exports = React.createClass({
scrollAmount = $("#mentionsbox").height() * 100; //Makes sure that it scrolls all the way to the bottom
else if (direction === "down" && this.state.selectedMention === 0)
scrollAmount = 0;
- else if (direction === "up")
+ else if (direction === "up")
scrollAmount = "-=" + ($('#'+this.refs['mention' + this.state.selectedMention].props.id +"_mentions").innerHeight() - 5);
else if (direction === "down")
scrollAmount = "+=" + ($('#'+this.refs['mention' + this.state.selectedMention].props.id +"_mentions").innerHeight() - 5);
diff --git a/web/react/components/post_list.jsx b/web/react/components/post_list.jsx
index 3f59d5843..0b19d774c 100644
--- a/web/react/components/post_list.jsx
+++ b/web/react/components/post_list.jsx
@@ -37,15 +37,25 @@ module.exports = React.createClass({
componentDidMount: function() {
var user = UserStore.getCurrentUser();
if (user.props && user.props.theme) {
- utils.changeCss('a.theme', 'color:'+user.props.theme+'; fill:'+user.props.theme+'!important;');
utils.changeCss('div.theme', 'background-color:'+user.props.theme+';');
utils.changeCss('.btn.btn-primary', 'background: ' + user.props.theme+';');
- utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, -10) +';');
utils.changeCss('.modal .modal-header', 'background: ' + user.props.theme+';');
utils.changeCss('.mention', 'background: ' + user.props.theme+';');
utils.changeCss('.mention-link', 'color: ' + user.props.theme+';');
utils.changeCss('@media(max-width: 768px){.search-bar__container', 'background: ' + user.props.theme+';}');
}
+ if (user.props.theme != "#000000" && user.props.theme != "#585858"){
+ utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, -10) +';');
+ utils.changeCss('a.theme', 'color:'+user.props.theme+'; fill:'+user.props.theme+'!important;');
+ }
+ else if (user.props.theme == "#000000"){
+ utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, +50) +';');
+ $('.team__header').addClass('theme--black');
+ }
+ else if (user.props.theme == "#585858"){
+ utils.changeCss('.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus', 'background: ' + utils.changeColor(user.props.theme, +10) +';');
+ $('.team__header').addClass('theme--gray');
+ }
PostStore.addChangeListener(this._onChange);
ChannelStore.addChangeListener(this._onChange);
diff --git a/web/react/components/user_profile.jsx b/web/react/components/user_profile.jsx
index 65f025919..f7e1a6257 100644
--- a/web/react/components/user_profile.jsx
+++ b/web/react/components/user_profile.jsx
@@ -57,7 +57,7 @@ module.exports = React.createClass({
if (!config.ShowEmail) {
data_content += "<div class='text-nowrap'>Email not shared</div>";
} else {
- data_content += "<div><a href='mailto:" + this.state.profile.email + "' class='text-nowrap text-lowercase'>" + this.state.profile.email + "</a></div>";
+ data_content += "<div data-toggle='tooltip' title= '" + this.state.profile.email + "'><a href='mailto:" + this.state.profile.email + "' class='text-nowrap text-lowercase user-popover__email'>" + this.state.profile.email + "</a></div>";
}
return (
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 52659521d..11a04964d 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -61,6 +61,10 @@ div.theme {
}
}
+.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
+ cursor: auto;
+}
+
.form-group {
&.form-group--small {
margin-bottom: 10px;
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index ddc5e98bb..6b27753bd 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -4,7 +4,8 @@
max-height: 110px;
height: 110px;
white-space: nowrap;
- overflow: auto;
+ overflow-x: auto;
+ overflow-y: hidden;
.preview-div {
display: inline-block;
width: 120px;
@@ -28,9 +29,9 @@
}
}
.preview-img {
- display: block;
- height: auto;
- max-width: 100%;
+ display: block;
+ height: auto;
+ max-width: 100%;
}
.remove-preview {
position: absolute;
@@ -130,15 +131,17 @@
background-color: #FFF;
background-repeat: no-repeat;
&.small {
- background-position: center;
+ background-position: center;
}
&.normal {
- background-position: top left;
+ background-position: top left;
}
}
.post-image__thumbnail {
width: 50%;
height: 100%;
+ cursor: zoom-in;
+ cursor: -webkit-zoom-in;
}
.post-image__details {
width: 50%;
@@ -165,34 +168,34 @@
}
.file-details__container {
- @include display-flex;
- display: -ms-flexbox;
+ @include display-flex;
+ display: -ms-flexbox;
- .file-details {
- width: 320px;
- height: 270px;
- padding: 14px;
- text-align: left;
- vertical-align: top;
+ .file-details {
+ width: 320px;
+ height: 270px;
+ padding: 14px;
+ text-align: left;
+ vertical-align: top;
- .file-details__name {
- font-size: 16px;
- }
- .file-details__info {
- color: grey;
- }
+ .file-details__name {
+ font-size: 16px;
}
- .file-details__preview {
- width: 320px;
- height: 270px;
- border-right: 1px solid #ddd;
- vertical-align: center;
+ .file-details__info {
+ color: grey;
+ }
+ }
+ .file-details__preview {
+ width: 320px;
+ height: 270px;
+ border-right: 1px solid #ddd;
+ vertical-align: center;
// helper to center the image icon in the preview window
.file-details__preview-helper {
- height: 100%;
- display: inline-block;
- vertical-align: middle;
+ height: 100%;
+ display: inline-block;
+ vertical-align: middle;
}
+ }
}
-}
diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss
index fb37c43eb..da648a170 100644
--- a/web/sass-files/sass/partials/_headers.scss
+++ b/web/sass-files/sass/partials/_headers.scss
@@ -110,6 +110,20 @@
}
}
}
+ &.theme--black {
+ &:hover {
+ &:before {
+ background: rgba(white, 0.2);
+ }
+ }
+ }
+ &.theme--gray {
+ &:hover {
+ &:before {
+ background: rgba(white, 0.1);
+ }
+ }
+ }
a {
color: #fff;
}
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index f359037c5..014f834ed 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -15,10 +15,13 @@
}
.remove__member {
float: right;
- color: #E56565;
+ color: #999;
font-size: 20px;
line-height: 0;
padding: 6px;
+ &:hover {
+ color: #E56565;
+ }
}
.modal-dialog {
max-width: 95%;
@@ -151,10 +154,9 @@
height: 100%;
margin: 0 auto;
.image-wrapper {
- background: #FFF;
position: relative;
max-width: 90%;
- min-height: 50px;
+ min-height: 100px;
min-width: 320px;
@include border-radius(3px);
display: table;
@@ -182,6 +184,7 @@
z-index: 9999;
}
> a {
+ background: #FFF;
display: table-cell;
vertical-align: middle;
}
diff --git a/web/sass-files/sass/partials/_navbar.scss b/web/sass-files/sass/partials/_navbar.scss
index 905907d84..2e78a8728 100644
--- a/web/sass-files/sass/partials/_navbar.scss
+++ b/web/sass-files/sass/partials/_navbar.scss
@@ -19,6 +19,7 @@
}
}
.navbar-toggle {
+ width: 43px;
float: left;
border-color: transparent;
border-radius: 0;
diff --git a/web/sass-files/sass/partials/_popover.scss b/web/sass-files/sass/partials/_popover.scss
index fa1b44841..5008331b4 100644
--- a/web/sass-files/sass/partials/_popover.scss
+++ b/web/sass-files/sass/partials/_popover.scss
@@ -6,4 +6,11 @@
.user-popover__image {
margin: 0 0 10px;
@include border-radius(128px);
+}
+
+.user-popover__email {
+ max-width: 200px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ display: block;
} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index e3f140413..47b2b6bd7 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -229,6 +229,16 @@
}
}
+@media screen and (max-height: 640px) {
+ .signup-team__container {
+ padding: 30px 0;
+ margin-bottom: 30px;
+ font-size: 0.9em;
+ .signup-team__name {
+ font-size: 2em;
+ }
+ }
+}
@media screen and (max-width: 768px) {
.date-separator, .new-separator {
&.hovered--after {
diff --git a/web/templates/channel.html b/web/templates/channel.html
index 6325069ee..da6fed97d 100644
--- a/web/templates/channel.html
+++ b/web/templates/channel.html
@@ -49,7 +49,9 @@
<div id="activity_log_modal"></div>
<div id="removed_from_channel_modal"></div>
<script>
-window.setup_channel_page('{{ .Props.TeamDisplayName }}', '{{ .Props.TeamType }}', '{{ .Props.TeamId }}', '{{ .Props.ChannelName }}', '{{ .Props.ChannelId }}');
+ window.setup_channel_page('{{ .Props.TeamDisplayName }}', '{{ .Props.TeamType }}', '{{ .Props.TeamId }}', '{{ .Props.ChannelName }}', '{{ .Props.ChannelId }}');
+ $('body').tooltip( {selector: '[data-toggle=tooltip]'} );
+ $('.modal-body').perfectScrollbar();
</script>
</body>
</html>