Skip to content

Commit 5556c9e

Browse files
bratchenkobratchenko
committed
initial template
1 parent 1e7fdb0 commit 5556c9e

21 files changed

+1232
-2
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules/*
2+
.DS_Store

‎Procfile

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
web: node app.js

‎README.md

+1-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
programmer-site
1+
Сайт программиста
22
===============
33

4-
Example site for programmer

‎app.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
var express = require('express');
2+
var app = express();
3+
4+
app.configure(function() {
5+
app.engine('html', require('uinexpress').__express) // Используем функцию "template" библиотеки underscore для рендеринга
6+
app.set('view engine', 'html')
7+
app.set('views', __dirname + "/tpl");
8+
app.set("view options", {layout: 'layout.html'}); // Файл layout.html по умолчанию будет оборачивать все шаблоны
9+
app.use(express.static(__dirname + "/public")); // Делаем файлы из папки public доступными на сайте
10+
});
11+
12+
app.get('/', function(req, res){ // Обрабатываем запрос корневой страницы "/"
13+
res.render('index.html');
14+
});
15+
app.get('/portfolio', function(req, res){ // Обрабатываем запрос страницы "/portfolio"
16+
res.render('portfolio.html');
17+
});
18+
19+
var port = process.env.PORT || 5000;
20+
app.listen(port) // Запускаем сервер на 5000 порту, если не указана переменная окружения "port"
21+
console.log("Listening at " + port) // Пишем в консоль, что запустились

‎package.json

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"name": "programmer-site",
3+
"version": "0.0.1",
4+
"engines": {
5+
"node": "0.8.x",
6+
"npm": "1.1.x"
7+
},
8+
"dependencies": {
9+
"express": "3.x",
10+
"uinexpress": "*"
11+
},
12+
"main": "app.js"
13+
}

‎public/css/bootstrap.min.css

+869
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎public/css/style.css

+63
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
@charset "utf-8";
2+
/* CSS Document */
3+
4+
@import url(http://fonts.googleapis.com/css?family=Dosis:400,700&subset=latin-ext,latin);
5+
6+
img {
7+
border:0;
8+
}
9+
10+
body {
11+
margin-top:40px;
12+
background-image:url(../img/back.png);
13+
}
14+
15+
.options {
16+
position:fixed;
17+
top:20%;
18+
left:0;
19+
background:#f2f2f2;
20+
color:#333;
21+
-webkit-border-top-right-radius: 10px;
22+
border-top-right-radius: 10px;
23+
-moz-border-radius-topright: 10px;
24+
-webkit-border-bottom-right-radius: 10px;
25+
border-bottom-right-radius: 10px;
26+
-moz-border-radius-bottomright: 10px;
27+
padding:5px;
28+
width:37px;
29+
border:5px solid #D7E0E9;
30+
border-left:none;
31+
}
32+
33+
#photo {
34+
display: block;
35+
float: left;
36+
background: #fcfeff;
37+
margin-left: 30px;
38+
border: 10px solid #fff;
39+
-webkit-box-shadow: 0px 1px 3px #ababab;
40+
-moz-box-shadow: 0px 1px 3px #ababab;
41+
box-shadow: 0px 1px 3px #ababab;
42+
}
43+
44+
#data {
45+
float:left;
46+
padding-left:20px;
47+
}
48+
49+
#social {
50+
float:right;
51+
}
52+
53+
a.facebook:link, a.facebook:active, a.facebook:visited {
54+
background-image:url(../img/facebookpb.png);
55+
width:30px;
56+
height:30px;
57+
}
58+
59+
a.facebook:hover {
60+
background-image:url(../img/facebook.png);
61+
width:30px;
62+
height:30px;
63+
}

‎public/img/back.png

5.09 KB
Loading

‎public/img/download.png

50.9 KB
Loading

‎public/img/facebook.png

52.1 KB
Loading

‎public/img/glyphicons-halflings-white.png

8.57 KB
Loading

‎public/img/glyphicons-halflings.png

13.5 KB
Loading

‎public/img/google.png

55.5 KB
Loading

‎public/img/print.png

50.9 KB
Loading

‎public/img/twitter.png

52.4 KB
Loading

‎public/img/user.png

170 KB
Loading

‎public/img/youtube.png

55.2 KB
Loading

‎public/js/bootstrap.min.js

+6
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎tpl/index.html

+144
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,144 @@
1+
<div class="row">
2+
<div class="span4">
3+
<h2>Professional profile</h2>
4+
</div>
5+
<div class="span8">
6+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in mi justo. Duis eu lectus turpis. Sed a tortor lacus. Nam nec ultricies nunc. Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo. Mauris metus metus, sollicitudin eu tincidunt eget, imperdiet dapibus quam.</p>
7+
<ul>
8+
<li>Vivamus congue massa et diam ullamcorper ultricies.</li>
9+
<li>Quisque lobortis feugiat ipsum, lacinia sagittis augue consectetur at.</li>
10+
<li>Vestibulum pharetra nisl eros, vel iaculis justo.</li>
11+
</ul>
12+
</div>
13+
</div>
14+
<hr>
15+
<div class="row">
16+
<div class="span4">
17+
<h2>Work experience</h2>
18+
</div>
19+
<div class="span8">
20+
21+
<div class="row">
22+
<div class="span4">
23+
<h3>Front End Developer</h3>
24+
<h6>Studio Web, Full-Time</h6>
25+
<p style="margin-top:40px;"><strong>Period: </strong> July 2001 - Present day</p>
26+
<p><strong>Primary functions: </strong>Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo.</p>
27+
<p><strong>References: </strong>George Smith</p>
28+
</div>
29+
<div class="span4">
30+
<p>Duis eu lectus turpis. Sed a tortor lacus. Nam nec ultricies nunc. Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo. Mauris metus metus, sollicitudin eu tincidunt eget, imperdiet dapibus quam.</p>
31+
<ul>
32+
<li>Vivamus congue massa et diam ullamcorper ultricies.</li>
33+
<li>Quisque lobortis feugiat ipsum, lacinia sagittis augue consectetur at.</li>
34+
<li>Vestibulum pharetra nisl eros, vel iaculis justo.</li>
35+
</ul>
36+
</div>
37+
</div>
38+
39+
<hr>
40+
41+
<div class="row">
42+
<div class="span4">
43+
<h3>Front End Developer</h3>
44+
<h6>Studio Web, Full-Time</h6>
45+
<p style="margin-top:40px;"><strong>Period: </strong> July 2001 - Present day</p>
46+
<p><strong>Primary functions: </strong>Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo.</p>
47+
<p><strong>References: </strong>George Smith</p>
48+
</div>
49+
<div class="span4">
50+
<p>Duis eu lectus turpis. Sed a tortor lacus. Nam nec ultricies nunc. Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo. Mauris metus metus, sollicitudin eu tincidunt eget, imperdiet dapibus quam.</p>
51+
<ul>
52+
<li>Vivamus congue massa et diam ullamcorper ultricies.</li>
53+
<li>Quisque lobortis feugiat ipsum, lacinia sagittis augue consectetur at.</li>
54+
<li>Vestibulum pharetra nisl eros, vel iaculis justo.</li>
55+
</ul>
56+
</div>
57+
</div>
58+
59+
</div>
60+
61+
</div>
62+
<hr>
63+
<div class="row">
64+
<div class="span4">
65+
<h2>Education</h2>
66+
</div>
67+
<div class="span8">
68+
<h3>FATEC - State College of Sorocaba</h3>
69+
<h6>Analysys and Systems development</h6>
70+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec in mi justo. Duis eu lectus turpis. Sed a tortor lacus. Nam nec ultricies nunc. Aliquam porta, elit ac condimentum pretium, sapien quam tempor augue, a placerat enim diam interdum leo.</p>
71+
</div>
72+
</div>
73+
<hr>
74+
<div class="row">
75+
<div class="span4">
76+
<h2>Technical skill</h2>
77+
</div>
78+
<div class="span8">
79+
<table class="table">
80+
<thead>
81+
<tr>
82+
<th colspan="2"><h3>Programming</h3></th>
83+
<th colspan="2"><h3>Design Tools</h3></th>
84+
</tr>
85+
</thead>
86+
<tbody>
87+
<tr>
88+
<td width="25%">HTML 5</td>
89+
<td width="25%">
90+
<div class="progress progress-info">
91+
<div class="bar" style="width: 40%;"></div>
92+
</div>
93+
</td>
94+
<td width="25%">Photoshop</td>
95+
<td width="25%">
96+
<div class="progress progress-info">
97+
<div class="bar" style="width: 90%;"></div>
98+
</div>
99+
</td>
100+
</tr>
101+
<tr>
102+
<td width="25%">CSS3</td>
103+
<td width="25%">
104+
<div class="progress progress-info">
105+
<div class="bar" style="width: 80%;"></div>
106+
</div>
107+
</td>
108+
<td width="25%">InDesign</td>
109+
<td width="25%">
110+
<div class="progress progress-info">
111+
<div class="bar" style="width: 50%;"></div>
112+
</div>
113+
</td>
114+
</tr>
115+
<tr>
116+
<td width="25%">Javascript</td>
117+
<td width="25%">
118+
<div class="progress progress-info">
119+
<div class="bar" style="width: 85%;"></div>
120+
</div>
121+
</td>
122+
<td width="25%">Corel Draw</td>
123+
<td width="25%">
124+
<div class="progress progress-info">
125+
<div class="bar" style="width: 90%;"></div>
126+
</div>
127+
</td>
128+
</tr>
129+
<tr>
130+
<td width="25%">PHP 5</td>
131+
<td width="25%">
132+
<div class="progress progress-info">
133+
<div class="bar" style="width: 70%;"></div>
134+
</div>
135+
</td>
136+
<td width="25%">&nbsp;</td>
137+
<td width="25%">&nbsp;
138+
139+
</td>
140+
</tr>
141+
</tbody>
142+
</table>
143+
</div>
144+
</div>

‎tpl/layout.html

+66
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
2+
<!DOCTYPE html>
3+
<html>
4+
<head>
5+
<meta charset="utf-8">
6+
<title>Programmer's site</title>
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<meta name="author" content="Rafael de Mello">
9+
<link href="/css/bootstrap.min.css" rel="stylesheet">
10+
<link href="/css/style.css" rel="stylesheet">
11+
<script src="/js/bootstrap.min.js"></script>
12+
</head>
13+
<body>
14+
<div class="options">
15+
<a href="#" class="tooltip-test" onclick="javascript:window.print();" data-original-title="Print CV"><img src="img/print.png" border="0"></a>
16+
<a href="#" class="tooltip-test" data-original-title="Download"><img src="img/download.png"></a>
17+
</div>
18+
<div class="container well">
19+
<div class="row">
20+
<div class="span12">
21+
<div id="photo"><img src="img/user.png" width="186px"></div>
22+
<div id="data">
23+
<table class="table">
24+
<tbody>
25+
<tr>
26+
<td><h3>Birth</h3></td>
27+
<td>05 June 1984</td>
28+
</tr>
29+
<tr>
30+
<td><h3>Address</h3></td>
31+
<td>150 5th Avenue, NY</td>
32+
</tr>
33+
<tr>
34+
<td><h3>Phone</h3></td>
35+
<td>15 3333-8854</td>
36+
</tr>
37+
<tr>
38+
<td><h3>Mail</h3></td>
39+
<td>[email protected]</td>
40+
</tr>
41+
</tbody>
42+
</table>
43+
</div>
44+
<div id="social">
45+
<a href="#" class="tooltip-test" data-original-title="Facebook"><img src="img/facebook.png"></a>
46+
<a href="#" class="tooltip-test" data-original-title="Google +"><img src="img/google.png"></a>
47+
<a href="#" class="tooltip-test" data-original-title="Twitter"><img src="img/twitter.png"></a>
48+
<a href="#" class="tooltip-test" data-original-title="Youtube"><img src="img/youtube.png"></a>
49+
</div>
50+
</div>
51+
</div>
52+
</div>
53+
54+
<div class="container well">
55+
<div class="row">
56+
<div class="span12">
57+
<h1 class="pull-right"><a href="/">Resume</a> | <a href="/portfolio">Portfolio</a> </h1>
58+
</div>
59+
</div>
60+
</div>
61+
62+
<div class="container well">
63+
<%=body%>
64+
</div>
65+
</body>
66+
</html>

‎tpl/portfolio.html

+46
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<div class="row">
2+
<div class="span12">
3+
<h2>Portfolio</h2>
4+
<div id="galeria">
5+
<ul class="thumbnails">
6+
<li class="span4">
7+
<div class="thumbnail">
8+
<a href="http://placehold.it/360x268" title="Description of image here">
9+
<img src="http://placehold.it/360x268" >
10+
</a>
11+
<div class="caption">
12+
<h5>Thumbnail label</h5>
13+
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
14+
<p><button class="btn btn-primary btn-mini">Read more</button></p>
15+
</div>
16+
</div>
17+
</li>
18+
<li class="span4">
19+
<div class="thumbnail">
20+
<a href="http://placehold.it/360x268" title="Description of image here">
21+
<img src="http://placehold.it/360x268" >
22+
</a>
23+
<div class="caption">
24+
<h5>Thumbnail label</h5>
25+
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
26+
<p><button class="btn btn-primary btn-mini">Read more</button></p>
27+
</div>
28+
</div>
29+
</li>
30+
31+
<li class="span4">
32+
<div class="thumbnail">
33+
<a href="http://placehold.it/360x268" title="Description of image here">
34+
<img src="http://placehold.it/360x268" >
35+
</a>
36+
<div class="caption">
37+
<h5>Thumbnail label</h5>
38+
<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
39+
<p><button class="btn btn-primary btn-mini">Read more</button></p>
40+
</div>
41+
</div>
42+
</li>
43+
</ul>
44+
</div>
45+
</div>
46+
</div>

0 commit comments

Comments
 (0)