summaryrefslogtreecommitdiffstats
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/react/components/admin_console/analytics.jsx37
-rw-r--r--web/react/components/channel_header.jsx2
-rw-r--r--web/sass-files/sass/partials/_base.scss236
-rw-r--r--web/sass-files/sass/partials/_headers.scss7
-rw-r--r--web/sass-files/sass/partials/_post.scss8
-rw-r--r--web/sass-files/sass/partials/_responsive.scss12
-rw-r--r--web/sass-files/sass/partials/_search.scss5
7 files changed, 177 insertions, 130 deletions
diff --git a/web/react/components/admin_console/analytics.jsx b/web/react/components/admin_console/analytics.jsx
index 0a159d2e3..ec9ad4da0 100644
--- a/web/react/components/admin_console/analytics.jsx
+++ b/web/react/components/admin_console/analytics.jsx
@@ -1,7 +1,6 @@
// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
-import * as Utils from '../../utils/utils.jsx';
import Constants from '../../utils/constants.jsx';
import LineChart from './line_chart.jsx';
import DoughnutChart from './doughnut_chart.jsx';
@@ -10,7 +9,7 @@ import StatisticCount from './statistic_count.jsx';
var Tooltip = ReactBootstrap.Tooltip;
var OverlayTrigger = ReactBootstrap.OverlayTrigger;
-import {injectIntl, intlShape, defineMessages, FormattedMessage} from 'mm-intl';
+import {injectIntl, intlShape, defineMessages, FormattedMessage, FormattedDate} from 'mm-intl';
const holders = defineMessages({
analyticsTotalUsers: {
@@ -75,10 +74,12 @@ export default class Analytics extends React.Component {
}
let loading = (
- <FormattedMessage
- id='admin.analytics.loading'
- defaultMessage='Loading...'
- />
+ <h5>
+ <FormattedMessage
+ id='admin.analytics.loading'
+ defaultMessage='Loading...'
+ />
+ </h5>
);
let firstRow;
@@ -322,7 +323,17 @@ export default class Analytics extends React.Component {
</time>
</OverlayTrigger>
</td>
- <td>{Utils.displayDateTime(user.last_activity_at)}</td>
+ <td>
+ <FormattedDate
+ value={user.last_activity_at}
+ day='numeric'
+ month='long'
+ year='numeric'
+ hour12={true}
+ hour='2-digit'
+ minute='2-digit'
+ />
+ </td>
</tr>
);
})
@@ -378,7 +389,17 @@ export default class Analytics extends React.Component {
</time>
</OverlayTrigger>
</td>
- <td>{Utils.displayDateTime(user.create_at)}</td>
+ <td>
+ <FormattedDate
+ value={user.create_at}
+ day='numeric'
+ month='long'
+ year='numeric'
+ hour12={true}
+ hour='2-digit'
+ minute='2-digit'
+ />
+ </td>
</tr>
);
})
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index 005a82209..8fc3cd63d 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -419,7 +419,7 @@ export default class ChannelHeader extends React.Component {
</ul>
</div>
<OverlayTrigger
- trigger={['hover', 'focus']}
+ trigger={'click'}
placement='bottom'
overlay={popoverContent}
ref='headerOverlay'
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 04ba9c51e..a13689382 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -1,28 +1,28 @@
@charset "UTF-8";
html, body {
- height: 100%;
+ height: 100%;
}
body {
- font-family: 'Open Sans', sans-serif;
- -webkit-font-smoothing: antialiased;
- background: $body-bg;
- position: relative;
- width: 100%;
- height: 100%;
- &.white {
- background: #fff;
- > .container-fluid {
- overflow: auto;
- }
- .inner__wrap {
- > .row.content {
- min-height: 100%;
- margin-bottom: -89px;
- }
- }
- }
+ font-family: 'Open Sans', sans-serif;
+ -webkit-font-smoothing: antialiased;
+ background: $body-bg;
+ position: relative;
+ width: 100%;
+ height: 100%;
+ &.white {
+ background: #fff;
+ > .container-fluid {
+ overflow: auto;
+ }
+ .inner__wrap {
+ > .row.content {
+ min-height: 100%;
+ margin-bottom: -89px;
+ }
+ }
+ }
}
.inner__wrap {
@@ -46,175 +46,177 @@ body {
}
img {
- max-width: 100%;
- height: auto;
- &.rounded {
- @include border-radius(100%);
- }
+ max-width: 100%;
+ height: auto;
+ &.rounded {
+ @include border-radius(100%);
+ }
}
.popover {
- @include border-radius(3px);
- color: #333;
- &.bottom, &.right, &.top, &.left {
- >.arrow:after {
- border-color: transparent;
+ @include border-radius(3px);
+ color: #333;
+ &.bottom, &.right, &.top, &.left {
+ >.arrow:after {
+ border-color: transparent;
+ }
+ }
+ .popover-title {
+ background: rgba(black, 0.05);
+ }
+ .popover-content {
+ p:last-child {
+ margin-bottom: 5px;
+ }
}
- }
- .popover-title {
- background: rgba(black, 0.05);
- }
- .popover-content {
- white-space: pre-wrap;
- }
}
.dropdown-menu {
- .divider {
- @include opacity(0.15);
- }
- > li > a {
- color: inherit;
- &:focus, &:hover {
- color: inherit;
+ .divider {
+ @include opacity(0.15);
+ }
+ > li > a {
+ color: inherit;
+ &:focus, &:hover {
+ color: inherit;
+ }
}
- }
}
.word-break--all {
- word-break: break-all;
+ word-break: break-all;
}
a {
- word-break: break-word;
- color: $primary-color;
- cursor: pointer;
+ word-break: break-word;
+ color: $primary-color;
+ cursor: pointer;
}
a:focus, a:hover {
- color: $primary-color;
+ color: $primary-color;
}
.tooltip {
- .tooltip-inner {
- word-break: break-word;
- font-size: 13px;
- padding: 3px 10px 4px;
- font-weight: 500;
- }
+ .tooltip-inner {
+ word-break: break-word;
+ font-size: 13px;
+ padding: 3px 10px 4px;
+ font-weight: 500;
+ }
}
.nopadding {
- padding: 0;
- margin: 0;
+ padding: 0;
+ margin: 0;
}
.text-danger, a.text-danger {
- color: #E05F5D;
- &:hover, &:focus {
color: #E05F5D;
- }
+ &:hover, &:focus {
+ color: #E05F5D;
+ }
}
.btn {
- &.btn-danger {
- color: #fff;
- &:hover, &:active, &:focus {
- color: #fff;
+ &.btn-danger {
+ color: #fff;
+ &:hover, &:active, &:focus {
+ color: #fff;
+ }
}
- }
}
.form-control {
- @include border-radius(2px);
- &:focus {
- @include box-shadow(none);
- }
- &.no-padding {
- line-height: 32px;
- padding: 0;
- }
- &.no-resize {
- resize: none;
- }
+ @include border-radius(2px);
+ &:focus {
+ @include box-shadow(none);
+ }
+ &.no-padding {
+ line-height: 32px;
+ padding: 0;
+ }
+ &.no-resize {
+ resize: none;
+ }
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
- cursor: auto;
- background: rgba(#fff, 0.1);
- color: inherit;
+ cursor: auto;
+ background: rgba(#fff, 0.1);
+ color: inherit;
}
.form-group {
- &.form-group--small {
- margin-bottom: 10px;
- }
+ &.form-group--small {
+ margin-bottom: 10px;
+ }
}
.error-panel {
- max-width: 275px;
- position: absolute;
- right: 10px;
- top: 40px;
- z-index: 100;
+ max-width: 275px;
+ position: absolute;
+ right: 10px;
+ top: 40px;
+ z-index: 100;
}
.nav>li>a:focus, .nav>li>a:hover {
- background: transparent;
+ background: transparent;
}
.btn {
- @include single-transition(all, 0.25s, ease-in);
- @include border-radius(1px);
- &.btn-primary {
- border-color: transparent;
- background: $primary-color;
- &:hover, &:focus, &:active {
- background: $primary-color--hover;
- }
- }
- &.btn-inactive {
- border-color: transparent;
- background: #707070;
- color: #fff;
- }
+ @include single-transition(all, 0.25s, ease-in);
+ @include border-radius(1px);
+ &.btn-primary {
+ border-color: transparent;
+ background: $primary-color;
+ &:hover, &:focus, &:active {
+ background: $primary-color--hover;
+ }
+ }
+ &.btn-inactive {
+ border-color: transparent;
+ background: #707070;
+ color: #fff;
+ }
}
.relative-div {
- position:relative;
+ position:relative;
}
@-webkit-keyframes spin2 {
- from { -webkit-transform: rotate(0deg);}
- to { -webkit-transform: rotate(360deg);}
+ from { -webkit-transform: rotate(0deg);}
+ to { -webkit-transform: rotate(360deg);}
}
@keyframes spin {
- from { transform: scale(1) rotate(0deg);}
- to { transform: scale(1) rotate(360deg);}
+ from { transform: scale(1) rotate(0deg);}
+ to { transform: scale(1) rotate(360deg);}
}
.glyphicon-refresh-animate {
- @include animation(spin .7s infinite linear);
+ @include animation(spin .7s infinite linear);
}
.black-bg {
- background-color: black !important;
+ background-color: black !important;
}
.white-bg {
- background-color: white !important;
+ background-color: white !important;
}
.alert {
- padding: 8px 12px;
- @include border-radius(2px);
+ padding: 8px 12px;
+ @include border-radius(2px);
}
.emoji {
- width: 1.5em;
- height: 1.5em;
- display: inline-block;
- margin-bottom: 0.25em;
- background-size: contain;
+ width: 1.5em;
+ height: 1.5em;
+ display: inline-block;
+ margin-bottom: 0.25em;
+ background-size: contain;
}
diff --git a/web/sass-files/sass/partials/_headers.scss b/web/sass-files/sass/partials/_headers.scss
index 4a4de5c3b..93cb04198 100644
--- a/web/sass-files/sass/partials/_headers.scss
+++ b/web/sass-files/sass/partials/_headers.scss
@@ -298,8 +298,13 @@
height: 30px;
width: 24px;
line-height: 26px;
- margin-right: 10px;
+ margin-right: 9px;
font-size: 22px;
+ .channel__wrap.move--left & {
+ position: absolute;
+ right: -400px;
+ top: 14px;
+ }
> a {
color: inherit;
text-decoration: none;
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 77b66a1a8..b0fbf00aa 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -283,8 +283,8 @@ body.ios {
width: 40px;
height: 40px;
position: absolute;
- bottom: 50px;
- right: 5px;
+ bottom: 0;
+ left: 10px;
z-index: 50;
@include opacity(0);
@include single-transition(all, 0.3s);
@@ -663,6 +663,10 @@ body.ios {
margin: 0 0 0.4em;
}
+ p + p {
+ margin-top: 1.4em;
+ }
+
img {
max-height: 400px;
}
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 832481cc5..09d498a69 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -60,6 +60,11 @@
&.move--left {
@include translateX(0);
+
+ .search-bar__container {
+ padding-right: 8px;
+ }
+
}
}
@@ -68,6 +73,13 @@
&.move--left {
margin-right: 0;
+
+ .channel-header__links {
+ position: relative;
+ right: auto;
+ top: auto;
+ }
+
}
}
diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss
index 693c59a31..aa398e916 100644
--- a/web/sass-files/sass/partials/_search.scss
+++ b/web/sass-files/sass/partials/_search.scss
@@ -1,11 +1,14 @@
@charset "UTF-8";
#channel-header .search-bar__container {
- padding: 0 8px 0 3px;
+ padding: 0 9px 0 3px;
}
.search-bar__container {
padding: 12px 8px 0 0;
@include flex(0 0 56px);
+ .sidebar--right.move--left & {
+ padding-right: 42px;
+ }
}
.search__clear {
display: none;
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-06-29 01:13:22 +0000