Category Archives: css

Android Emulator

Most of you know that you can install an Android Emulator on your computer to test apps and websites.

I’ve got the Android SDK installed so I can run an emulator. Recently, I removed an old version of the SDK and started from scratch. I’d installed it in a place I didn’t like and wanted to start over. The problem I ended up having was that the 4.x version that I installed had an insanely slow emulator. Here’s a nice little write by Mirko Juric-Kavelj up on how to speed up that emulator 🙂

quarantined file issues in Mavericks OSX

Ok, so ever since I upgraded to Mavericks from Mountain Lion, I’ve had crazy issues dealing with font files that I’ve downloaded. At first, I thought it might be some sort of font issue with Mavericks, but it turns out it’s a quarantine issue with downloaded files.

For a bit now, OSX quarantines files that are downloaded. It’s a nice security feature, but dang, it’s really messing me up :/ I’m not sure yet why my box is behaving this way. I’m sure there’d be massive outcry if this were a rampant issue.

When a file is downloaded, some extra meta is added to it. You can tell from the command line as the permissions look something like this when you list all aka ‘ls -la’ …

drwxr-xr-x@

The work around I’ve pieced together that I have to do each time I download a zip file is to unpack it, then run xattr on it to remove the quarantine flag. Here’s an example of a style.css file that I ran this on to allow scripts on my box to see the file.


xattr -d -r com.apple.quarantine style.css

or

xattr -dr com.apple.quarantine style.css

What should happen is when I click to unzip the zip file, I should get a GUI alert that asks me if I really want to open this file from the internet. Sadly, it’s not happening on my box.

Anyway, hope this helps the random person out there searching for a possible solution.

Update: 4/16/14

It would be helpful to let you know how to actually find the bit of data to remove. Above you see com.app.quarantine. That’s the metadata you need to remove. To find it simply type…


xattr somefilename

That’ll output a string which you’d put in place of ‘com.apple.quarantine’ as seen above.

WordPress Theme TwentyTwelve

Ah, now for some analysis, and discovery 🙂  Each year, the brilliant minds that contribute to WordPress come up with a new theme, and I always tear it apart to do a little reverse engineering so I can get a better sense of some of the new features in the framework.

i usually start looking in a theme’s functions.php file just to get a sense of the functionality, since my bent is more toward the engineering side of things, but definitely dig into the style.css files and any other things I find.

Keep in mind, this is by no means a thorough review of the twentytwelve theme.  It’s really a review of stuff that I think is neat or applies to me in the way I make use of wordpress.

Here’s some of the fun new stuff in WordPress’ theme, TwentyTwelve:

A mobile ready navigation!  Whoot!  I’ve got my own solutions, and this little one is pretty nice.  You’ll find some of the particulars in /js/navigation.js and the rest is in the media queries of the style sheet.  You’ll also notice that the navigation is no longer in the #access element.  It’s been renamed #site-navigation and is referenced in the style sheet under .main-navigation.

There is a function in there, twentytwelve_body_class(), that defines the body class element a bit more than the last version. It’s a nice way to handle identifying different page templates.  I’ve got my own version that adds it in on the fly from within the custom templates that I’ve created, but this is a nice separation of functionality.

There seems to be new features for customizing themes.  I stumbled across the action ‘customize_register’, which led me to this page, http://codex.wordpress.org/Plugin_API/Action_Reference/customize_register.  There I can see that the management of a theme customization page has been built into the framework since 3.4 or thereabouts.  Nice.

Oh baby…the style sheet!  The revamp of the stylesheet is a great!  It’s like I’ve been developing for the WordPress team this past year as they’ve incorporated all the practices I’ve put into place in my own theme.  Yowsa.

First thing I notice right away is the switch to ‘rem’ as a unit.  Based on the addition of the ‘rem’ unit in CSS standards a while ago, I’d already switched over to the use of that unit as my base.  It seems that the WP team has gone for it full hog and implemented the ‘rem’ unit with a ‘px’ fall back.  Thanks guys!  They leave the base at what seams to be 14px, by leaving it to 87.5% of the base font size of browsers.  I always reset mine to a 10px base so that the math is easier for me.  This way, no matter where I’m at in the style sheet, I know that 1rem is 10px.  Plus, I try to set my base font size to 16px because I’m an old fart and it’s easier for me to read 🙂

There are a few added directories, /inc and /page-templates, where it seems that they’ve decided to do a little bit of file storage architecture, or also known as cleaning up the file structures 🙂  Again, pretty nice, as I’ve always incorporated an /inc directory for functionality and style files like php scripts, javascript files and fonts.

That’s all for now 🙂