ambient-image is a Vue component that can be used to add multi colored shadows to images. As shown on the demos below the shadow accepts the colors of the image creating beautiful and fully configurable ambience via handy props for blur, elevation, etc. The component is on npm. You can check the demo and the … Continue reading “Ambient Image Component for VueJs”
VcPiechart is a simple, yet powerful VueJs component for creating pie charts that came out from an experiment I made with the relatively new CSS conic gradients utilizing minimal markup and simple calculations. The package is available as an ES6 module on NPM and the repo is on BitBucket in case you feel like forking it. … Continue reading “Pie Chart VueJs Component with CSS Conic Gradients”
A couple of years ago, when HTML5 WebComponents were new, Polymer was just conceived and I was still experimenting, I created a nice Parallax component based on Mozilla X-Tag – one of the first libraries/framework, built on top of the WebComponents API. The component came out to be pretty popular and as time passed by … Continue reading “Parallax Component for VueJs”
It’s been a while since I last posted here because I’ve been quite busy with daytime projects and I did not have much time for my pet projects, but finally I accomplished an idea that I had for a while. Presenting CSS HDR – an online HDR photo editor, built on top of VueJs, ES6, … Continue reading “Online HDR Photo Editor”
Here’s a small project, based on VueJs and Vuecidity I’ve just accomplished you can use to generate, edit, preview, copy and get permanent link CSS gradients. Currently, it supports linear and radial gradients, but I am planning to add support for conic gradients, enabled by the excellent CSS conic gradients polyfill by Lea Verou.
Just finished my next experiment with HTML5 WebComponents. AcidJs.XTextarea is an advanced replacement of the classic <textarea /> HTML element, supporting custom events and auto resizing as-you-type. Check the extensive documentation in the distribution file (click the download button at the top of the demo page) or scroll this page to see the demos. Usage … Continue reading “Auto Resizing Textarea HTML5 WebComponent”
Below is a quick and dirty solution for adding icons to the <option /> elements of the <select /> tag utilizing CSS generated content. Disclaimer: According to the CSS specs, the <option /> element should not support generated content, and this solution works only in Firefox. Anyways, it may come handy sometime. The Result: The … Continue reading “Adding Icons to the Option Elements of the Select Tag in Firefox. Quick and Dirty”