All of the below use only a single HTML element. Any kind of CSS goes, as long as it’s supported in at least one browser.

Square

#square {
width: 100px;
height: 100px;
background: red;
}

Rectangle

#rectangle {
width: 200px;
height: 100px;
background: red;
}

Circle

#circle {
width: 100px;
height: 100px;
background: red;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 50px;
}
/* Cleaner, but slightly less support: use “50%” as value */

Oval

#oval {
width: 200px;
height: 100px;
background: red;
-moz-border-radius: 100px / 50px;
-webkit-border-radius: 100px / 50px;
border-radius: 100px / 50px;
}
/* Cleaner, but slightly less support: use “50%” as value */

Triangle Up

#triangle-up {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
}

Triangle Down

#triangle-down {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
}

Triangle Left

#triangle-left {
width: 0;
height: 0;
border-top: 50px solid transparent;
border-right: 100px solid red;
border-bottom: 50px solid transparent;
}

Triangle Top Left

#triangle-topleft {
width: 0;
height: 0;
border-top: 100px solid red;
border-right: 100px solid transparent;
}

Triangle Top Right

#triangle-topright {
width: 0;
height: 0;
border-top: 100px solid red;
border-left: 100px solid transparent;
}

Triangle Bottom Left

#triangle-bottomleft {
width: 0;
height: 0;
border-bottom: 100px solid red;
border-right: 100px solid transparent;
}

Triangle Bottom Right

#triangle-bottomright {
width: 0;
height: 0;
border-bottom: 100px solid red;
border-left: 100px solid transparent;
}

Parallelogram

#parallelogram {
width: 150px;
height: 100px;
-webkit-transform: skew(20deg);
-moz-transform: skew(20deg);
-o-transform: skew(20deg);
background: red;
}

Trapezoid

#trapezoid {
border-bottom: 100px solid red;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
height: 0;
width: 100px;
}

Star (6-points)


#star-six {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
position: relative;
}
#star-six:after {
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 100px solid red;
position: absolute;
content: “”;
top: 30px;
left: -50px;
}

Star (5-points)


#star-five {
margin: 50px 0;
position: relative;
display: block;
color: red;
width: 0px;
height: 0px;
border-right: 100px solid transparent;
border-bottom: 70px solid red;
border-left: 100px solid transparent;
-moz-transform: rotate(35deg);
-webkit-transform: rotate(35deg);
-ms-transform: rotate(35deg);
-o-transform: rotate(35deg);
}
#star-five:before {
border-bottom: 80px solid red;
border-left: 30px solid transparent;
border-right: 30px solid transparent;
position: absolute;
height: 0;
width: 0;
top: -45px;
left: -65px;
display: block;
content: ”;
-webkit-transform: rotate(-35deg);
-moz-transform: rotate(-35deg);
-ms-transform: rotate(-35deg);
-o-transform: rotate(-35deg);

}
#star-five:after {
position: absolute;
display: block;
color: red;
top: 3px;
left: -105px;
width: 0px;
height: 0px;
border-right: 100px solid transparent;
border-bottom: 70px solid red;
border-left: 100px solid transparent;
-webkit-transform: rotate(-70deg);
-moz-transform: rotate(-70deg);
-ms-transform: rotate(-70deg);
-o-transform: rotate(-70deg);
content: ”;
}

Pentagon



#pentagon {
position: relative;
width: 54px;
border-width: 50px 18px 0;
border-style: solid;
border-color: red transparent;
}
#pentagon:before {
content: “”;
position: absolute;
height: 0;
width: 0;
top: -85px;
left: -18px;
border-width: 0 45px 35px;
border-style: solid;
border-color: transparent transparent red;
}

Hexagon



#hexagon {
width: 100px;
height: 55px;
background: red;
position: relative;
}
#hexagon:before {
content: “”;
position: absolute;
top: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 25px solid red;
}
#hexagon:after {
content: “”;
position: absolute;
bottom: -25px;
left: 0;
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-top: 25px solid red;
}

Octagon


#octagon {
width: 100px;
height: 100px;
background: red;
position: relative;
}

#octagon:before {
content: “”;
position: absolute;
top: 0;
left: 0;
border-bottom: 29px solid red;
border-left: 29px solid #fff;
border-right: 29px solid #fff;
width: 42px;
height: 0;
}

#octagon:after {
content: “”;
position: absolute;
bottom: 0;
left: 0;
border-top: 29px solid red;
border-left: 29px solid #fff;
border-right: 29px solid #fff;
width: 42px;
height: 0;
}

Heart

#heart {
position: relative;
width: 100px;
height: 90px;
}
#heart:before,
#heart:after {
position: absolute;
content: “”;
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: red;
-moz-border-radius: 50px 50px 0 0;
border-radius: 50px 50px 0 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}
#heart:after {
left: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin :100% 100%;
}

Infinity

#infinity {
position: relative;
width: 212px;
height: 100px;
}

#infinity:before,
#infinity:after {
content: “”;
position: absolute;
top: 0;
left: 0;
width: 60px;
height: 60px;
border: 20px solid red;
-moz-border-radius: 50px 50px 0 50px;
border-radius: 50px 50px 0 50px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}

#infinity:after {
left: auto;
right: 0;
-moz-border-radius: 50px 50px 50px 0;
border-radius: 50px 50px 50px 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

Diamond

#diamond {
width: 80px;
height: 80px;
background: red;
margin: 25px 0 15px 35px;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}

Egg

#egg {
display:block;
width: 126px;
height: 180px;
background-color: red;
-webkit-border-radius: 63px 63px 63px 63px / 108px 108px 72px 72px;
border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
}

Pac Man

#pacman {
width: 0px;
height: 0px;
border-right: 60px solid transparent;
border-top: 60px solid red;
border-left: 60px solid red;
border-bottom: 60px solid red;
border-top-left-radius: 60px;
border-top-right-radius: 60px;
border-bottom-left-radius: 60px;
border-bottom-right-radius: 60px;
}

Talk Bubble

#talkbubble {
width: 120px;
height: 80px;
background: red;
position: relative;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}
#talkbubble:before {
content:”";
position: absolute;
right: 100%;
top: 26px;
width: 0;
height: 0;
border-top: 13px solid transparent;
border-right: 26px solid red;
border-bottom: 13px solid transparent;
}

Yin Yang

#yin-yang {
width: 96px;
height: 48px;
background: #fff;
border-color: red;
border-style: solid;
border-width: 2px 2px 50px 2px;
border-radius: 100%;
position: relative;
}

#yin-yang:before {
content: “”;
position: absolute;
top: 50%;
left: 0;
background: #eee;
border: 18px solid red;
border-radius: 100%;
width: 12px;
height: 12px;
}

#yin-yang:after {
content: “”;
position: absolute;
top: 50%;
left: 50%;
background: red;
border: 18px solid #eee;
border-radius:100%;
width: 12px;
height: 12px;
}

Article preloaded from here

Meta-List

Graphics Programming

Language Agnostic:

ASP.NET MVC:

Assembly Language:

Bash

C/C++

C#

  • See .NET below

Django

Emacs

F#

  • See .NET below

Forth

Git

Haskell

HTML

Java

JavaScript

Linux

Lisp

Lua

Maven

Mercurial

.NET (C#)

NoSQL

Objective-C

Parrot / Perl 6

Perl

PHP

PowerShell

Prolog

PostgreSQL

Python

REBOL

Ruby

Scala

Scheme

Smalltalk

Subversion

SQL (Implementation agnostic)

Symfony

Vim

Original source here.

Here is a short PHP code that automatic creates a subdomain via CPanel XML API.

require_once(‘xmlapi.php.inc’);
$xmlapi = new xmlapi(’127.0.0.1′);
$xmlapi->password_auth(‘root’,’password’);
$xmlapi->set_debug(1);
print $xmlapi -> api1_query(‘accountname’ , ‘SubDomain’ , ‘addsubdomain’ , array(‘sub’ , ‘domain.com’ , 0 , 0, ’/public_html/folder’));

API website: http://docs.cpanel.net/

API?

For those who are unfamiliar with the term, API is short for Application Programming Interface.

According to Wikipedia:

“An application programming interface (API) is a source code based specification intended to be used as an interface by software components to communicate with each other. An API may include specifications for routines, data structures, object classes, and variables.”

Zoho Api

API Visualization - Image courtesy of http://blog.zoho.com

In simpler terms, an API refers to a set of functions built into an application, which can be used by other applications (or by itself, as we’ll see later), to interact with the application. An API is a great way to expose an application’s functionality to external applications safely and securely, since all functionality that these external applications can do is limited with what functionality is exposed in the API.

What’s an “API-Centric” Web Application?

An API-Centric Web Application is a web application that basically executes most, if not, all its functionality through API calls.

Continue to read the tutorial here.

A ROCK-SOLID DEFAULT FOR HTML5 AWESOME.


Along with HTML5 Boilerplate’s rock solid commitment to cross-browser consistency, H5BP brings you delicious documentation, a site optimizing build script, and a custom boilerplate builder. In addition to this, we now support lighttpd, Google App Engine, and NodeJS with optimized server configurations (along with Apache, Nginx, and IIS) and we’ve reduced the overall size of the published boilerplate by 50%.

Airco MB has a 15 years of experience in installing air conditioners, for cooling and heating. They focus especially on domestic installations. Here is their new logo !

by Paul Mestereaga

Consortio.ro e acum disponibil !

Consortio.ro va ofera posibilitatea crearii unui website de catre dumneavoastra ,exact asa cum va doriti, direct online!  Un site care sa va reprezinte afacerea, firma sau organizatia exact asa cum e ea! Scopul nostru principal este oferta unor site-uri de actualitate care sa iasa in evidenta si sa fie frumoase, cu multe caracteristici care sa amplifice imaginea dumneavoastra online! Scopul nostru secundar este crearea unei comunitati! Toate firmele si organizatiile membre ale Consortio.ro vor face parte din aceasta comunitate!

By Paul Mestereaga

CityRentals is a project which aims to put apartment and house owners offering a furnished place to rent together with someone looking for a place to stay. Soon on cityrentals.com !

by Paul Mestereaga

CrowdPicker is a service that provides simple and fast public opinion polls on business’s marketing and branding materials. Small businesses and start-ups will be able to conduct market testing on brand image and positioning unlike ever before.

By Paul Mestereaga

www.ilovefest.ro

Fellowship of evangelical students timisoara

www.ilovefest.ro

Isuse, acum venim
Sa ne inchinam
Tie sa iti dam
Tot ce-avem!

Doar la tine e iubire
La tine-i fericire
La tine e iubire
La tine-i fericire
Domnul meu

La crucea Ta venim
Isuse sa primim
Tot ce pana acum
In lume n-am gasit

Fericire si iubire
Esti Tu

De cate ori aici,
Am venit plangang…
Am venit sa pot,
Sa-ti cant!

Isuse-ncerc acum,
Sa ma gandesc pentru ce-a fost..
Si tot ce m-a facut,
Sa-ti cant!

Daca-ti cant
Ce-n rest eu nu traiesc
Daca Tu
La jertfa mea nu privesti

Asa ca…

Doamne iti aduc
In dar viata mea
Fiecare zi
I-a Ta

Cu viata mea
Iti cant si Tu ma asculti
Cu jertja mea
Iti cant din inima mea



“Arctic – reprezinta numele frigiderului cu care am crescut… si care m-a inspirat in ceea ce vreau sa fac… M-a dus cu gandul la tinutul inghetat de la Polul Nord…care toata lumea se chinuie acuma sa il pastreze cat mai mult si sa il fereasca de poluarea umana! Dar Dumnezeu a facut Polul Nord ca si plaman al Planetei Pamant…toti curentii de aer duc acolo…toata poluarea merge acolo…si de acolo pleaca curenti proaspeti pe intreaga planeta…si o simpla scadere a temperaturii ghetariilor cu o sutime de grad influenteaza clima intregii planete si creste temperatura globala! Tot asa trebuie sa fim si noi crestinii…nu trebuie sa stam separati de oamenii pacatosi…sa nu ne contaminam…ci sa fim plamanul intregii lumi…sa aducem viata intr-o lume plina de pacat…si tot ce trebuie sa facem e sa incercam sa ridicam standardul cu cate o sutime de grad…si o sa influentam viata Pamantului intreg in mod dramatic!
Sa spunem minunea Lui Isus… Cei flamanzi si insetati sa vina la El…si El le va da ODIHNA, PACE si VINDECARE!”

Versuri:

Tata vin naintea Ta
Acum sa ma inchin
Oh Tata, vin sa ma inchin

Tata vreau sa-Ti multumesc
Acum sa Te intalnesc
Oh Tata, Duhul Tau sa-mi dai

Doamne mai vreau azi rusalii
Doamne le vreau chiar acum

Tata fiul Ti-ai jertfit
Pe cruce a murit
Oh Tata, fiul Tau iubit

http://gh3o.wordpress.com/

And I have filled him with the spirit of God, in wisdom, and in understanding, and in knowledge, and in all manner of workmanship, To devise cunning works, to work in gold, and in silver, and in brass, And in cutting of stones, to set them, and in carving of timber, to work in all manner of workmanship.

Exod 31:3

Azi am lansat noul 7pulse.com ! Ce este 7 pulse? [sevenpulse]

Am plecat de la ideea ‘Inspira o generatie’ ..  si cred voi reusii in mare parte sa contribui la asta.  7pulse.com este o aplicatie ce genereaza in fiecare zi cate un verset biblic.  Aplicatia conectata la twitter iti da posibilitatea sa primesti versetul zilei in fiecare dimineata chiar pe telefonul mobil prin SMS ( celor din reteaua Vodafone ) si asta fara sa te coste abolut nimic ! Mai mult aplicatia exista si pe facebook sau o poti integra in site-ul sau blogul tau ! Acelasi verset in toate locurile ! Desigur aplicatia urmeaza sa fie dezvoltata mult mai mult pentru a avea cat mai  multe avantaje si cat mai multe de oferit !

Detalii pe www.7pulse.com

Very surprised!! Today going up escalator in the mall.. I saw again an ad.. the same ad that I talked about in the last post ! but this time very modified !! in the good way ! someone with a high sense of observation realized that something is not in order with the ad and took issue.. The ad was changed !! at least they repaired their misake.. zou can see now o real shadow .. although a lot of them remain unchanged..

Yesterday night in my way to Iulius Mall, waiting for the Express bus I saw an ad, and not any ad, but one 2m high which is anounceing a great opening of Deichmann shop in Timisoara.. I usually analize almost every ad that gets into my face.. and some really inspire me… but this one made me think a lot.. in a few seconds I noticed something that ruined everything.. I don’t know who create this ad.. but is really a beginner… and Deichmann really can afford that ? them who on the ad say that are number one in Europe !! And why I say that ? look closely.. the first picture I’ve made it with my phone, the second I found it on the web.. you really don’t notice? The shoes reflection.. says something to you!? Look closer to the shoe heel!! I tell you how he worked.. he copy and pasted the shoes, turn them upside down, gave them a fade and he thought he get done the job.. but it seems that he embarrassed the number 1 shoes company in Europe.. but I wonder how nobody noticed .. it was approved.. and released in the campaign.. What is your oppinion?