Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Some minor issues i found #301

Closed
hidegh opened this issue Mar 1, 2014 · 6 comments
Closed

Some minor issues i found #301

hidegh opened this issue Mar 1, 2014 · 6 comments

Comments

@hidegh
Copy link

hidegh commented Mar 1, 2014

RESETTING FONT
.pure-g [class *= "pure-u"] is CSS3,
why not use .pure-g [class|=pure] which is CSS2 compilant (note no " and no -u is accepted)

NON-RESPONSIVE CSS
IS there really a need to have separate file for non responsive CSS? .pure-g and .pure-g-r is the same, even font-resetting is the same. The only difference is the media selector for .pure-g-r. When I first saw the amount of CSS files of the sources/"binaries" from Github, it took me some time to get over it...

FORMS LABEL SIZE
.pure-form-aligned .pure-control-group label has bigger priority than .pure-form .pure-input-1-2.

also when using input-sizes, the inline-block &NBSP is not addressed.

That's all, I really like this framework. Flexible, easy to understand, even for someone who's new in CSS/Web design...

@ericf
Copy link
Collaborator

ericf commented Mar 1, 2014

RESETTING FONT

The reason pure-u is specified is because of nested Grids. See this for overriding this if you use custom fonts in your design: http://purecss.io/grids/#using-grids-with-custom-fonts

NON-RESPONSIVE CSS

We are working to remove these and handling responsive feature different; e.g., Grids see: #267

When I first saw the amount of CSS files of the sources/"binaries" from Github, it took me some time to get over it...

This is simply to increase flexibility. The primary use-case is simply to include pure-min.css. If you want to do something more advanced: http://purecss.io/customize/

FORMS LABEL SIZE
.pure-form-aligned .pure-control-group label has bigger priority than .pure-form .pure-input-1-2.

Can you elaborate on this? Ideally in its own Issue.

also when using input-sizes, the inline-block &NBSP is not addressed.

You can use Grids to layout forms which handle whitespace. This is what we're planning to move to, and remove the duplicative grid-like classnames in Forms.

That's all, I really like this framework. Flexible, easy to understand, even for someone who's new in CSS/Web design...

😄

@hidegh
Copy link
Author

hidegh commented Mar 2, 2014

FORMS LABEL SIZE
.pure-form-aligned .pure-control-group label has bigger priority than .pure-form .pure-input-1-2.
so even setting .pure-input-1-2, the label size will remain 10em

About &NBSP
The .pure-g [class *= "pure-u"] won't work in IE8 and below - see http://caniuse.com.

Since CSS is cascade, even .pure-g > * { // resetting } would be fine, since we need to remove NBSP inside the .pure-g, but it children should have our custom font. And when nesting, a new .pure-g is placed inside, for which the custom font stack style would be applied...

Also i've noticed that there's some minor difference with yout font stack, so some whitespaces are less than .31em. But layout was ok. BTW: IE ignores to big negative spacing and no owerlap will occure, Chrome does the overlapping...but since it is mostly 1px, it's o.k. Only complaints i've found on the web was with firefox (#302)

About &NBSP - A widerly supported solution
There's also an other ellegant solution which is widerly supported as the _= class selector and that is: _font-size: 0.01% (since 0px will not work everywhere) and restting with: font-size: 1rem!*

i would use: flexbox, then this, and after that the stock font with negativ letter-spacing (as the last allback)...

Some other stuf
What i miss in CSS is the possibility to define variables - mainyl colors, or other "template" settings that can be reused when defining CSS classes, etc.

Since this is not the case, it'd be essential to move skinnning stuff outside the code that handles the main layout. Although this idea sounds good, i really don't know how to apply this inside purecss/forms.css, since padding is also something i'd like to modify...

Anyhow, i thought i tell you this, maybe with your experience you'll com up with something new/original...

@ericf
Copy link
Collaborator

ericf commented Mar 2, 2014

FORMS LABEL SIZE

Please file a separate issue [if one doesn't already exist] with a working with details of the issue.

About &NBSP

What version of Pure are you using?

The .pure-g [class *= "pure-u"] won't work in IE8 and below

Incorrect, it does, they are supported in IE 7 and 8. See the following for details on CSS Attribute Selectors:

Some other stuf
What i miss in CSS is the possibility to define variables - mainyl colors, or other "template" settings that can be reused when defining CSS classes, etc.

Skinning is something we would like to have by the time Pure hits v1.0.0.

@hidegh
Copy link
Author

hidegh commented Sep 5, 2014

SASS is now supported in VS.NET, will there be a SASS version, which is then easier to skin?

@tilomitra
Copy link
Contributor

There are no plans to have a preprocessor version at this time.

@jamesalley
Copy link
Contributor

Closing as there is not a clear, single issue to pursue. Please open separate issues for anything that you feel still needs attention. Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants