RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-10 02:54:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

mix opacity with actions bar when hover the card

Browse Source
This commit is contained in:
srgooglo 2022-03-02 21:05:53 +01:00
parent 85f24c973b
commit 5a83e2c11c
1 changed files with 19 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/app/src/components/PostCard/index.less
View File

@ -21,19 +21,6 @@
outline-color: var(--primaryColor); outline-color: var(--primaryColor);
} }
.actionsIndicator {
display : flex;
flex-direction : row;
align-items : center;
justify-content: center;
width : 100%;
margin-bottom: 5px;
font-size: 18px;
color : var(--background-color-contrast);
}
.wrapper { .wrapper {
display : inline-flex; display : inline-flex;
flex-direction: column; flex-direction: column;
@ -128,6 +115,21 @@
} }
} }
.actionsIndicator {
display : flex;
flex-direction : row;
align-items : center;
justify-content: center;
width : 100%;
margin-bottom: 5px;
font-size: 18px;
color : var(--background-color-contrast);
transition : all 0.2s ease-in-out;
}
.actionsWrapper { .actionsWrapper {
display : flex; display : flex;
flex-direction : row; flex-direction : row;
@ -232,6 +234,10 @@
.actionsWrapper { .actionsWrapper {
animation: fadeActionsIn 0.2s 0.2s linear forwards; animation: fadeActionsIn 0.2s 0.2s linear forwards;
} }
.actionsIndicator {
opacity: 0;
}
} }
@keyframes fadeActionsIn { @keyframes fadeActionsIn {