S
SolidJS•2y ago
jesseb34r

How does height of the body work in Solid Playground?

This may just be a lack of understanding of CSS but in my defense, CSS is hard. Here is the link to the component I'm prototyping in the playground: https://playground.solidjs.com/anonymous/962a237f-cfbd-4a77-bc7f-f2034bdbd5fa. What I'm wondering is why my Open Modal button is centered on the height of the window without considering the console whereas the actual modal is centered in the viewable space accounting for the console. The button is centered in a flexc container with a height of 100vh whereas the modal is centered with position: absolute, top: '50%', left: '50%', transform: 'translate(-50%, -50%)'. Is this a specific behavior of the solid playground or is this a CSS specific thing with heights that I don't understand?
Solid Playground
Quickly discover what the solid compiler will generate from your JSX template
2 Replies
Unknown User
Unknown User•2y ago
Message Not Public
Sign In & Join Server To View
jesseb34r
jesseb34r•2y ago
huh, so maybe I'm just misunderstanding how the viewport is being sized looks like in the playground the body height is being manually calculated to take the console into account interesting ty
Want results from more Discord servers?
Add your server
More Posts
Is solid-realworld example really real world?I'm trying to follow the pattern solid-realworld uses. But the state management is really confusing Theme management with SolidI would like to have a Dark and Light Mode on my page. For this I use Solid in combination with AstrWill we see solid-native?I really love Solid. I want to make iOS / Android / Desktop app using solid..How to clear solid-primitives's storage?I'm trying to use solid primitives's storage. How to clear localStorage ? I know can call window.locuseSearchParams not workingEven though there is ?hey=hey search param, the proxy object is emptystop and then restart makeIntersectionObserver on window height changeI'm switching from the Javascript intersectionObserver to solid's primitive for it because someone mAccess dynamic route params in components outside of the FileRouterIn this structure: ``` <Body class="h-full bg-slate-900 text-slate-300"> <ErrorBoundary> classList not working on icons svg```js import { IoCloseOutline } from 'solid-icons/io' <li class="text-dark flex items-center bordeuseParams not workinghey, I wanted to have my fetch functions for resources in separate file but when I use useParams insSolidStart - Can't use 'os' module.I just created solid-start project, Then I want to print 'os' homeDir in app. But I see this error.