<@U02AB5P2XU6> Hi, on your blog on Android, the bo...
# kobweb
u
@David Herman Hi, on your blog on Android, the bottom bar of Chrome is not in dark Mode, any idea to fix this ? Maybe open on issue on Github ?
d
Thanks for the report. Are you talking about the scrollbar? Because that's not something I have control of I think?
I appreciate the comparison with GitHub though
I'll open a bug to investigate
s
Also happens on my kobweb sites, haven't looked into it yet. but no, that's not the scrollbar, it's the home "button"/gesture thing
Thank you @אליהו הדס I had no idea
Opened https://github.com/varabyte/kobweb/issues/627. I will take a stab at this tomorrow morning I think, if it is as trivial as I'm hoping.
u
@David Herman Wow Thanks a lot :)
c
wow, TIL
c
In an Android app, that bar would be called the navigation bar. There are several APIs that deal with it. For example if you set your app for edge-to-edge you could still offset your buttons to not overlap with that bar using suitable inset modifiers or padding modifiers. All of those have the name
navigationBar
in them. Also, you could use some system UI APIs to set the color for the navigation bar and those APIs also use the name
navigationBar
in them.
d
Just an update, does not seem as trivial as I hoped. You can visit https://bitspittle.dev -- I am now setting the
theme-color
but my Android phone is not respecting it.
Investigating. Clearly the github folks are doing it so there should be a way.
u
Perfect, it's work !
@David Herman maybe you have to clean the cache
d
I'm playing with stuff but sadly I think it's still broken
Try changing the color mode to light and I think you'll see it's broken in that case
It's been very frustrating to test this change because as far as I can tell, Chrome for Android doesn't have a way to force refresh, and inspecting is tricky. I actually installed Android Studio just so I could start running a virtual device and inspect the DOM.
u
1000011097.jpg
d
Looks like I got something that worked. I declared the current color scheme as "light" or "dark" and then defined two theme colors: one which applies in light mode, and one which applies in dark.
I'll share the code a bit later. You can paste it in your own site for now but I'll add it into the next version of Kobweb if you just want to wait.
u
the problem is that on your blog the theme does not sync with the device mode
d
Latest seems to be working
(screen record on Android hides the navigation buttons but you can see the bottom bar changing color now)
u
that's what i'm saying, you have to change the mode of the device first
d
Ah, you're saying I should default to the device color mode if possible?
u
Before, no matter the device mode, the navigation bar was in light mode, now it is synchronized but the site not necessarily
The Site is displayed in Dark Mode by default
d
Yes I set that up manually
I should possibly add a new option, use system default
👍 1
u
Most sites don't have buttons to change the mode, it seems to me.
They only sync with the device mode
Anyway, thanks a lot, I love kobweb!
❤️ 1
d
OK @אליהו הדס, you'll need to clear the local storage for the page (I save the user's last selected color mode after you visit the page for the first time), but at this point, my blog site should respect your device's color mode preference the first time you visit it.
kodee happy 1
u
@David Herman Thanks a lot, it's work great !
d
Awesome! Thanks for putting this issue on my radar.
If you are in a place where you can use
kobweb=0.20.1-SNAPSHOT
in your
libs.versions.toml
, that will start automatically setting the theme for you.
And it also exposes a new
ColorMode.systemPreference
property which you can use for the initial color mode.
Bringing it all together, the change to my blog site looks like this: https://github.com/bitspittle/bitspittle.dev/commit/740aeaacb7a0ec783df15faf4a031ba190d978b5
👍 1
u
Thanks a lot! When will there be a kobpress for blogging? 😅
d
Hahaha, I'll get right on that! ... After finishing the docs site, getting CSS API coverage to 100%, adding all remaining planned Silk widgets, figuring out how to split Kobweb sites up into smaller pieces, adding tons of functionality to the Kobweb IntelliJ Plug-in, and fixing all bugs with the 1.0 Milestone label....... Uh, don't wait up for me 😅 But seriously, I would be proud of a day when Kobweb ends up being a layer under other technology, that would be wild.
K 1
u
I think kobweb is the web framework with the most potential, and is what compose html should be. I have high hopes that one day it will have its moment of hype and that many technologies will use it
1
d
Thank you for your kind words! I'm actually ok if Kobweb's growth remains slow and steady, without any rocket ship, because I'm not in this thing for money or anything like that. If too many people start piling on all at the same time, I don't know if I'm ready to manage that and continued development! I'm also really excited about Kilua. The developer behind that is doing some really clever stuff, and they have a ton of experience in the Kotlin web dev space. Check out https://github.com/rjaros/kilua sometime if you haven't already.
u
I think we just have to do like Linus Torvalds, solve today's problems and see where it takes us 🙂 . As for Kilua, I had already seen it, I didn't look into it in depth but I have the impression of moving away a bit from Jetpack Compose and that it requires being very close to HTML, where Kobweb makes every effort to get closer to Compose.
👍 1
d
Agreed about the approach -- just tackle what's right in front of you. I'm just trying to solve problems and get to 1.0! I haven't really thought about anything more than that. Even with Kobweb I end up writing a lot of HTML / CSS logic but yes, I'm hoping especially once I have a ton of Silk widgets, it will feel less "sharp" than working with raw HTML. Time will tell I guess! I'm glad Robert is working on his approach so both will be available. I'm also glad he's providing an SSR solution because I gave up even trying to think about that two years ago, that was too many balls for me to juggle!
🚀 1
s
@אליהו הדס which features would you want from a kobpress? kobweb already has some good blogging capabilities I think. one of the best parts about frameworks like kobweb in general, is that in the end it's "just html and css" rather than a black box with half of Hogwarts inside. so it's very extensible, meaning you can make it fit for about any requirements and usecases. for example you can easily implement your own ssr for seo indexing purposes, use something like asciidoc or markdown renderers to create your own medium, and you have the whole world of js libs available so you could add some ready to use comment boxes
1
u
@S. In fact, I thought it would have been nice to design a desktop app that would act as a panel, that is to say that would allow you to easily manage your posts, categories, authors, etc. a bit like wordpress does. It would also have been nice if it generated a static json api as well as an rss. And also nice if there were already predefined themes that could be edited
s
oh I totally missed the wordpress reference 😂. That's quite a lot of work then
😬 1
I thought you meant something more like https://medium.com
u
Yes, that's the idea. I just kept in mind that WordPress was originally for blogs. 😅
s
fair enough. posts management would just be database CRUD, rss api should be fairly simple as well, themes in terms of colours too but if you want to have a drag&drop editor to freely move sections around then that's a monumental task. kobweb sites still need to be compiled whereas wordpress is inherently SSR
u
No no I don't want elementor with kobweb 🤢
It's mainly to manage your posts.
Currently, it's just markdowns, it's a bit tedious to make categories, subcategories, tags, you have to rewrite everything each time,
I also think that it is not that complicated, especially since the Jewel demo integrates a very nice markdown editor
s
ah that's a relief, and sounds a lot more doable. (also markdown is a good format for the new standard way of writing blog posts - chatgpt)
u
It might even be possible to link it to gpt type APIs to help us write the article
This is more or less the idea, with a push button to push the modifications, and the site is built automatically via github actions
Even for the documentations it would be very nice, I find that all the current solutions are a bit archaic
Oh yes and facilitate internationalization
s
the most difficult part would be writing the UI for such a text editor. I have an app where I let users write pure asciidoc, which isn't pretty but has a jvm and js renderer, so users can freely write and edit their notes since rebuilding the site each time isn't feasible. https://app.fluen.se/notes/96202/在...呢
u
run the Jewel demo, they already have a very nice editor
s
yeah the editor is cool but not for compose html
u
Why do it with compose html? Just make a desktop app that acts as a panel, you can do it with compose for desktop
s
in my case markdown didn't do the job but yes, there are already many editors available.
because shipping desktop apps isn't so trivial
u
I love desktop apps personally 🙂
s
also my comment was based on that I already looked at this library for my project where I needed something for compose html
yeah, but not shipping them 😅
also, do you mean anything specific about internationalization? basic localisation is very much doable, like here for example https://fluen.se/en/ or https://fluen.se/zh/
u
What I mean is that the panel itself handles the markdown in each language, like you have the list of your posts and inside each post, you can write your post in the language you want. It's just to simplify the process and avoid mistakes, and especially keep a clear structure if there are a lot of posts
👍🏻 1
d
FYI @אליהו הדס after talking to another Kobweb dev today, we decided to make setting the theme color opt-in and not automatic. It doesn't seem like we should assume that most sites want to set it. However, I'll consider adding it into all the templates, and I'll definitely update the Kobweb README. Anyway, the updated commit now looks like this: https://github.com/bitspittle/bitspittle.dev/commit/9d3fbcb4629f7a57f8650843ab953fe9d4ef3eb7 The only change from before is now you have to manually call
MetaThemeColor()
yourself.
It's come to my attention that actually theme-color is actually not what we want to be setting here. That controls the look and feel of the browser itself, not the gesture bar underneath it. So.... work still in progress 🙂
OK confirmed. Do not use
MetaThemeColor()
, it will go away shortly.