Quantcast
Channel: Aloha Editor - HTML5 Editor
Viewing all articles
Browse latest Browse all 30

Spicing up Aloha Editor with CSS3

$
0
0

This is a guest blog entry from Sergiu Firez. Sergiu is a designer and frontend-developer from Romania, working and living in Belgium right now. Last week he tweeted the result of one of his projects – using Aloha Editor – thanks for the interesting insight.

 

Made a little Aloha Editor Theme https://t.co/UpMAc3Z9sI

— Sergiu Firez (@SergiuFirez) 6. Mai 2014

 

So we contacted him asking to write a blog entry for our Aloha Editor blog.

Here it is:

 

After working with Aloha Editor for a while now, I decided to experiment a bit with a new design and some CSS3 animations.

(source & copyright: http://sergiu.firez.be/demo/aloha-editor/aloha-theme.jpg)

 

For this theme I got some inspiration from a couple popular sites and apps. The Tumblr site has a nice sliding sidebar and I thought that it could work well in this case.

 

The icons are from FontAwesome mainly because they have a huge symbol library. When it comes to the buttons, the circle ones are pretty popular these days thanks to iOS 7.
As for colors, iWorks – Numbers has a great color palette.

(source & copyright: http://sergiu.firez.be/demo/aloha-editor/inspiration.jpg)

 

The whole theme has just one image, everything else is done with CSS3. To show you a bit of the theme creation process, meaning animations, I took the time and wrote a little example - See the Pen JAGhC by Sergiu (@Sergiu) on CodePen.

 

This being just an experiment, it can’t be used in production, but I had a lot of fun time creating it. For those interested, the full demo can be seen here http://sergiu.firez.be/demo/aloha-editor


Viewing all articles
Browse latest Browse all 30

Latest Images

Trending Articles





Latest Images