Hidden/visible box transition on button click

Community feedback

• 

  cheg•380

  @chegxPosted almost 2 years ago

  Hi JOÃO. You can change the top property to bottom:

  .card-share {
    align-items: center;
    background-color: hsl(217, 19%, 35%);
    border-bottom-left-radius: 0.75rem;
    border-bottom-right-radius: 0.75rem;
    display: flex;
    gap: clamp(1rem, -1.737rem + 11.68vw, 2rem);
    height: 4rem;
    max-height: 0;
    /* overflow: hidden; */
    visibility: hidden;
    padding-inline: 2rem;
    position: absolute;
    bottom: 0;
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    width: 100%;
  }
  

  The same for Desktop Layout. Remove top property and calculate position from the bottom.

  Marked as helpful

  0

  ---

  

  João Oliveira•370

  @jvmdoPosted almost 2 years ago

  @chegx whooa thank you. That's quite obvious even tho I couldn't figure it out at the time I was coding 😅

  0