wieerwill/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2025-06-04 23:04:47 +00:00
Code Issues Actions 2 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-off-color: #77818E;
--theme-bg-check: #F2F2F2; --theme-bg-check: #F2F2F2;
--theme-tooltip-color: #2C2C34; --theme-tooltip-color: #2C2C34;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #1F1F25; --theme-button-bg-enabled: #1F1F25;
--theme-button-bg-hovered: #26262B; --theme-button-bg-hovered: #26262B;
@ -171,6 +172,7 @@
--theme-off-color: #77818E; --theme-off-color: #77818E;
--theme-bg-check: #F2F2F2; --theme-bg-check: #F2F2F2;
--theme-tooltip-color: #4D4C58; --theme-tooltip-color: #4D4C58;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #3F3E4A; --theme-button-bg-enabled: #3F3E4A;
--theme-button-bg-hovered: #45444F; --theme-button-bg-hovered: #45444F;
@ -245,6 +247,7 @@
--theme-off-color: #ECEEF5; --theme-off-color: #ECEEF5;
--theme-bg-check: #45444F; --theme-bg-check: #45444F;
--theme-tooltip-color: #F1F1F4; --theme-tooltip-color: #F1F1F4;
--theme-showmore-color: #484850;
--theme-button-bg-enabled: #F7F7F7; --theme-button-bg-enabled: #F7F7F7;
--theme-button-bg-hovered: #F2F2F2; --theme-button-bg-hovered: #F2F2F2;

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

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