css – James Dowen

Tag: css

Turning Time Into Colour

The web we see today is built on code, and all of the various colours we see are mostly written in CSS as HEX values. For example, the blue colour on this blog has a HEX value of #3FC0F6, and the grey background has a HEX value of #F1F1F1.

So, here’s an experiment that turns time into colour by taking the values of the hours, minutes and seconds and using them as HEX values: http://jamesdowen.com/projects/hextime/.

Google-style CSS scrollbar

October 6, 2014 / James / 0 Comments

On every website I build (including this very one you are reading this from now), I also add what I like to think is my signature element – a thin, custom CSS, “Google-style” scrollbar. It’s not a massive change to the website, but I certainly think it beats the default scrollbar that is rendered by most browsers today. I call it the Google-style scrollbar simply because they seem to adopt a similar method on Google+ (although there’s is generally wider than mine). I think it’s a sleek touch that can easily be added to any website simply by placing the following CSS onto the website:

        ::-webkit-scrollbar {
            width: 5px;
        }
        ::-webkit-scrollbar-track {
            background: #FFF;
            -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);
        }
        ::-webkit-scrollbar-thumb {
            background: #CCC;
            -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.2);
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #AAA;
        }
        ::-webkit-scrollbar-thumb:active {
            background: #888;
            -webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);
        }

::-webkit-scrollbar {

width: 5px;

}

::-webkit-scrollbar-track {

background: #FFF;

-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.1);

}

::-webkit-scrollbar-thumb {

background: #CCC;

-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.2);

}

::-webkit-scrollbar-thumb:hover {

background: #AAA;

}

::-webkit-scrollbar-thumb:active {

background: #888;

-webkit-box-shadow: inset 1px 1px 2px rgba(0,0,0,0.3);

}

This scrollbar is currently compatible with the latest versions of Opera, Google Chrome, Safari, Android, and iOS.

By all means this isn’t something I’ve invented. And by all means this isn’t anything new. I just don’t think that a lot of designers and developers are aware of it.

Client Testimonial from Mr Patel

October 2, 2014 / James / 0 Comments

In February, I was contacted by a computer science student who is studying at university, named Mr Patel. He kindly asked me to help build a pension manager system, as part of a university module he had to complete. Now, I don’t really know much about pension schemes, how much people receive when they retire, etc. – so I knew that accepting this project would also be a bit of a learning curve for me; but I love to learn new things and implement what I’ve learnt into real life projects and systems. I accepted the project back in February and we completed it last week; and Mr Patel kindly left me this testimonial today in my inbox:

“In my search for a web developer in order to assist me in development for a university module, out of 10+ enquiries James Dowen was the quickest to reply and take an interest in my project from day one compared to others who never got back to me. He asked for a detailed explanation of the task in hand (which was one of a technical/complex nature) and agreed to take it on quoting an affordable price (for a student). Throughout the whole process he has been brilliant, always getting back to my emails almost immediately, even during times when I was being a pain with the requirements. The end product was delivered on time and was so much more than I had anticipated. Overall, my experience has been great which I cannot fault, in the future if any family/friends require web development I will insist and recommend them to use James. Thanks for everything mate, it is much appreciated.”

So Mr Patel, I would like to thank you for been such a pleasure to work with. I wish you the best of luck with your future studies and with whatever journey life decides to take you on.

Testimonials such as this inspire me to work harder and they enable me to enjoy my job even more than I already do.

Technical: Pension Manager was developed using HTML, CSS, jQuery, JavaSript, AJAX, PHP & MySQL.

I’m available for hire.