Posts

Showing posts from February, 2014

adding a glow to font icon using css text-shadow

I needed to add a hover glow effect to a font icon, we use flatui which uses fonticons (bootstrap v3 has switched to using font icons now) I tried box-shadow on the font icon span, but there was some spacing above and below the span with the font icon. It did not look good.         &:hover .icons-bar a > span {             box-shadow: 0px 0px 5px 5px #fff;        }      <div class="icons-bar">        <a ng-click="toggleOpen()">         <span class="fui-mail">         <span>         </span>         </span>        </a>    </div> ....sooo I pinged a colleague who had the bright idea of using text-shadow instead of box-shadow. That worked! text-shadow takes 4 values: - x co-ordinate - y co-ordinate - blur radius (optional, create a blue effect by pixel size...the is key) - color of shadow Using 1 text-shadow can add a nice glow effect to one corner, but I neede

angularjs anti-patterns

Anti-patterns are patterns you should not be implementing. There are already a number of guidelines such as use directives only for dom manipulation, use of modules etc. Here's my running list for angularjs of ones I also feel are important. I'm no saint when it comes to these, I've probably implemented all of them at one stage or another. Controllers doing too much (thin Controllers fat Services) In angularjs, its easy to make behavior available from Controllers by adding functions to scope. Need to delete someone from a list? easy add a method on scope and call the delete. Plus models in angularjs are often portrayed as simple plain old javascript objects. Again easy to put the model on scope as use as an ng-model on the page. Many examples and tutorials show this; partly as a shortcut just to illustrate something else but none the less people see it enough times and it can become in-grained Here's the problem with that. Your controllers can quickly contain

angularjs service, factory and provider

If you've used angularjs for any time then you'll have come across service, factory and provider and probably be confused (at least I was). Here's a good post about when and why to use each in stackoverflow, especially the answer by allenhwkin But how do we add prototype functions? Starting with allenhwkins code I created this plunkr which defines a CarFactory that sets a function on the prototype .service() and .factory() are application wide singletons I tested both variations of creating a service using .factory() vs .service() In both cases, I injected the Service into a controller (standard angular dependency injection) and set a value in the Service using a setter Then I inject into other controllers including separate pages and the value I previously set is still set for the Service injected For the standard way you code .factory() and .service(), both are truly application wide singletons. If you set a value its set in the singleton app wide no matter

broken test blues

All my tests are broken, what am I to do, no sleep till fixin', I got them broken test blues Two hundred and fifty nine tests broken, That's a lot to work through, I wish I'd never spoken, I got them broken test blues Ha ha, everyone on the team has experienced the broken test blues. I coined this ditty as I thought about it and fixed my own broken tests. There's more... 12 broken tests, sitting in the console, 12 broken tests, sitting in the console if 1 broken test should get quickly fixed there would be 11 broken tests, sitting in the console, 11 broken tests, sitting in the console