Skip to content
This repository has been archived by the owner on Oct 26, 2021. It is now read-only.

Press.css - Now Less than 4KB!
Compare
Choose a tag to compare
@codyogden codyogden released this 20 Jul 04:22
· 41 commits to master since this release
2.0.0
6f38fc7

I noticed a few stars lately. Thank you!!

Press.css is ready for a version 2.0 release! It's now completely optimized for modern browsers taking advantage of custom CSS properties (CSS variables). The major improvements are to the file size taking the initial 12KB press.css file and reducing it to less than 4KB and does not lose any of its previous functionality.

CSS Variables

Press.css is now extendable without the need for using or compiling with Sass! In addition to the default colors, you can create your own custom classes with the press-[class] format and a special CSS custom property.

.press-love {
	--p: pink;
        color: red;
}

Accessibility First

Now that you can easily add new and custom colors to Press.css, I wanted to ensure that Press.css adheres as close as possible to web accessibility standards. While I was able to keep all the original button colors from the original release, this meant I needed to change the default text color on many of the buttons to ensure a minimum of AA compliance with (WCAG 2.0).

If color: #FFF would cause a color ratio to fall below a 4.5 (AA), it will default to a black color instead. Colors can easily be overridden with normal CSS with the following:

.press:not(.press-ghost) {
    color: #FFF;
}

Browser Support

I have tested the library as is in modern Chrome, Safari, and Firefox.

Assets 2