filipelinhares / ress Goto Github PK

This would allow others who use Eyeglass to easily import this package.
http://eyeglass.rocks/#writing-an-eyeglass-module-with-sass-files

Another package, normalize-scss is a good example of how to set it up.

/* Replace pointer cursor in disabled elements */
[disabled] {
  cursor: default;
}

This rule is overridden by the button rule that sets the cursor to pointer.

Solution: define the rule later in the CSS.

The button style adds a "color: inherit" property, which adds complexity to style the button

/* Apply cursor pointer to button elements */
button,
[type='button'],
[type='reset'],
[type='submit'],
[role='button'] {
  cursor: pointer;
  color: inherit;
}

Can you please change your build system so that a non minified version is also stored in the dist folder. It helps sometimes.

Hi, thanks for sharing this, this is really useful. Is this library on a CDN? It would be great if one can just insert a link tag to a CDN hosted version of this library.

Maybe the source file could be scss. Easier for projects to import from bower/npm.

Hi @filipelinhares,

I noticed that iframe on chrome (didn't test other browsers) have the following:

border-width: 2px;
border-style: inset;
border-color: initial;
border-image: initial;

I was thinking that maybe we could add a border-style: none to align default styling.
What do you think? Is this in the scope of this library?

Thank you in advance 😁

It has always bugged me that buttons don't default to the pointer cursor.
An implementation that excludes the "disabled" attribute would make sense.

button {
    cursor: pointer;
}

button:disabled {
    cursor: default;
}

Hi, I've noticed that the property word-break: break-word is behaving differently in different browsers. In particular, the content of an input tag, if too long, will break on multiple lines in Safari but not in Chrome.

Since the default value is word-break: normal I would suggest changing this. Let me know.
Thanks

white text against soft blue (#b3d4fc) is not very readable http://webaim.org/resources/contrastchecker/

button:active color property is not reset. This is problematic in Safari which uses

input:matches([type="button"], [type="submit"], [type="reset"]):active, input[type="file"]::-webkit-file-upload-button:active, button:active {
  color: activebuttontext;
}

where activebuttontext is code for white.

I think this is because of:

button,
input,
select,
textarea {
  background-color: transparent;
  border-style: none;
  color: inherit;
}

and

input {
  border-radius: 0;
}

Should we add :not([type=checkbox]):not([type=radio]) to those?