aquaductape/solid-dismiss

Styles not getting applied

Closed this issue · 2 comments

spa5k commented

So, I added the modal here, and also a popup → https://salam-app-web-git-17-trailer-popup-button-salamlabs.vercel.app/

As you can see after clicking the buttons, it opens in the bottom of the page, so my question is, do we need to apply styling on our own? Or something is wrong with Astro/Vite/Library setup here.

Yes, the user needs to apply their own styling. I'll clarify in the docs that this library doesn't provide styling.

In far the future, I should replace all code examples with codesandbox or stackblitz, that way users can see the exact code or modify.

On some code examples, I provided relevant essential CSS code that relates to topic.

For example, on the Modal, I provided the essential CSS just to position the modal.

// relevant CSS ...

.modal-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 100;
}

.modal {
  position: relative;
  width: 80vw;
  max-width: 800px;
  padding: 25px;
}

Screen Shot 2022-09-19 at 9 55 21 AM