florian.richer/portfolio_leptos
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix transition: Timeline

Browse source
This commit is contained in:
Florian RICHER 2023-06-04 16:28:00 +02:00
parent eb87c0d61d
commit fbf044829a
2 changed files with 7 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/components/timeline/Timeline.tsx
View file

@ -9,7 +9,7 @@ function Timeline({ children } : TimelapseProps) {
return ( return (
<div className='timeline'> <div className='timeline'>
<ul className='timeline'> <ul>
{ children } { children }
</ul> </ul>
</div> </div>

7
src/components/timeline/TimelineElement.scss
View file

@ -33,8 +33,12 @@
} }
& > summary { & > summary {
@apply block select-none cursor-pointer outline-none mb-0 font-semibold; @apply block select-none cursor-pointer outline-none p-5 font-semibold;
// BEGIN TRANSITION
@apply mb-0;
transition: all 600ms cubic-bezier(0.2, 1, 0.3, 1); transition: all 600ms cubic-bezier(0.2, 1, 0.3, 1);
// END TRANSITION
&:hover { &:hover {
@apply bg-[#f8f8f8]; @apply bg-[#f8f8f8];
@ -43,6 +47,7 @@
&[open] { &[open] {
& > summary { & > summary {
@apply mb-5; // TRANSITION
border-bottom: 1px solid rgba(0, 0, 0, 0.1); border-bottom: 1px solid rgba(0, 0, 0, 0.1);
} }
} }