hcengineering/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2024-12-23 19:44:59 +03:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Fix background ShowMore (#464)

Browse Source 
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2021-12-01 16:35:15 +03:00 committed by GitHub
parent 047815fc04
commit 535bbee930
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
packages/theme/styles/_colors.scss
View File

@ -96,6 +96,7 @@
--theme-off-color: #77818E;
--theme-bg-check: #F2F2F2;
--theme-tooltip-color: #2C2C34;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #1F1F25;
--theme-button-bg-hovered: #26262B;
@ -171,6 +172,7 @@
--theme-off-color: #77818E;
--theme-bg-check: #F2F2F2;
--theme-tooltip-color: #4D4C58;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #3F3E4A;
--theme-button-bg-hovered: #45444F;
@ -245,6 +247,7 @@
--theme-off-color: #ECEEF5;
--theme-bg-check: #45444F;
--theme-tooltip-color: #F1F1F4;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #F7F7F7;
--theme-button-bg-hovered: #F2F2F2;

27
plugins/activity-resources/src/components/ShowMore.svelte
View File

@ -58,47 +58,38 @@
.showMore {
position: absolute;
left: 0;
right: 0;
left: 50%;
bottom: 0;
margin: 0 auto;
padding: .5rem 1rem;
width: max-content;
font-weight: 500;
font-size: .75rem;
color: var(--theme-caption-color);
background: var(--theme-card-bg);
background: var(--theme-showmore-color);
border: .5px solid var(--theme-card-divider);
box-shadow: 0px 8px 15px rgba(0, 0, 0, .1);
backdrop-filter: blur(120px);
border-radius: 2.5rem;
user-select: none;
cursor: pointer;
opacity: .9;
transform: scale(.97);
opacity: 1;
transform: translateX(-50%) scale(.97);
transition: opacity .1s ease-in-out, transform .1s ease-in-out;
&:hover {
opacity: 1;
transform: scale(1);
}
&:active {
opacity: .95;
transform: scale(.99);
}
&:hover { transform: translateX(-50%) scale(1); }
&:active { transform: translateX(-50%) scale(.99); }
&.outter {
bottom: -1.85rem;
opacity: .7;
transform: scale(.80);
transform: translateX(-50%) scale(.80);
&:hover {
opacity: 1;
transform: scale(.83);
transform: translateX(-50%) scale(.83);
}
&:active {
opacity: .95;
transform: scale(.82);
transform: translateX(-50%) scale(.82);
}
}
}