summaryrefslogtreecommitdiffstats
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/react/components/file_upload_overlay.jsx28
-rw-r--r--web/react/utils/constants.jsx12
-rw-r--r--web/react/utils/utils.jsx8
-rw-r--r--web/sass-files/sass/partials/_post.scss15
-rw-r--r--web/sass-files/sass/partials/_responsive.scss21
-rw-r--r--web/sass-files/sass/partials/_settings.scss16
-rw-r--r--web/sass-files/sass/partials/_sidebar--left.scss15
7 files changed, 87 insertions, 28 deletions
diff --git a/web/react/components/file_upload_overlay.jsx b/web/react/components/file_upload_overlay.jsx
index d991dd625..dbba00022 100644
--- a/web/react/components/file_upload_overlay.jsx
+++ b/web/react/components/file_upload_overlay.jsx
@@ -12,19 +12,21 @@ export default class FileUploadOverlay extends React.Component {
return (
<div className={overlayClass}>
- <div className='overlay__circle'>
- <img
- className='overlay__files'
- src='/static/images/filesOverlay.png'
- alt='Files'
- />
- <span><i className='fa fa-upload'></i>{'Drop a file to upload it.'}</span>
- <img
- className='overlay__logo'
- src='/static/images/logoWhite.png'
- width='100'
- alt='Logo'
- />
+ <div className='overlay__indent'>
+ <div className='overlay__circle'>
+ <img
+ className='overlay__files'
+ src='/static/images/filesOverlay.png'
+ alt='Files'
+ />
+ <span><i className='fa fa-upload'></i>{'Drop a file to upload it.'}</span>
+ <img
+ className='overlay__logo'
+ src='/static/images/logoWhite.png'
+ width='100'
+ alt='Logo'
+ />
+ </div>
</div>
</div>
);
diff --git a/web/react/utils/constants.jsx b/web/react/utils/constants.jsx
index 1d856e067..e13f8228e 100644
--- a/web/react/utils/constants.jsx
+++ b/web/react/utils/constants.jsx
@@ -140,7 +140,7 @@ module.exports = {
sidebarText: '#333333',
sidebarUnreadText: '#333333',
sidebarTextHoverBg: '#e6f2fa',
- sidebarTextActiveBg: '#e1e1e1',
+ sidebarTextActiveBorder: '#378FD2',
sidebarTextActiveColor: '#111111',
sidebarHeaderBg: '#2389d7',
sidebarHeaderTextColor: '#ffffff',
@@ -162,7 +162,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#136197',
- sidebarTextActiveBg: '#136197',
+ sidebarTextActiveBorder: '#7AB0D6',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#2f81b7',
sidebarHeaderTextColor: '#FFFFFF',
@@ -184,7 +184,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#4A5664',
- sidebarTextActiveBg: '#39769C',
+ sidebarTextActiveBorder: '#39769C',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#1B2C3E',
sidebarHeaderTextColor: '#FFFFFF',
@@ -206,7 +206,7 @@ module.exports = {
sidebarText: '#fff',
sidebarUnreadText: '#fff',
sidebarTextHoverBg: '#302e30',
- sidebarTextActiveBg: '#484748',
+ sidebarTextActiveBorder: '#196CAF',
sidebarTextActiveColor: '#FFFFFF',
sidebarHeaderBg: '#1f1f1f',
sidebarHeaderTextColor: '#FFFFFF',
@@ -249,8 +249,8 @@ module.exports = {
uiName: 'Sidebar Text Hover BG'
},
{
- id: 'sidebarTextActiveBg',
- uiName: 'Sidebar Text Active BG'
+ id: 'sidebarTextActiveBorder',
+ uiName: 'Sidebar Text Active Border'
},
{
id: 'sidebarTextActiveColor',
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index b9084b26e..8264e6bb6 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -425,18 +425,14 @@ export function applyTheme(theme) {
changeCss('@media(max-width: 768px){.settings-modal .settings-table .nav>li:hover a', 'background:' + theme.sidebarTextHoverBg, 1);
}
- if (theme.sidebarTextActiveBg) {
- changeCss('.sidebar--left .nav-pills__container li.active a, .sidebar--left .nav-pills__container li.active a:hover, .sidebar--left .nav-pills__container li.active a:focus, .settings-modal .nav-pills>li.active a, .settings-modal .nav-pills>li.active a:hover, .settings-modal .nav-pills>li.active a:active', 'background:' + theme.sidebarTextActiveBg, 1);
+ if (theme.sidebarTextActiveBorder) {
+ changeCss('.sidebar--left .nav li.active a:before, .settings-modal .nav-pills>li.active a:before', 'background:' + theme.sidebarTextActiveBorder, 1);
}
if (theme.sidebarTextActiveColor) {
changeCss('.sidebar--left .nav-pills__container li.active a, .sidebar--left .nav-pills__container li.active a:hover, .sidebar--left .nav-pills__container li.active a:focus, .settings-modal .nav-pills>li.active a, .settings-modal .nav-pills>li.active a:hover, .settings-modal .nav-pills>li.active a:active', 'color:' + theme.sidebarTextActiveColor, 2);
}
- if (theme.sidebarTextActiveBg === theme.onlineIndicator) {
- changeCss('.sidebar--left .nav-pills__container li.active a .status .online--icon', 'fill:' + theme.sidebarTextActiveColor, 1);
- }
-
if (theme.sidebarHeaderBg) {
changeCss('.sidebar--left .team__header, .sidebar--menu .team__header', 'background:' + theme.sidebarHeaderBg, 1);
changeCss('.modal .modal-header', 'background:' + theme.sidebarHeaderBg, 1);
diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss
index 6ecc0d965..db58d0347 100644
--- a/web/sass-files/sass/partials/_post.scss
+++ b/web/sass-files/sass/partials/_post.scss
@@ -54,6 +54,7 @@ body.ios {
height: 2em;
margin: 0;
position: relative;
+ z-index: 0;
&:before, &:after {
content: "";
height: 1em;
@@ -116,13 +117,25 @@ body.ios {
left: 0;
width: 100%;
height: 100%;
- background-color: rgba(0, 0, 0, 0.6);
text-align: center;
color: #FFF;
font-size: em(20px);
font-weight: 600;
z-index: 6;
+ .overlay__indent {
+ background-color: rgba(0, 0, 0, 0.6);
+ position: relative;
+ height: 100%;
+ @include clearfix;
+ }
+
+ &.center-file-overlay {
+ .overlay__indent {
+ margin-left: 220px;
+ }
+ }
+
&.right-file-overlay {
font-size: em(18px);
.overlay__circle {
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index c8bb24f3a..f4e57eec5 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -179,6 +179,22 @@
}
@media screen and (max-width: 1140px) {
+ .inner__wrap {
+ &.move--left {
+ .file-overlay {
+ font-size: em(18px);
+ .overlay__circle {
+ width: 300px;
+ height: 300px;
+ margin: -150px 0 0 -150px;
+ }
+ .overlay__files {
+ margin: 60px auto 15px;
+ width: 150px;
+ }
+ }
+ }
+ }
.post {
.post__content {
width: 100%;
@@ -277,6 +293,11 @@
}
.file-overlay {
font-size: em(18px);
+ &.center-file-overlay {
+ .overlay__indent {
+ margin-left: 0;
+ }
+ }
.overlay__circle {
width: 300px;
height: 300px;
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index bc53dc0e4..9af045f98 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -211,6 +211,22 @@
a {
color: #111;
background-color: #E1E1E1;
+ &:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 5px;
+ height: 100%;
+ background: #000;
+ }
+ }
+ a, a:hover, a:focus {
+ padding-right: 10px;
+ background-color: rgba(black, 0.1);
+ border-radius: 0;
+ font-weight: 400;
+ position: relative;
}
}
}
diff --git a/web/sass-files/sass/partials/_sidebar--left.scss b/web/sass-files/sass/partials/_sidebar--left.scss
index 585a51f08..ab13d1b42 100644
--- a/web/sass-files/sass/partials/_sidebar--left.scss
+++ b/web/sass-files/sass/partials/_sidebar--left.scss
@@ -128,12 +128,23 @@
}
}
&.active {
+ a {
+ &:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 5px;
+ height: 100%;
+ background: #000;
+ }
+ }
a, a:hover, a:focus {
- color: #111;
padding-right: 10px;
- background-color: #e1e1e1;
+ background-color: rgba(black, 0.1);
border-radius: 0;
font-weight: 400;
+ position: relative;
}
}
}
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-07-02 10:05:23 +0000