Years ago when I first met Bootstrap, when it still called itself Twitter Bootstrap, I searched how to colorize it, changing the default white/blue color scheme.
I remember there was even an online tool I could upload a random picture and it would generate a separate CSS file with its most noticeable colors, which I also could edit here and there in case their algorithm didn't match my wishes.
Today, using Bootstrap 4, not only I didn't find such online tool anymore but I also surprisingly didn't find anything at all related to a way to change the color scheme of Bootstrap version 4 (let's emphasize that)
Is there anything like this nowadays that would help automate a little bit the process?
Note: Preferably without requiring knowledge of LESS/SASS/SCSS nor anything like that
I think since Bootstrap 4 is still in alpha, the customizer websites like bootswatchr are not using it yet.
So for now you can use the options to override the basic settings :
https://v4-alpha.getbootstrap.com/getting-started/options/
Related
We're starting a website project and came accross the paid Rio theme.
What we're wondering is how far can we go in customisation without having to touch the theme's CSS, and if buying the layout and theme is worth in our case at all.
Rio is not specifically the only option we want, we just want to be able to do the following:
We'd like to change the look of the website depending on the logged in user.
Theme customisation:
The .ui-panel-titlebar ("Downloads" example in Rio's Dashboard page) seem
to be hardcoded to be purple #5C6BC0. Is there any chance to change
that background by adding or changing a class? The important part is
that we don't change the core CSS files of the theme and preferably
don't create additional CSS classes nor make use of precompiling
frameworks.
Can we edit the logo on top left only to make the menu move slightly to the bottom? I tried with a bigger image through Chrome's
DevTools but the image overlays to the bottom.
Is is a good practice to think this way: We're thinking to have a WebpageThemeController with methods that would return the correct
class strings depending on the user, to put in the different parts of
the website.
Is considering Primefaces' layout+themes good in this case? If not, how should we proceed?
Thanks
Next version of RİO will have less integration to easily customize colors, fonts ...
You can even use multiple layouts per user by the way, here is a tutorial;
https://youtu.be/jbNdtndIsqk
I was wondering if you can give me any pointers on how to write a firefox plugin/add-on, that would change the layout of the page one is on, based on a pre- written CSS file.
It's meant as a prototype and what I want to be able to do initially is to make my browser automatically change the background color of certain div's, when I navigate to the chosen page. I'm only trying to make it work for a couple of sites.
I speak python, javascript/jquery, css, html ..
You may be able to accomplish your goal using the Stylish addon without writing your own. This basically allow you to attach custom CSS overrides based on a URL pattern.
If you want to do this and write your own extension, you could use the addon-sdk and make use of page-mod. Here is a tutorial that will help you with running the script only on the URL's you specify. As of FireFox 34 you should be able to attach actual CSS files instead of having to rely on JavaScript. Learning the addon-sdk it a lot less intimidating than making an old style / low-level extension and should be sufficient for your needs.
There are a few different ways to accomplish similar things, so you will need to experiment based on your needs.
What kind attempts there exist to make Plone 4 themes based on Twitter Bootstrap, preferably 2.0?
I have seen some discussion on mailing list and I'd hope to know what add-ons there already exists before inventing a new one.
http://pypi.python.org/pypi/plonetheme.bootstrap/1.0a1
and
https://github.com/kagesenshi/diazotheme.bootstrap
You don't need to use an add-on per se (though you can). Instead, consider downloading an example template from:
http://twitter.github.com/bootstrap/getting-started.html#examples
Then apply rules to it, as explained here:
http://docs.pythonpackages.com/en/latest/hosted-configs/plone-diazo.html
This approach places a heavier emphasis on HTML/CSS/JavaScript knowledge in general, and less on Plone-specific techniques.
Note that the new (4.3-hopefully) plone.app.theming will contain an example/template theme based on Bootstrap.
It's not intended to be perfect (it also needs to be easy to understand and chop up and reuse), but it shows the basics. See https://github.com/plone/plone.app.theming/tree/optilude-ace/src/plone/app/theming/template for the work in process.
Bootstrap is a starting point to create a webapp. It provides a lot of CSS with associated widget. Mix with Plone will add conflict (forms.css, ...) and not optimised results (weight of page).
Once Plone will have splited CMS UI in overlays it will be easier to build the CMS UI itself on bootstrap or use bootstrap to create a theme (I like their responsive solution).
At the moment you will have many bugs by using existing addons. I have already tried plonetheme.bootstrap and diazotheme.bootstrap.
So if you really want it, get all Plone's CSS in a trash, get bootstrap and start to see what happens ;)
I'm looking for a css editor which makes it possible to e.g.:
change color with a color selector (something like this or this
support for css properties e.g. the typical CTRL+SPACE complete drop down intellij thing
maybe possibility to say, group background colors from different styles together. So you change 1 value which gets reflected everywhere.
maybe support changes on the fly in the webbrowser, firebug like, but better.
more?
This can be an eclipse plugin or standalone app. It must be free.
Maybe you want to try Sublime Text 2? I'm not sure if ti can do all those things but I've seen it doing the on the fly changes with Chrome (haven't tried it myself). It's not free but the version you download will just remind you to purchase it. It will still work fine anyway.
http://www.sublimetext.com/
Has anybody experience in building a custom style in Qt? What I have in my mind is a complete new style that affects all kind of widgets. I have seen some examples in the web for a custom combo box. But I have no idea how much time and code it takes to build a "complete" new custom style ... maybe someone can give me a hint.
We think of using Qt 4.3 (or even newer) ...
Check out the Stylesheets facility in Qt 4. While it's still a hassle, it's way easier than doing a full-on custom style. You can just adjust one visual facet at a time and try it out.
It pays attention to inheritance. So if you style the font in QWidget, then every visual widget will also use that font. And so on.
I have developed a "new" style that changed the appearance of much of an application. It did take some time, and quite a bit of experimentation. I also derived my style from the generic windows style, to allow it to handle some of the stuff I didn't want to mess with. All told, I think it took me a week to get most of what I wanted, with practically no prior exposure to the styles.
In order to actually develop one, I would get into the source for their styles example, which has a "wood" style. I put my own style in place of the example style, and started changing things while using the example program to check how it looked. Depending on how you are developing it, you might want to have a configuration file so you can easily change some of the values without recompiling.
You might want to look at existing styles. You can find quite a few of them on kde-look.org, in the Styles / 4.0 section.
We've done it in the past (in Qt 3), and it's extremely time-consuming. We had a lot of problems with flickering, redraws not working the way we expected, sluggish behavior, bugs in the Qt implementation. It a lot less straight-forward than it seems, and there's little support or user experience too. Unless you need something really particular (as we did), I'd say it's not worth the trouble.
Other frameworks are supposed to make it easier (some Java-based?), but I don't have first hand experience.
If you don't need to radically change the widget style, you might want to try using widget style sheets:
http://doc.qt.digia.com/4.4/stylesheet.html