Embedded CSS Framework

I fail to see what menus, lists, etc has to do with it.

Blueprint is a grid, Semantic.gs is a grid.

Semantic.gs is semantic (d’oh), Blueprint is not.

Semantic.gs wins.

No need to throw menus and other widgets into the mix.

If we need improvements, they need to be made at the extension level.

That is, however, a different discussion.

And out of the scope of a Blueprint replacement.

No, Blueprint is also presentational, it has typography etc.

I agree.

It has that to some extent, even without enabling the extra plugins.

Semantic.gs does not.

Personally, I don’t like the reset css which Blueprint uses, so I am happy that we can pick and choose one to be used with Semantic.gs.

So, we need a proper reset css and some sane defaults.

That’s not really a problem, to the contrary. :)

The HTML5 Boilerplate has a reset/defaults stylesheet.

Would probably be a good idea to use that?

Since Yii is going to ship with a html5 ready default template anyway, IMO.

I am using a simple 940px grid ;)

I am using that also … see http://twitter.github.com/bootstrap/scaffolding.html#responsive

The "some guy" on twitter has over 5500 forks and more than 28000 watchers.

Chris with yii-bootstrap has over 30 forks at bitbucket - I would say both offer a very good quality and development speed.

I think we discussed the grid issue before, you can use Bootstrap just as a standalone grid, this is even possible with yii-bootstrap.

And I totally agree on the Sass/Compass issue with you. I followed your advice about semantic CSS a few months ago. In Phundament I use all the "old" blueprint based templates with a LESS translation to Bootstrap. And this is possible for other combinations, too.

By now I almost think Yii should not even ship with a default CSS framework ;), but …

I would love to get some thoughts from you about my current implementation, because it illustrates also “The Problem” we’re discussing here.

When creating a new application I specify my packages with a (composer) JSON file. When my theme package gets installed, I merely copy its contents into the Yii theme folder. Twice - one named "backend" and one "frontend".

Because I really do not want to change the layout of my backend modules, IMHO it just leads to problems.

But in the frontend I need complete flexibility, so I start by updating variables.less from (in this case and just as an example, you may use any CSS framwork you want) Bootstrap, where I can control the colors, fonts, grid, navbar and so on.

Almost all views are overwritten in the theme folder, so I can distribute a consistent application look for the theme installed.

Backend themes reset the theme parameter to ‘backend’ in the view files and then include the original file, which is a bit messy, because you get a lot of files, but you can use the same file contents for all of them.

So, I think this is the typical use-case we’re argu^W talking about. On the one hand complete flexibility in the frontend on the other side complex widgets in the backend. And compatibility of modules like user, rights, etc is also an issue here.

Yii 2 should have a nice solution for that.

Best regards,

schmunk

You should know why it’s so popular: Twitter has put it’s name on it.

It’s like Git, which is as popular as it is because Linus is behind it.

Not because it’s better than the rest.

I don’t think Yii needs either Bootstrap nor Foundation…

Check out the topic I am writing on Semantic.gs and my experiments.

It’s not really complicated.

Schmunk is dead on. +1

Which is might not be related to the "purity" of this thread.

Why is the cart being put in front of the horse?

Yes, Yii needs a base grid and a base theme but why are you deciding which tool to use if the job hasn’t been decided?

With all the disagreement about which CSS framework to use, isn’t it obvious that the frameworks that have been proposed don’t match the requirements needed by Yii?

Which means that both the job and the tool needs retooling!

1.) Yii needs to be HTML friendly, easy, clear, intuitive and semantically correct. If Yii can do that with the help of a transition/translation file any CSS framework should be able to be dropped in. Which means no proprietary naming conventions produced by Yii!

2.) Since Yii now controls the output the CSS framework will need to match. Then get the CSS framework developer to make it work! Yii is large enough to command some respect and I’m sure a lot of these frameworks would live to have their wares hawked for them. If they’re not interested or too busy, then I wouldn’t be interested in using their CSS. Blueprint isn’t being supported some why lock us in to dead code? It’s a business decision.

3.) several choices should be available or at the very minimum, the ability to drop in a community based extension. Of course that will mean that the default Yii look should be maintained. But that will be easy enough if Yii follows number 1 above by outputting generic HTML.

@jacmoe: Thanks for clearing up why they are so popular - I totally disagree with you.

By the way: I read through your posts here. But why don’t you think your own ideas out?

And may I quote the quote:

What’s about Yii, PHP, Apache, … you also know every single line? I really do not care about calling something my own. In fact one the very first thoughts I had about Phundament was: “I don’t want to add code of my own to all these sophisticated libraries and extensions out there.” - just plug them together and tweak 'em.

Maybe that’s the whole philosophical point.

Yii needs a flexible solution. I would totally recommend that Yii defines semantic CSS "dictionary" for page layouts, because it increases the interoperability of extensions. Together with a LESS or sass translation manager/modules/extension which allows you to plug-in any CSS framework you want. As Yii 2 will - hopefully - feature a package manager (composer), have a look at this thread to get an impression how it should work with Yii in the end.

The problem with both Bootstrap and Foundation is that they are not semantic.

I don’t think we should compare a small css framework to more complex software like Apache et al.

Bootstrap is popular because Twitter has lent is name to it.

It’s a fine piece of software, but it’s not really earthshatteringly brilliant.

It has a lot of forks and watchers because it’s Twitter, and because it has a lot of forks and followers…

Nothing wrong with that.

Git is popular because Linus Torvalds wrote it.

Mercurial was written at the same time Linus wrote Git, meant to replace the same versioning system, and was actually more feature complete at the time, but Linus chose Git because he wrote it.

Nothing wrong with that. If you are the boss, you get to choose.

The target audience of both Bootstrap and Foundation is not accomplished web developers who know their way around html and css.

It’s a great help for more casual web monkeys.

Why try and shoehorn it into something where it doesn’t fit when it’s no big deal to write your own?

Writing something ourselves is actually doable and makes a lot of sense.

I am going to do that now.

I’ve already started, using Sass and Less, but I think I’ll drop support for Less and move on to using Sass/Compass - I find it to be more powerful.

And it would mean less reinventing wheels. Sassy buttons is one thing I’d like to use. Both Bootstrap and Foundation have horrible buttons in my opinion.

I’ll plunder both Foundation and Bootstrap for useful things and make something which is both flexible, semantic and reusable.

I think that it will be more in line with what you are proposing, and I hope that Yii will be using it as the initial, low weight css ‘framework’.

I’ve already written something which has replaced Blueprint, and it’s less than 300 lines of css. Was surprisingly easy.

It’s semantic, HTML5 and actually looks better than Blueprint out of the box.

Now remains all the fun work of stealing ideas from various css frameworks. :)

Most of the time, sites made using Bootstrap screams ‘Made With Bootstrap’ - unless it’s heavily modified not to.

Wouldn’t it be great to have a small css framework, written especially for Yii, which out of the box screams ‘Made With Yii’. ? :)

You don’t need a semantic framework - but a semantic markup (with a translation).

You don’t need another CSS framework for Yii - Yii should provide, as a framework, a developer-friendly way to switch or combine them. If you wanna write your own, that’s fine.

I don’t want something lightweight in the first place - I need something that’s stable and just works.

You tend to decide which tool is better for some of your reasons, e.g. drop LESS support. That’s not the way Yii is designed.

Within Yii you can replace almost every application component with something that fits your needs and that should also be possible with the CSS framework and UI components, themes can do this already, although they’re not so developer friendly yet.

Best regards,

schmunk

PS: About git vs. mercurial http://stackoverflow.com/questions/35837/what-is-the-difference-between-mercurial-and-git

Yeah, right.

Bootstrap developers chose Less because that’s what they are most familiar with.

Foundation developers chose Sass for the same reasons.

Why shouldn’t I - or we (if this project takes off) - be allowed to make the same choice? :)

I think I know the differences between Git and Mercurial fairly well since I was part of the extensive evaluation process when Ogre3d decided on Mercurial.

They are essentially offering the same features and it’s impossible to tell which one is better.

Conclusion based on extensive testing, surveys, what-have-you.

Git tends to win the wars due to Github, although that difference is gone now too with Atlassian having acquired Bitbucket.

It was fairly surprising to see the high number of people using Mercurial among Ogre3d developers, although the situation is quite different with regards the web development scene. Maybe you can thank RoR for that?

I choose Sass/Compass due to popularity and the availability of plugins. I don’t like to reinvent any wheels, so it suits me fine that Sass/Compass has been made the default css framework for Ruby on Rails.

And I am familiar with it.

Less have less (pun intended) plugins, so it would make me reinvent wheels, which I really don’t like to do.

I think that too many issues have been thrown into this discussion.

One thing is semantic css and replacing Blueprint.

Another is a better theming engine for Yii.

Semantic css would make it a lot easier to plug in your favorite css frameworks, so I fail to see the conflict with creating a custom mini framework.

Written especially for Yii (thus not requiring any plumbing).

Yet another topic is extension management…

There’s just too many topics in this topic! :lol:

:) good way to sum up what I’ve written :)

To solve issue you need to:

1.) extension management, this needs to be decided upon before all else. Would be sweet to have plug ins/hooks/pipeline solved here finally too!

2.) with "extensions" working system wide, a neutral (no preference towards CSS framework) view engine needs to established based on g11n rather than i18n. Full g11n compliance came come later.

3.) consider whether an internal CSS framework should exist or tie-up with a third party who is willing to work on a Yii focused solution. Of course, the view engine will also allow your variations of *ss and plain CSS. Some of use don’t use those 4 letter *ss words as part of our workflow.

Which is why I think that deciding on a CSS framework now makes almost no sense.

Another responsive CSS framework http://www.gumbyframework.com

Ekerazha: Now, that’s something I can agree with!

I actually wouldn’t mind if Yii used Gumby. :D

Any reason why it’s better than Bootstrap?

It’s smaller.

It looks much better out of the box.

The UI part - which is optional - is much leaner.

At the core it has everything we need: grid, forms, buttons, navigation.

It looks much, much easier to customize than Foundation and Bootstrap.

If that was chosen over Bootstrap, Yii apps would not look like a thousand others. That’s a good argument in favor of Gumby IMO.

It would look fresh and darn cool. :lol:

I’ve been thinking and asked myself the question:

What do I need from a framework?

I need a grid.

I need navigational elements.

I need good looking forms and buttons.

Gumby does that.

And it looks great out of the box.

It also seems to be easy to integrate into my existing toolbox.

Personally, I favor semantic css, but I do realise that it requires tools like Sass/Compass or Less.

Which makes it a poor choice for Yii I guess.

Gumby looks fresher and cooler, so I would definitely use that instead of Bootstrap/Foundation, for projects where I can’t use Sass/Compass.

Another thing in favor of Gumby:

Navigation is pure CSS, no javascript needed.

In fact, just add ‘navbar’ css class to the CMenu and it would work.

EDIT:

I also like the way buttons and navigation works when the browser is sized down (mobile sizes).

It simply converts itself into full-width, vertical elements, perfect for smaller devices.

I LOVED Gumby!

At the moment, my favourite framework still is Bootstrap 2 (with Foundation 3 Icons Fonts instead of Glyphicons Free, mainly for licensing reasons).

I mentioned Gumby just for the record.