Recently a fellow team member challenged me to recreate the new Spotify “Like” button using only CSS. Honestly I’m not sure if he challen...CSS SCSS UI/UX Frontend Animations
It’s been a few years, several great people, an awesome company, and a cool thing we made 😀
Once upon a time, we had a mixed bag of frameworks powering our web properties. Bootstrap, Semantic UI, and thousands of lines written in straight CSS (and a bit of Less). Fast-forward to today, where we have our stable CSS framework written in Sass and a post-1.0 version that we’re offering to the dev community!
We wrote Platform UI to serve our own needs, although we hoped to offer it to the public at some point. We cleaned up personal preferences for more general considerations, thought hard about ease of use, and wrote some utilities we don’t see elsewhere. We didn’t try to copy what the other frameworks were doing, but we’re all based on the same thing - the W3C CSS standard. So you may see similarities along the way.
Add a CDN call to the head of your HTML document, a script call just above the closing
</body> tag; you’re up and running with Platform UI! We’re using UNPKG here, but you can use other CDNs: JSDELIVR, Skypack?
<!-- In the <head> of your site. --> <link rel="preconnect" href="https://unpkg.com" crossorigin> <link rel="stylesheet" href="https://unpkg.com/@ritterim/platform-ui/dist/platform-ui.min.css" crossorigin> <!-- Directly before the closing </body> tag of your site. --> <script src="https://unpkg.com/@ritterim/platform-ui/dist/js/platform-ui.min.js" crossorigin defer></script>
You can find starter templates at our Launchpad. More are on the way!
Here’s a quick blog template just for you!
There’s certainly no shortage of icon choices out there. Again, there were icons we needed in our ecosystem, so we thought we’d create our own instead of loading a set where we weren’t going to use 90%.
We pack Platform Icons right next to Platform UI, so once you’ve called the CDN, you have the framework and the icons all at once.
We hope you enjoy what we made.