[GRAPHICS] My GTUG logo deviations

Here are some of my GTUG logo deviations (inspired by @aygul's bootcamp logo):

ASCII/HTML GTUG logo

                      ..::::..                       :::::::::::.
                 ::::::::::::::::::              :::::::::::::::::::             .COOOOOOOOOOOOOc
              ::::::::::::::::::::::::         :::::::::::::::::::::::        .OOOOOOOOOOOOOOOOOOOOC
           ::::::::::::::::CCCc:::::::::     .::::::O@@@@@@@@@@@@c::::::    .OOOOOOOOOOOOOOOOOOOOOOOOO      .ccccccccccccc:.
          :::::::::::::8@@@@@@@@@@o:::::::  .:::::::@@@@@@@@@@@@@C:::::::  OOOc:COOOOO    OOOOOOOOOOOOOc:cccccccccccccccccccccc
         ::::::::::::c@@@@@@CC8@@@@@::::::: ::::::::::::o@@@@:::::::::::::OOO   OOOOOC    OOOOOOOOOOOCccccccccccccccccccccccccccc:
        :::::::::::::@@@@@C:::::8@@@@:::::::::::::::::::o@@@@::::::::::::OOOc   OOOOOc    OOOOOOOOOCcccccccOO@@@OCccccccccccccccccc:
       ::::::::::::::@@@@@c:::::C@@@@:::::::::::::::::c:C@@@@::::::c::::oOOOc   OOOOOc    OOOOOOOOccccco@@@@@@@@@@@@occcccccccccccccc.
       ::::::::::::::@@@@@c:::::::::::::::::::::::::::::C@@@@:::::::::::COOO:   OOOOOc    OOOOOOOccccc8@@@@8OOO@@@@@@occcccccccccccccc.
      .::::::::::::::@@@@@c::::::::::::::::::::::c:::c::o@@@@:::::::::::COOO:  .OOOOOc    OOOOOOcccccO@@@@cccccc@@@@@@ccccccccccccccccc.
      .::::::::::::::@@@@@c::@@@@@@@@c::::::::::::::::::c@@@@:::::::::::oOOOc   OOOOOc    OOOOOoccccc@@@@8ccccccO@@@@@cccccccccccccccccc
       ::::::::::::::@@@@@c::@@@@@@@@::::::::::::::::::::@@@@::::c:::::: OOOc   OOOOOc    OOOOOcccccc@@@@Occcccccccccccccccccccccccccccc:
       ::::::::::::::@@@@@c:::::C@@@@::::::::  :::c:::c::@@@8::::::::::  .OOO   OOOOOc    OOOOCcccccc@@@@Occccccccccccccccccccccccccccccc
        :::::::::::::@@@@@C:::::8@@@@:::::::    .::::::::::::::::::::     .OOO           :OOOOCcccccc@@@@OccO@@@@@@@@@ccccccccccccccccccc
         :::::::::::::@@@@@@@8@@@@@@@::::::        .::::::::::::c:          COOO:      .OOOOOOCcccccc@@@@OccO@@@@@@@@@ccccccccccccccccccc
          :::::::::::::o@@@@@@@@@c@@C:::::                                    COOOOOOOOOOOOOOOOcccccc@@@@OccccccO@@@@@cccccccccccccccccc.
            ::::::::::::::::::::::::::::                                        .OOOOOOOOOOOOOOCccccc@@@@@ccccccO@@@@@cccccccccccccccccc
              ::::::::::::::::::::::::                                               .ccccccc   cccccc@@@@Occccc@@@@@@ccccccccccccccccc
                 ::::::::::::::::::                                                              cccccc@@@@@@@@@@@@@@@cccccccccccccccc
                       ......                                                                     :cccccc8@@@@@@@OC@@@ccccccccccccccc
                                                                                                    ccccccccccccccccccccccccccccccc
                                                                                                      :cccccccccccccccccccccccccc
                                                                                                         :cccccccccccccccccccc.
                                                                                                              .ccccccccc:.                            

                                                                                                                                                      

Original GTUG logo was created by @romannurik

Source: http://wiki.gtugs.org/logos

[SOLVED]Building CSS sprites with Bash & Imagemagick

If you want to automatically generate image sprites - css file just use this script

$ spriteit.sh button button '*.png'

Output:

Generating sprite file...
executing: convert button_disabled.png button_hover.png button.png button_selected.png -append button/button-sprite.png
Sprite complete! - Creating css & test output...
        #1 done
        #2 done
        #3 done
        #4 done

Complete! - 4 sprites created, css written & test page output.

Script source:

#!/bin/bash

# uses imagemagick to stich together all images in a folder and
# then writes a css file with the correct offsets along with a
# test html page for verification that its all good

if [ $# -gt 0 ]
then

    if [ 'x' != 'x'$4 ]
    then
        ext2=.$4; # the extension to iterate over for input files
    else
        ext2=".png"; # the extension to iterate over for input files
    fi

    if [ 'x' != 'x'$3 ]
    then
        #ext="."$3; # the extension to iterate over for input files
        ext=$3; # the extension to iterate over for input files
    else
        ext=".gif"; # the extension to iterate over for input files
    fi

    name=$1; # output will be placed in a folder named this

    if [ $2 ]
    then
        classname=$2"-sprite";
    else
        classname=$1"-sprite";
    fi
    css="$name/$classname.css";
    html="$name/test.html";

    rm -fr $name;
    mkdir $name;
    touch $css $html;

    echo "Generating sprite file...";
    #echo convert *$ext -append $name/$classname$ext;
    echo executing: convert $ext -append $name/$classname$ext2;
    convert $ext -append $name/$classname$ext2;

    echo "Sprite complete! - Creating css & test output...";

    echo -e "<html>\n<head>\n\t<link rel=\"stylesheet\" href=\"`basename $css`\" />\n</head>\n<body>\n\t<h1>Sprite test page</h1>\n" >> $html

    echo -e ".$classname {\n\tbackground:url('$classname$ext2') no-repeat top left; display:inline-block;\n}" >> $css;
    counter=0;
    offset=0;
    for file in $ext
    do
        width=`identify -format "%[fx:w]" "$file"`;
        height=`identify -format "%[fx:h]" "$file"`;
        #idname=`basename "$file" $ext`;
        idname=`basename "$file" $ext2`;

        clean=${idname// /-}
        echo ".$classname#$clean {" >> $css;
        echo -e "\tbackground-position:0 -${offset}px;" >> $css;
        echo -e "\twidth: ${width}px;" >> $css;
        echo -e "\theight: ${height}px;\n}" >> $css;

        echo -e "<a href=\"#\" class=\"$classname\" id=\"$clean\"></a>\n" >> $html;

        let offset+=$height;
        let counter+=1;
        echo -e "\t#$counter done";
    done

    echo -e "<h2>Full sprite:</h2>\n<img src=\"$classname$ext2\" border=1/>" >> $html;
    echo -e "</body>\n</html>" >> $html;

    echo -e "\nComplete! - $counter sprites created, css written & test page output. @russenreaktor";

else

    echo -e "There should be at least 1 argument!\n\tbuildSprite.sh output_folder classname input_pattern"
    echo -e "\n\tbuildSprite.sh folder1 test '*.png' png"

fi

Source: jaymz.eu