Navigation

    UBports Robot Logo

    UBports Forum

    • Register
    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    CSS and Fonts for Web Apps

    App Development
    4
    12
    218
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • bryanegraham
      bryanegraham last edited by

      Hey there!

      So I'm in the process of making a bunch of table-top rpg tools all in javascript, and I'd like to bring them over to ubuntu touch. In doing so I'd prefer that they look and behave as close to native as possible.

      I'm wondering if anyone has any links to font, sizing or spacing guidelines that I've not been able to locate in the last few days of searching, or if there is any ready-made css for form sytling, fonts and the like out there.

      1 Reply Last reply Reply Quote 3
      • poVoq
        poVoq last edited by poVoq

        There is the old and abandoned HTML5 UI SDK:
        https://github.com/ubports/ubuntu-html5-theme

        https://docs.ubuntu.com/phone/en/apps/html-5/

        https://api-docs.ubports.com/sdk/apps/html5/index.html

        But IMHO it is not so native looking anymore with the grey-ish background gone and the suru icons improved:
        http://docs.ubports.com/projects/icons/en/latest/

        I personally have been playing with Bulma and the United bulmaswatch theme that at least uses typical Ubuntu colors;
        https://github.com/jenil/bulmaswatch/tree/gh-pages/united
        https://jenil.github.io/bulmaswatch/united/

        It's not really native looking and more geared towards websites, but at least is is lightweight and a modern CSS framework.

        Edit: That said, it would be great if the HTML5 SDK was properly updated and a first class app framework in UT again. However as you will quickly notice the build in qtwebengine embedded browser framework is severely outdated and has problems with GPU acceleration and Mir. So it is a long way (switch to Wayland backend and Ubuntu20.04 most likely) before it can be called that again.

        1 Reply Last reply Reply Quote 1
        • bryanegraham
          bryanegraham last edited by

          Awesome! This is exactly the kind of thing I was looking for, especially the united theme!

          Thanks so much!

          poVoq 2 Replies Last reply Reply Quote 0
          • poVoq
            poVoq @bryanegraham last edited by

            @bryanegraham would you be interested in collaborating on a "HTML5 SDK light" based on Bulma?

            1 Reply Last reply Reply Quote 0
            • poVoq
              poVoq @bryanegraham last edited by

              @bryanegraham Started working on it, but not usable yet. PRs welcome.
              https://github.com/poVoq/HTML5-appsdk-bulma

              bhdouglass bryanegraham 2 Replies Last reply Reply Quote 0
              • bhdouglass
                bhdouglass @poVoq last edited by

                As an alternative to the old sdk, there is the Vanilla framework by Canonical: https://vanillaframework.io/
                It's not 100% Ubuntu Touch, but fairly close. I've used it for my Recipe Boss app: https://open-store.io/app/recipe-boss.bhdouglass

                poVoq 1 Reply Last reply Reply Quote 1
                • poVoq
                  poVoq @bhdouglass last edited by poVoq

                  @bhdouglass hmm I wasn't aware of it 😞
                  Maybe not a bad choice...
                  Edit: It requires Vue?

                  bhdouglass 1 Reply Last reply Reply Quote 0
                  • bhdouglass
                    bhdouglass @poVoq last edited by

                    @poVoq No, vanilla framework is just css, Vue is just my preferred JS framework.

                    1 Reply Last reply Reply Quote 0
                    • Fla
                      Fla last edited by

                      I'm really interested about a Vanilla CSS framework which could be used to develop HTML5 apps with a native look'n'feel on UT. I would use it to improve Axolotl, the Signal client.

                      1 Reply Last reply Reply Quote 0
                      • poVoq
                        poVoq last edited by

                        Yeah, might work with Vanilla. But for me it looks way to complex compared to Bulma. I just want something super lightweight and simple to use for html wrappers like my conversejs xmpp client.

                        1 Reply Last reply Reply Quote 0
                        • bryanegraham
                          bryanegraham @poVoq last edited by

                          Sorry to abandon the thread. Other projects ate up all my spare time! 🙇🏼 I hope you all are doing well!

                          @poVoq said in CSS and Fonts for Web Apps:

                          @bryanegraham Started working on it, but not usable yet. PRs welcome.
                          https://github.com/poVoq/HTML5-appsdk-bulma

                          I am interested indeed. I've got a couple things I want to do first on the project I want to port, but I'll hit you up on github if I hit any snags getting set up.

                          @bhdouglass said in CSS and Fonts for Web Apps:

                          As an alternative to the old sdk, there is the Vanilla framework by Canonical: https://vanillaframework.io/
                          It's not 100% Ubuntu Touch, but fairly close. I've used it for my Recipe Boss app: https://open-store.io/app/recipe-boss.bhdouglass

                          Awesome I'll take a look at this! Your app is actually a pretty good template for what I'm trying to do, since I'm also using, and I think it has pretty good performance and fits the rest of the os design very well.

                          1 Reply Last reply Reply Quote 0
                          • bhdouglass
                            bhdouglass last edited by

                            @bryanegraham feel free to bug me with any questions, I'm happy to help!

                            1 Reply Last reply Reply Quote 0
                            • First post
                              Last post