Welcome to this week's design & development roundup!
Last week, Facebook announced measures to tackle fake news in Germany ahead of this years parliamentary election, the iPhone celebrated its 10th birthday (from the date it was announced) and Spotify invited President Obama to come and work for them as 'President of Playlists'.
If you love cats and CSS, this is the only loader you need to use (ever again). Find an excuse to use it on a client project, print it out and create a stop-motion video. Just use the cat.
Button Hover Draw
This lovely CSS-only button is the perfect companion to the cat loader above, and can be used anywhere to bring a little bit of class and animation to your website.
The (15) adjusters are in the current draft spec as:
alpha, rgb, red, green, blue, hue, saturation, lightness, whiteness, blackness, tint, shade, blend, blenda, and contrast.
The color function allows you to apply one or more adjusters to the given base color:
color(#ea3333 alpha(90%) saturation(75%) shade(20%)) /* rgba(182, 47, 47, 0.9) */
Many of the adjusters also have short names:
color(#ea3333 a(90%) s(75%) shade(20%)) /* rgba(182, 47, 47, 0.9) */
Using the CSS Color Function can be difficult, as % based adjustments to a base colour can be hard to visualise. Using ColorMe allows you to quickly see how a slight movement in adjuster can change the colour output, without having to guess the numeric value in your css.
Chevereto in an open source php script that enables users to implement a fully functional image hosting application on their server. Chevereto provides a free web installer to help get you started. Once downloaded, the installer has to be run on your server which will provide a set of installation instructions.
An admin account is required to access the dashboard .Chevereto allows customization of image upload settings including maximum upload size, guest uploads, image paths etc. Chevereto also includes an api to allow developers to upload images as guests to the users’ website.
For a full list of features, read more on Chevereto.
Photo: Emoji Stickers
Vue.js Circle Menu
Big List of Naughty Strings
Photo: Emoji Stickers
Every developer has come across this problem. You're trying to do some trivial input checking but there's some qwerky character screwing up your database transaction. The Big List of Naughty Strings is an evolving list of strings which have a high probability of causing issues when used as user input data. The list was created to help automated and manual QA testing. So there you have it. Take some odd strings and see what sites you can break!