Update with initial style implementation

This commit is contained in:
Craig Davis 2012-03-04 13:35:34 -06:00
parent f4c52ac4c9
commit c8a859265b
8 changed files with 1984 additions and 18 deletions

136
assets/css/elements.less Executable file
View File

@ -0,0 +1,136 @@
/*---------------------------------------------------
LESS Elements 0.6
---------------------------------------------------
A set of useful LESS mixins by Dmitry Fadeyev
Special thanks for mixin suggestions to:
Kris Van Herzeele,
Benoit Adam,
Portenart Emile-Victor,
Ryan Faerman
More info at: http://lesselements.com
-----------------------------------------------------*/
.gradient(@color: #F5F5F5, @start: #EEE, @stop: #FFF) {
background: @color;
background: -webkit-gradient(linear,
left bottom,
left top,
color-stop(0, @start),
color-stop(1, @stop));
background: -ms-linear-gradient(bottom,
@start,
@stop);
background: -moz-linear-gradient(center bottom,
@start 0%,
@stop 100%);
}
.bw-gradient(@color: #F5F5F5, @start: 0, @stop: 255) {
background: @color;
background: -webkit-gradient(linear,
left bottom,
left top,
color-stop(0, rgb(@start,@start,@start)),
color-stop(1, rgb(@stop,@stop,@stop)));
background: -ms-linear-gradient(bottom,
rgb(@start,@start,@start) 0%,
rgb(@start,@start,@start) 100%);
background: -moz-linear-gradient(center bottom,
rgb(@start,@start,@start) 0%,
rgb(@stop,@stop,@stop) 100%);
}
.bordered(@top-color: #EEE, @right-color: #EEE, @bottom-color: #EEE, @left-color: #EEE) {
border-top: solid 1px @top-color;
border-left: solid 1px @left-color;
border-right: solid 1px @right-color;
border-bottom: solid 1px @bottom-color;
}
.drop-shadow(@x-axis: 0, @y-axis: 1px, @blur: 2px, @alpha: 0.1) {
-webkit-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
-moz-box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
box-shadow: @x-axis @y-axis @blur rgba(0, 0, 0, @alpha);
}
.rounded(@radius: 2px) {
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
border-radius: @radius;
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.border-radius(@topright: 0, @bottomright: 0, @bottomleft: 0, @topleft: 0) {
-webkit-border-top-right-radius: @topright;
-webkit-border-bottom-right-radius: @bottomright;
-webkit-border-bottom-left-radius: @bottomleft;
-webkit-border-top-left-radius: @topleft;
-moz-border-radius-topright: @topright;
-moz-border-radius-bottomright: @bottomright;
-moz-border-radius-bottomleft: @bottomleft;
-moz-border-radius-topleft: @topleft;
border-top-right-radius: @topright;
border-bottom-right-radius: @bottomright;
border-bottom-left-radius: @bottomleft;
border-top-left-radius: @topleft;
-moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.opacity(@opacity: 0.5) {
-moz-opacity: @opacity;
-khtml-opacity: @opacity;
-webkit-opacity: @opacity;
opacity: @opacity;
}
.transition-duration(@duration: 0.2s) {
-moz-transition-duration: @duration;
-webkit-transition-duration: @duration;
transition-duration: @duration;
}
.rotation(@deg:5deg){
-webkit-transform: rotate(@deg);
-moz-transform: rotate(@deg);
transform: rotate(@deg);
}
.scale(@ratio:1.5){
-webkit-transform:scale(@ratio);
-moz-transform:scale(@ratio);
transform:scale(@ratio);
}
.transition(@duration:0.2s, @ease:ease-out) {
-webkit-transition: all @duration @ease;
-moz-transition: all @duration @ease;
transition: all @duration @ease;
}
.inner-shadow(@horizontal:0, @vertical:1px, @blur:2px, @alpha: 0.4) {
-webkit-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
-moz-box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
box-shadow: inset @horizontal @vertical @blur rgba(0, 0, 0, @alpha);
}
.box-shadow(@arguments) {
-webkit-box-shadow: @arguments;
-moz-box-shadow: @arguments;
box-shadow: @arguments;
}
.columns(@colwidth: 250px, @colcount: 0, @colgap: 50px, @columnRuleColor: #EEE, @columnRuleStyle: solid, @columnRuleWidth: 1px) {
-moz-column-width: @colwidth;
-moz-column-count: @colcount;
-moz-column-gap: @colgap;
-moz-column-rule-color: @columnRuleColor;
-moz-column-rule-style: @columnRuleStyle;
-moz-column-rule-width: @columnRuleWidth;
-webkit-column-width: @colwidth;
-webkit-column-count: @colcount;
-webkit-column-gap: @colgap;
-webkit-column-rule-color: @columnRuleColor;
-webkit-column-rule-style: @columnRuleStyle;
-webkit-column-rule-width: @columnRuleWidth;
column-width: @colwidth;
column-count: @colcount;
column-gap: @colgap;
column-rule-color: @columnRuleColor;
column-rule-style: @columnRuleStyle;
column-rule-width: @columnRuleWidth;
}
.translate(@x:0, @y:0) {
-moz-transform: translate(@x, @y);
-webkit-transform: translate(@x, @y);
-o-transform: translate(@x, @y);
-ms-transform: translate(@x, @y);
transform: translate(@x, @y);
}

View File

@ -1,2 +0,0 @@
@import url("css/normalize.css");
@import url("css/style.css");

View File

@ -1 +1,176 @@
body { font-family: Georgia; color: #444; }
.clearfix {
zoom: 1;
&:after {
display: block;
visibility: hidden;
height: 0;
clear: both;
content: ".";
}
}
body {
font-family: Georgia;
color: #444;
padding: 2em 0;
}
.container {
width: 1000px;
margin: 0 auto;
padding: 0;
background: whiteSmoke;
border: solid #666;
border-width: 8px 0 2px 0;
text-align: left;
}
.resume {
position:relative;
padding: 40px 80px;
}
a {
color: #990003;
}
a[href$='.pdf'] {
display: inline-block;
background: #666;
color: white;
padding: 6px 50px 6px 12px;
margin-bottom: 6px;
text-decoration: none;
}
blockquote {
top: 0;
right: 0;
position: absolute;
}
hr {
display: block;
position: relative;
padding: 0;
margin: 18px auto;
width: 100%;
clear: both;
border: none;
border-top: 1px solid #CCC;
font-size: 1px;
line-height: 0;
overflow: visible;
}
h1 {
margin: 0;
padding: 0;
font-size: 48px;
text-transform: uppercase;
letter-spacing: 3px;
font-weight: normal;
}
h2 {
margin: 0;
padding: 0;
text-transform: uppercase;
font-style: italic;
letter-spacing: 2px;
font-weight: normal;
}
h3 {
float: left;
width: 25%;
margin: 0;
padding: 0;
font-style: italic;
font-weight: normal;
}
h3+p {
margin: 0 0 16px; padding: 0;
float: left;
width: 75%;
display: block;
font-size: 104%;
line-height: 24px;
}
ul {
margin: 0;
padding: 0;
list-style: none;
}
ul li {
width: 25%;
margin: 0;
padding: 0;
float: left;
}
ul dl {
margin: 0;
padding: 0;
dt {
font-size: 122%;
margin-bottom: .25em;
}
dd {
margin: 0 0 1em;
padding: .5em 3em 0 0;
font-size: .8em;
line-height: 1.5em;
}
}
ol {
margin: 0;
padding: 0;
width: 75%;
display: inline-block;
}
ol li {
margin: 0;
padding: 0;
border-top: 1px solid #CCCCCC;
width: 33%;
float: left;
list-style: none;
line-height: 24px;
font-size: 14px;
}
ol li:nth-child(1), ol li:nth-child(2), ol li:nth-child(3) {
border-top: none;
}
dl {
display: inline-block;
width: 75%;
dt {
font-size: 150%;
}
dd {
margin: 0 0 1.5em;
padding: 0;
font-size: 80%;
}
strong {
float: right;
margin-top: -3em;
}
em {
display: block;
font-size: 130%;
margin-bottom: .5em;
font-style: normal;
}
}

View File

@ -15,8 +15,10 @@
<body>
<div class="container">
<div class="resume">
{{{resume}}}
</div>
</div>
</body>
</html>

View File

@ -20,6 +20,8 @@ include_once APPLICATION_BASE_PATH . '/vendor/Mustache/Mustache.php';
include_once APPLICATION_BASE_PATH . '/vendor/smartypants/smartypants.php';
include_once APPLICATION_BASE_PATH . '/vendor/markdown-extra/markdown.php';
include_once APPLICATION_BASE_PATH . '/vendor/lessphp/lessc.inc.php';
include_once APPLICATION_BASE_PATH . '/vendor/simpledom/simple_html_dom.php';
use Assetic\Asset\AssetCollection;
use Assetic\Asset\FileAsset;
@ -56,15 +58,21 @@ $style = $css->dump();
$template = file_get_contents(APPLICATION_BASE_PATH . '/assets/templates/default.html');
$resume = file_get_contents(APPLICATION_BASE_PATH . '/resume/resume.md');
$resume = Markdown($resume);
$resume = SmartyPants($resume);
$html = str_get_html($resume);
$title = sprintf(
'%s | %s',
$html->find('h1', 0)->innertext,
$html->find('h2', 0)->innertext
);
$m = new Mustache;
$rendered = $m->render(
$template,
array(
'title' => 'TITLE',
'title' => $title,
'style' => $style,
'resume' => $resume,
'reload' => $refresh_dev

View File

@ -2,9 +2,8 @@
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="refresh" content="2">
<title>TITLE</title>
<title>Craig Davis | Senior PHP Developer, UX Director</title>
<style type="text/css">
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display:block; }
audio, canvas, video {
@ -144,12 +143,153 @@ table {
border-spacing:0;
}
@import url("css/normalize.css");
@import url("css/style.css");
.clearfix { zoom:1; }
.clearfix:after {
display:block;
visibility:hidden;
height:0;
clear:both;
content:".";
}
body {
font-family:Georgia;
color:#444444;
padding:2em 0;
}
.container {
width:1000px;
margin:0 auto;
padding:0;
background:whiteSmoke;
border:solid #666666;
border-width:8px 0 2px 0;
text-align:left;
}
.resume {
position:relative;
padding:40px 80px;
}
a { color:#990003; }
a[href$='.pdf'] {
display:inline-block;
background:#666666;
color:white;
padding:6px 50px 6px 12px;
margin-bottom:6px;
text-decoration:none;
}
blockquote {
top:0;
right:0;
position:absolute;
}
hr {
display:block;
position:relative;
padding:0;
margin:18px auto;
width:100%;
clear:both;
border:none;
border-top:1px solid #cccccc;
font-size:1px;
line-height:0;
overflow:visible;
}
h1 {
margin:0;
padding:0;
font-size:48px;
text-transform:uppercase;
letter-spacing:3px;
font-weight:normal;
}
h2 {
margin:0;
padding:0;
text-transform:uppercase;
font-style:italic;
letter-spacing:2px;
font-weight:normal;
}
h3 {
float:left;
width:25%;
margin:0;
padding:0;
font-style:italic;
font-weight:normal;
}
h3+p {
margin:0 0 16px;
padding:0;
float:left;
width:75%;
display:block;
font-size:104%;
line-height:24px;
}
ul {
margin:0;
padding:0;
list-style:none;
}
ul li {
width:25%;
margin:0;
padding:0;
float:left;
}
ul dl {
margin:0;
padding:0;
}
ul dl dt {
font-size:122%;
margin-bottom:.25em;
}
ul dl dd {
margin:0 0 1em;
padding:.5em 3em 0 0;
font-size:.8em;
line-height:1.5em;
}
ol {
margin:0;
padding:0;
width:75%;
display:inline-block;
}
ol li {
margin:0;
padding:0;
border-top:1px solid #cccccc;
width:33%;
float:left;
list-style:none;
line-height:24px;
font-size:14px;
}
ol li:nth-child(1), ol li:nth-child(2), ol li:nth-child(3) { border-top:none; }
dl {
display:inline-block;
width:75%;
}
dl dt { font-size:150%; }
dl dd {
margin:0 0 1.5em;
padding:0;
font-size:80%;
}
dl strong {
float:right;
margin-top:-3em;
}
dl em {
display:block;
font-size:130%;
margin-bottom:.5em;
font-style:normal;
}
</style>
@ -158,13 +298,77 @@ body {
<body>
<div class="container">
<div class="resume">
<h1>Craig Davis</h1>
<h2>Senior PHP Developer</h2>
<h2>Senior PHP Developer, UX Director</h2>
<p>craig@there4development.com
(704) 724-3235</p>
<blockquote>
<p><a href="resume.pdf">Download PDF</a><br />
<a href="craig@there4development.com">craig@there4development.com</a><br />
(999) 888-7777</p>
</blockquote>
<hr />
<h3 id="profile">Profile</h3>
<p>Progressively evolve cross-platform ideas before impactful infomediaries. Energistically visualize tactical initiatives before cross-media catalysts for change.</p>
<hr />
<h3 id="skills">Skills</h3>
<ul>
<li><dl>
<dt>Web Design</dt>
<dd>Assertively exploit wireless initiatives rather than synergistic core competencies.</dd>
</dl></li>
<li><dl>
<dt>Interface Design</dt>
<dd>Credibly streamline mission-critical value with multifunctional functionalities.</dd>
</dl></li>
<li><dl>
<dt>Project Direction</dt>
<dd>Proven ability to lead and manage a wide variety of design and development projects in team and independent situations.</dd>
</dl></li>
</ul>
<hr />
<h3 id="technical">Technical</h3>
<ol>
<li>XHTML</li>
<li>CSS</li>
<li>Javascript</li>
<li>Jquery</li>
<li>PHP</li>
<li>CVS / Subversion</li>
<li>OS X</li>
<li>Windows XP/Vista</li>
<li>Linux</li>
</ol>
<hr />
<h3 id="experience">Experience</h3>
<dl>
<dt>Microsoft</dt>
<dd><em>Principal and Creative Lead</em>
<strong>2004-2005</strong>
Intrinsicly transform flexible manufactured products without excellent intellectual capital. Energistically evisculate orthogonal architectures through covalent action items. Assertively incentivize sticky platforms without synergistic materials.</dd>
<dt>International Business Machines (IBM)</dt>
<dd><em>Lead Web Designer</em>
<strong>2001-2004</strong>
Globally re-engineer cross-media schemas through viral methods of empowerment. Proactively grow long-term high-impact human capital and highly efficient innovation. Intrinsicly iterate excellent e-tailers with timely e-markets.</dd>
</dl>
<hr />
</div>
</div>
</body>

View File

@ -1,5 +1,55 @@
# Craig Davis
## Senior PHP Developer
## Senior PHP Developer, UX Director
craig@there4development.com
(704) 724-3235
> [Download PDF](resume.pdf)
> [craig@there4development.com](craig@there4development.com)
> (999) 888-7777
------
### Profile {#profile}
Progressively evolve cross-platform ideas before impactful infomediaries. Energistically visualize tactical initiatives before cross-media catalysts for change.
------
### Skills {#skills}
* Web Design
: Assertively exploit wireless initiatives rather than synergistic core competencies.
* Interface Design
: Credibly streamline mission-critical value with multifunctional functionalities.
* Project Direction
: Proven ability to lead and manage a wide variety of design and development projects in team and independent situations.
-------
### Technical {#technical}
1. XHTML
1. CSS
1. Javascript
1. Jquery
1. PHP
1. CVS / Subversion
1. OS X
1. Windows XP/Vista
1. Linux
------
### Experience {#experience}
Microsoft
: *Principal and Creative Lead*
__2004-2005__
Intrinsicly transform flexible manufactured products without excellent intellectual capital. Energistically evisculate orthogonal architectures through covalent action items. Assertively incentivize sticky platforms without synergistic materials.
International Business Machines (IBM)
: *Lead Web Designer*
__2001-2004__
Globally re-engineer cross-media schemas through viral methods of empowerment. Proactively grow long-term high-impact human capital and highly efficient innovation. Intrinsicly iterate excellent e-tailers with timely e-markets.
------

1393
vendor/simpledom/simple_html_dom.php vendored Executable file

File diff suppressed because it is too large Load Diff