GithubHelp home page GithubHelp logo

Improving the website about windowjs HOT 3 CLOSED

windowjs avatar windowjs commented on May 1, 2024
Improving the website

from windowjs.

Comments (3)

joaodasilva avatar joaodasilva commented on May 1, 2024

Thanks for looking into this. I'd suggest starting with something small, to make sure that it's going in the right direction.

I've written some thoughts here:

#22
#33

I think that fixing the site on mobile is a good first step. You should start by reproducing the issue:

  • install Jekyll
  • serve the pages via jekyll serve; see the docs here: https://windowjs.org/dev/documentation
  • now you should be able to edit the docs and live reload on your browser
  • use the Chrome Devtools to simulate a mobile device, and notice that the API docs pages don't look good at all. For example, the Canvas API page is larger than my phone and the text overflows to the sides.

Ideally, the fix for this is not very intrusive and just tweaks the CSS style and maybe the HEAD element:

https://github.com/windowjs/windowjs/blob/main/docs/style.css
https://github.com/windowjs/windowjs/blob/main/docs/_includes/head.html

(for example, I think the problem might be a missing viewport for mobile devices)

As for the CSS, it was mostly built for the desktop pages and then a media query was added at the bottom to make things somewhat better on mobile:

@media screen and (max-width: 1200px) {

Hope this helps getting started.

from windowjs.

ashusharmasigdev avatar ashusharmasigdev commented on May 1, 2024

Hello, I know, It's much late, but i am currently busy on my os projects. I am written a layout, you can view it here WinJS-Test, This is currently static, if you like it, so i replace the docs layouts with this in repo. This needs some more responsiveness in font sizes & margins b/w contents, that will made, if you liked it, it is just demo to show you the theme layout of site, currently i used an another logo, because currently winjs have none, so this logo is just temporary and if you want to change colors, theirs very easy way, only a value of --primary-color: value_in_rgb to change in css/vars.css.

from windowjs.

joaodasilva avatar joaodasilva commented on May 1, 2024

Thanks for the ideas! The website has been improved in issue #33 with PR #73, so for the time being I think it's working well.

I'm now looking to integrate Sven's contributions from this discussion:

#24 (comment)

from windowjs.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.