feat(native): Improved layout in elk-native

[piotrski]

• Two new variants have been added to UnoCSS: native: and native-mac:. Styles for these variants will only be generated if the TAURI_PLATFORM variable is properly set during the build process.
• The application now respects the user's system preferences for the style and behavior of the style bar on the Mac
• The title bar is always visible in the app, which should fix a problem when the window was not draggable on larger screens. macOS window dragging unavailable in wider viewports elk-native#43
• This is not the final iteration, in the future, I plan to move the navigation in narrow windows to the left side.

Here are before and after screenshots:

650px:


1000px:


1200px:


1400px:

closes elk-zone/elk-native#44

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[netlify]

✅ Deploy Preview for elk-docs canceled.

Name	Link
🔨 Latest commit	369fd6e
🔍 Latest deploy log	https://app.netlify.com/sites/elk-docs/deploys/63cbc2b19ac76b0008d66901

[netlify]

✅ Deploy Preview for elk-zone ready!

Name	Link
🔨 Latest commit	369fd6e
🔍 Latest deploy log	https://app.netlify.com/sites/elk-zone/deploys/63cbc2b14fb0b50009a71c59
😎 Deploy Preview	https://deploy-preview-1359--elk-zone.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[patak-dev]

This is awesome, thanks @piotrski! @JonasKruckenberg could you review this one too?

[JonasKruckenberg]

I checked on macOS and this looks great 👍🏻 much better than before. I also like that we now have a strategy for adding more platform specific styles later on, like a custom titlebar on Windows and Linux.

[JonasKruckenberg]

Should we just do a new elk-native release with these fixes or do you want to cut a new elk release soon anyway?

[patak-dev]

I think we should do a release soon to have the translation preference

[JonasKruckenberg]

I think we should do a release soon to have the translation preference

Okay! Then just ping me once you release and we can coordinate a release like last time 👍🏻

[patak-dev]

Im now thinking we should do it Monday, better to avoid changing elk.zone during the weekend now that we have so many users. Feel free to release native before

[JonasKruckenberg]

What did you think @piotrski? I guess this change is a rather big one and I would appreciate getting the release out asap, but maybe waiting for the proper release would be better (stability and fixes that might come in before monday?)

[patak-dev]

@piotrski I think this PR affected the styles on Web, see the size of the right sidebar here and the extra padding between the left sidebar and the timeline. Would you review what happened here?

[patak-dev]

@piotrski @JonasKruckenberg I pushed 2a836ed that reverts some of the changes to the default layout. I don't know how this affects the native styles, please follow up with a PR that keeps the current style in the web if you would like changes for the native wrapper.