ASKnetCommunity / Training

This is the training plan to organize your own training.
https://training.asknet.community
GNU General Public License v3.0
5 stars 10 forks source link

Implementing a CSS Library and summarize all distributed CSS snippets #112

Closed bmen closed 1 year ago

bmen commented 1 year ago

Now that some pages are added besides the index page: Module Overview, Module Single View, etc. I would suggest to use Bootstrap. With a library you can build good looking and smartphone compatible websites faster.

We don't have to use the framework for the configurator (yet), but for the other pages. The disadvantage is of course that the website becomes a bit heavier.

What do you think @saisilinus and @timmwille ?

saisilinus commented 1 year ago

I love the idea. However, I prefer Tailwind CSS to Bootstrap since it offers more flexibility and customization; we won't be restricted to specific components. Also, the website won't be heavier since Tailwind only compiles the CSS that you use.

bmen commented 1 year ago

ok i'll take a look

bmen commented 1 year ago

I took a look at Tailwind CSS. It's interesting, but you need the CLI and a compiler. I tried to integrate it into the container so that not every developer has to set up a Tailwind development environment, but that didn't work out quickly.

@timmwille also noted that we also use Bootstrap for LEAD and the ASKnet.community website. This means that the projects would not differ that much from each other. Therefore, we are leaning towards Bootstrap for the reasons already given. I will now install Bootstrap in the branch of the same name as the ticket and merge all the distributed CSS snippets. I'll let you know when I have something committed.

bmen commented 1 year ago

I have now cleaned up all SASS and CSS files and installed Bootstrap. All libraries are now installed locally and are no longer loaded remotely. By the way We don't need the sass files from all external programmers, as we don't want to develop them further but only use them and update them if necessary. I would therefore save them directly as min.css and min.css.map under /assets/css. We only save the files that we touch and develop and, if necessary, fonts in /_sass. I will write a little documentation on this in the readme.

I will now start to convert the current home page into Bootstrap to get rid of the last CSS snippets.

timmwille commented 1 year ago

Thank you, similar to lead.asknet.community please make sure to keep an Eye on load time and eventually introduce thumbnail images or a similar feature when loading a big chunk of images on the front page, as some images might be 1MB big and 40 of them will generate issues in load time under low network conditions :)

bmen commented 1 year ago

I close this issue with the following pull request: https://github.com/ASKnetCommunity/Training/pull/116

For further details read the description in the pull request