New from-scratch theme
-
Hi,
I've started working on a new theme from scratch to get rid off that good old overused Bootstrap. By doing this I also wanted to see how NodeBB is intricated with Bootstrap.
So I started by making a copy of the Vanilla theme, changed some stuff in the
.json
files to differentiate it and remove everything inless
.
Using this "No-CSS" theme, the website is obviously unusable and a lot of things have strange random hover behaviour.Now I'm attempting to make a clean No-CSS website to be able to apply CSS on it later. I'm planning to use the pure awesomeness which the recently released Semantic UI is, so I'll have that in mind while creating the website templates.
Basically I'm not really creating the templates, I'm just rewriting them, removing all Bootstrap classes and trying to clean it a bit.
Here are my various questions:
- Does such a No-CSS theme already exist?
- Is there some easy way to remove Bootstrap?
- Do I have to care about some Javascript somewhere?
- Do you have any other comments on what you just read?
Now, here's the first problem I encounter:
I don't know where this less variable (which I removed with everything else) is used. Any advice on where I could find it?
EDIT: Another question, where would be the best places to but the semantic-ui css and js files?
-
That's great, I am actually working on pretty much the same thing (semantic-ui, but with everything designed to be more friendly to old-style forum users).
I add semantic-ui as a submodule
git submodule add
and have a script to handle compilation / then copy the results to the lib and less (even though it is CSS) folders.I didn't encounter your LESS issue because I'm not throwing everything out just yet, but try running
grep -r "state-info-text" ./*
to find the culprit. -
This is usually found in
nodebb-plugin-mentions
...remove the@state-info-text
there. -
I'm working on the topbar right now and I already encounter a problem.
This "navigation" part is defined like this in the Vanilla theme
As I'm not using Bootstrap at all, the value for{navigation.iconClass}
is not valid.{navigation.iconClass}
is the Font Awesome Icon class. Unfortunately, Semantic UI renamed the classes from the originalfa-xxx
pattern to something more human.Any ideas on what I could do? Replacing the icons with JS feels really wrong...
I also don't want to make my own version of NodeBB, I'm just making a theme...It's a "mobile-mode" thing so I could just ignore it and see later, I don't know.
EDIT: Was finally able to post, just had to remove the HTML from the post content ._.