sudo vi /private/etc/hosts
add 127…. /the/new/files/to/serve
In Lion, you can create your own (user based) apache settings at:
[your apache directory]/users/[yourusername].conf
Month: May 2012
Installing in Mac:
gem install sass
comments: use /* */ for anything that will appear on the compiled file, and // for things that only show on the sass development files
When compiling, you can specify if you want your file compacted:
sass yourfile.scss ../css/yourfile.css –style compressed
Other styles: nested, compact, expanded
One of the most powerful features, mixings (example):
@mixin blue_text($size) {
color: #336699;
font-family: helvetica, arial, sans-serif; font-size: $size;
font-variant: small-caps; }
.product_title {
@include blue_text (15px); }
Example of rounded corners mixin:
@mixin rounded_borders($color, $width: 5px, $rounding: 5px) { -moz-border-radius: $rounding $rounding; -webkit-border-radius: $rounding $rounding; -khtml-border-radius: $rounding $rounding; -o-border-radius: $rounding $rounding;border-radius: $rounding $rounding;
border: $width $color solid; }
For mixings, it is always a good idea to put them on their own import file for maintainability (example):
@import “cross_browser_opacity.scss”; .h1 {@include opacity(60); }
@mixin opacity($opacity) {
filter: alpha(opacity=#{$opacity}); // IE 5-9+ opacity: $opacity * 0.01; }
Interpolation means you can have rule definitions that are dynamic:
.red_#{$carname} will generate .red_volvo if volvo is $carname
Here is an example of using this:
@mixin car_make($car_make, $car_color) {
// Set the $car_make with “_make” at the end as a class .car.#{$car_make}_make {
color: $car_color;
width: 100px;
.image {
background: url(“images/#{$car_make}/#{$car_color}.png”); }
} }
And, this is the way you iterate in sass:
@each $member in thom, jonny, colin, phil { .#{$member}_picture {
background-image: url(“/image/#{$member}.jpg”); } }
But just wait a minute: you can also use if statements:
@mixin country_color($country) { @if $country == france {
color: blue; }
@else if $country == spain {
color: yellow; }
@else if $country == italy {
color: green; } @else {
color: red; } }
Writting media queries:
.main {
color: #336699; font-size: 15px; @media print { font-size: 10px; } }
This compiles to:
.main {
color: #336699; font-size: 15px; } @media print {
.main {
font-size: 10px; } }
cd
That will take you to your home directory
vi .bash_profile
And include:
export JAVA_HOME=/Library/Java/Home
Now every time a shell is open, you wil have that set
/* _____ UTILITIES _____ */
.oldSchool{width:750px;}
.gs960{width:960px;}
.liquid{width:auto;margin:0;}
.sidebar{width: 300px}
.clear{clear:both;}/* Layouts */
.line:after,.lastUnit:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;font-size:xx-large;content:” x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x “;}
.line{*zoom:1;}/* Container of the grid, examples of use at https://github.com/stubbornella/oocss/wiki/Grids */
.unit{float:left;} /* Examples: class=”unit size1of2″ produce a cell 50% of the container size */
.unit-right{float: right} /* class=”unit size2of5 lastUnit” produce a cell 2/5 the size of the container, last in the row */
.size1of1{float:none;}
.size1of2{width:50%;}
.size1of3{width:33.33333%;}
.size2of3{width:66.66666%;}
.size1of4{width:25%;}
.size3of4{width:75%;}
.size1of5{width:20%;}
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
.lastUnit{display:table-cell;float:none;width:auto;*display:block;*zoom:1;_position:relative;_left:-3px;_margin-right:-3px;}/* Grids */
.pn{padding: 0}
.ps{padding: 5px}
.pm{padding: 10px}
.pl{padding: 20px}
.mn{padding: 0}
.ms{padding: 5px}
.mm{padding: 10px}
.ml{padding: 20px}
.pts{padding-top:5px}
.ptm{padding-top:10px}
.ptl{padding-top:20px}
.prs{padding-right:5px}
.prm{padding-right:10px}
.prl{padding-right:20px}
.pbs{padding-bottom:5px}
.pbm{padding-bottom:10px}
.pbl{padding-bottom:20px}
.pls{padding-left:5px}
.plm{padding-left:10px}
.pll{padding-left:20px}
.mts{margin-top:5px}
.mtm{margin-top:10px}
.mtl{margin-top:20px}
.mrs{margin-right:5px}
.mrm{margin-right:10px}
.mrl{margin-right:20px}
.mbs{margin-bottom:5px}
.mbm{margin-bottom:10px}
.mbl{margin-bottom:20px}
.mls{margin-left:5px}
.mlm{margin-left:10px}
.mll{margin-left:20px}/* Spacing */
.bold{font-weight: bold;}
.nonbold{font-weight: normal;}
.font-24{font-size: 24px;}
.font-22{font-size: 22px;}
.font-20{font-size: 20px;}
.font-18{font-size: 18px;}
.font-16{font-size: 16px;}
.font-14{font-size: 14px;}
.font-12{font-size: 12px;}
.font-10{font-size: 10px;}
.white{color: #FFFFFF;}
.black{color:#000000;}
.seo-hide{text-indent: -9999px;}/* fonts */
.hidden {display: none;}
.invisible{visibility:hidden;} /* General tricks */
.rounded-corners-3 {-moz-border-radius: 3px;-webkit-border-radius: 3px;-khtml-border-radius: 3px;border-radius: 3px;}
.rounded-corners-5 {-moz-border-radius: 5px;-webkit-border-radius: 5px;-khtml-border-radius: 3px;border-radius: 3px;}
.rounded-top-corners-3{-moz-border-radius-topright: 3px;-webkit-border-top-right-radius: 3px;-khtml-border-top-right-radius: 3px;border-top-right-radius: 3px;-moz-border-radius-topleft: 3px;-webkit-border-top-left-radius: 3px;-khtml-border-top-left-radius: 3px;border-top-left-radius: 3px;}
.rounded-top-corners-5{-moz-border-radius-topright: 5px;-webkit-border-top-right-radius: 5px;-khtml-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topleft: 5px;-webkit-border-top-left-radius: 5px;-khtml-border-top-left-radius: 5px;border-top-left-radius: 5px;}
.rounded-bottom-corners-3{-moz-border-radius-bottomright: 3px;-webkit-border-bottom-right-radius: 3px;-khtml-border-bottom-right-radius: 3px;border-bottom-right-radius: 3px;-moz-border-radius-bottomleft: 3px;-webkit-border-bottom-left-radius: 3px;-khtml-border-bottom-left-radius: 3px;border-bottom-left-radius: 3px;}
.rounded-bottom-corners-5{-moz-border-radius-bottomright: 5px;-webkit-border-bottom-right-radius: 5px;-khtml-border-bottom-right-radius: 5px;border-bottom-right-radius: 5px;-moz-border-radius-bottomleft: 5px;-webkit-border-bottom-left-radius: 5px;-khtml-border-bottom-left-radius:
5px;border-bottom-left-radius: 5px;} /* rounded corners */
ul.vertical-tabs{margin: 0;padding-left: 0;list-style: none;}
ul.vertical-tabs li{float: left;} /* vertical tabs */
Categories
SSH: Setting up a public / private key
Your sys admin should set you up, but here’s the nutshell showdown:
run ‘ssh-keygen’ in your home directory
You will be prompted for a couple of options, for enhancement security,
but optional.
A .ssh directory will be created containing your public and private keys.
Send the .pub file generated to your sys admin to complete the process
on the server you are trying to connect.
After he give you the green light, you are ready to ssh to that server
Categories
SVN cheatsheet
svn status // Tells you what has changed
svn add file_or_dir_name // Add files to codebase
svn delete file_or_dir_name // Remove them
svn commit -m "Saving recent changes" // Commit your changes
svn update // Update your local files, from the folder where you run this one down
svn resolve filename –accept working // You guess it: once you manually fix conflicts in a file, this is the way to let svn you have done so
svn revert [myfile] // Get rid of uncommited local changes
svn delete [myfile] // Delete the file from the repo
svn log [filename] // Check file history
svn log -r 34137 -v // See what files were submitted in a given revision
svn diff -r 33721:33635 [filename] // Test file difference between revision. To find out revision numbers, use svn log above
To ignore files:
export SVN_EDITOR=emacssvn propedit svn:ignore .You need to be at the directory where this happens
Categories
Backbone.js common problems
http://readystate4.com/2011/10/22/common-backbone-errors-and-what-they-mean/
Categories
Web Developer Tools: MAMP
The error log is at:
/Applications/MAMP/logs/php_error.log
To avoid SQL using the wrong time, add –default-time-zone=’+00:00′ to the following file:
/Applications/MAMP/bin/startMysql.sh
To log all the queries that hit the database:
Login all the queries that hit your mysql database:
if you are running MAMP, edit
/Applications/MAMP/bin/startMysql.sh
and put this in the command line
–log=/Applications/MAMP/logs/mysql_query_log
Email clients breakdown:
http://www.campaignmonitor.com/stats/email-clients/
Browser statistics:
http://gs.statcounter.com/