The taskbar in Windows 7-10 is so much better than on Mac

Having a persistent taskbar where you can launch applications with a click of a mouse button is such a good idea, that all Desktop operating systems seem to have one, which is great!

On Windows it runs the full width of the bottom of the screen, and in Mac (on every version I’ve used at least) it does the same, but aligns to the center. Continue reading The taskbar in Windows 7-10 is so much better than on Mac

Unity has a 8 digit Hex color, and that’s insane!

hex in unity

I noticed something today. Unity has a hex value for colours, which is great – I hate having to remember RGB values between various graphics programs. But Unity’s hex value has 8 digits (see above), which is INSANE! Hex should be 6, it’s always been 6. It’s literally Greek for 6!  Continue reading Unity has a 8 digit Hex color, and that’s insane!

4 examples of CSS being weird

I know many people find CSS quite difficult, and often I see this gif shared as an example of how people work with CSS:

Peter Griffin doing css

But if you’re doing CSS like this, YOU’RE DOING IT WRONG! CSS isn’t that difficult, but sometimes the chosen syntax does make me WTF. Here’s some examples of that:

Comma inconsistencies

Sometimes you need a comma to differentiate multiple values, like:

transition: color 200ms, background 200s;

But sometimes not:

transform: translateX(-50%) translateY(-50%);

Why isn’t this consistent?!

Slashes in shorthand

Ever seen this?

font: 12px/18px "Lucida Grande", sans-serif;

The first 2 values are shorthand for font-size and line-height. Why they’re separated with a slash though seems unusual as I’ve not seen that used anywhere else.

Apart from you can apparently use it in border-radius (here’s an article explaining that) to separate horizontal and vertical axis, but again – that’s inconsistent to how we do it elsewhere!

Camel Case or hyphen?

CSS has always been hyphenated, for example background-color, text-transform etc, so why did we start adding camelcase like translateY, rotateX? It’s inconsistent!

Edit – Also, overflow-y and translateY – Y so different?

Vertical Percentages are Relative to Container Width, Not Height

I didn’t actually realise this for a long time. It can be really useful once you know what it’s doing. Here’s an article about it. But why can’t I also set a height based on a percentage of the container’s height?

Most popular articles from 2015

I know March seems like an unusual time to do a roundup of last year, as we’re already 2 months into 2016, but I was recently encouraged to do a roundup of all articles on my OngoingWorlds blog, so thought it wasn’t too late to do it for this blog too. So here’s the most viewed articles I wrote in 2015:

  1. I’ve finished a game but too embarrassed to show it anyone because it’s about a giant turd
  2. Exporting a sprite sheet from Flash into Unity animation
  3. So I’m uploading something to the Google Play store
  4. My CSS layout – group by component, not by screen-size
  5. I use BEM – A good clear naming convention
  6. Chrome pulls Unity plugin
  7. My opinions on using or not using Bootstrap
  8. My favourite CSS comment style
  9. How long before we get cool curved desktop screens like this one from Black Mirror?
  10. A vertical-align mixin that changed my life

Also, I wrote this article about what I did in 2015.

jQuery – check if an element contains element

Forgive the jQuery! I’m just putting it here so I can find it again later 🙂

I’ve recently just had to create a menu in Foundation, in a CMS where I can’t change the menu markup (it just outputs lis and uls). So have had to use JavaScript to add the classes that Foundation needs to turn this into the slidey mobile menu. It feels like a horrible hack I know, but there’s no better way – and the Foundation menu needs JavaScript to display anyway.

So I needed to add the .has-dropdown class to any li containing a ul, which I did with jQuery’s .has() function:

//-- Add Foundation dropdown classes to subnav (so mobile nav works)
$("#main-nav li").has("ul").addClass("has-dropdown");
$("#main-nav li ul").addClass("dropdown");

The internet, a living graveyard

I stumbled across the blog today of Alex King, who wrote an article titled “We’ve made web development complicated” (see it here), which is something I’ve been thinking about recently (I also wrote a blog article about it called “Editing websites has never been more time-consuming” (see that here).

The most interesting thing about Alex’s blog though is that, well, he’s dead. Continue reading The internet, a living graveyard

Particles in Unity appearing in front of mesh

I had a weird bug in Unity today where particles that are supposed to be in the background were actually appearing in front of meshes that are closer to the camera.

After quite a lot of searching, the solution is actually simple, but wasn’t obvious so I thought I’d write it here.

So my particles are exactly where they are supposed to be, behind the land mesh. But are appearing in front (see image above).

Unity particles behind mesh

This is actually caused by the particles being scaled. I first found out about it from this thread on Unity Answers, linking to this forum post about it.

If I set the particles’ scale to 1, it resolves itself. I thought I’d have to muck about with sorting orders or layers (still not got to grips with those in Unity yet. Doesn’t seem to change anything to me).