potato/website
1
0
Fork 0
Code Pull Requests Actions Packages Releases Activity

Incorporated feedback from webdevRefinery.

Browse Source
This commit is contained in:
Ian Adam Naval 2014-01-28 01:50:46 -05:00
parent 77e91c4b68
commit e6e440d9cd
8 changed files with 87 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/static/css/portfolio.css
View File

@ -37,7 +37,7 @@
text-align: center; text-align: center;
background-color: #e8e8e8; background-color: #e8e8e8;
color: #000; color: #000;
box-shadow: 4px 4px 6px #000; box-shadow: 2px 2px 10px #0F0907;
flex: 1 0 auto; } flex: 1 0 auto; }
.portfolio-item p { .portfolio-item p {
margin: 0; margin: 0;
@ -45,10 +45,31 @@
/* iPhone */ /* iPhone */
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) { @media only screen and (min-device-width: 320px) and (max-device-width: 568px) {
#header {
font-size: .8em; }
.section {
padding: 8px; }
.about-section {
margin: 0;
max-width: 288px; }
.about-section ul {
padding: 0;
list-style: none; }
.portfolio-items {
padding: 0; }
.portfolio-item { .portfolio-item {
margin: 8px 0 0;
width: 256px; } width: 256px; }
#calendar { .technology-list img {
width: 100%; }
#calendar, #calendar-label {
display: none; } } display: none; } }
.screenshot { .screenshot {
margin: 0; margin: 0;
@ -58,7 +79,8 @@
#calendar { #calendar {
width: 100%; width: 100%;
max-width: 1320px; max-width: 1320px;
height: 480px; } height: 480px;
border: 0; }
/* Force image on its own line for two-column layout */ /* Force image on its own line for two-column layout */
@media only screen and (min-width: 691px) and (max-width: 1054px) { @media only screen and (min-width: 691px) and (max-width: 1054px) {

32
src/static/css/portfolio.scss
View File

@ -46,7 +46,7 @@
text-align: center; text-align: center;
background-color: #e8e8e8; background-color: #e8e8e8;
color: #000; color: #000;
box-shadow: 4px 4px 6px #000; box-shadow: 2px 2px 10px #0F0907;
flex: 1 0 auto; flex: 1 0 auto;
p { p {
@ -59,11 +59,38 @@
@media only screen @media only screen
and (min-device-width : 320px) and (min-device-width : 320px)
and (max-device-width : 568px) { and (max-device-width : 568px) {
#header {
font-size: .8em;
}
.section {
padding: 8px;
}
.about-section {
margin: 0;
max-width: 288px;
}
.about-section ul {
padding: 0;
list-style: none;
}
.portfolio-items {
padding: 0;
}
.portfolio-item { .portfolio-item {
margin: 8px 0 0;
width: 256px; width: 256px;
} }
#calendar { .technology-list img {
width: 100%;
}
#calendar, #calendar-label {
display: none; display: none;
} }
} }
@ -78,6 +105,7 @@ and (max-device-width : 568px) {
width: 100%; width: 100%;
max-width: 1320px; max-width: 1320px;
height: 480px; height: 480px;
border: 0;
} }
/* Force image on its own line for two-column layout */ /* Force image on its own line for two-column layout */

22
src/static/css/style.css
View File

@ -16,7 +16,7 @@ h1, h2, h3, h4 {
/* Header */ /* Header */
#header { #header {
margin: 0; margin: 0;
padding: 16px; padding: 16px 0 0;
text-align: center; text-align: center;
background: #222; background: #222;
color: #0f0; color: #0f0;
@ -30,16 +30,19 @@ h1, h2, h3, h4 {
} }
#tagline { #tagline {
margin: 0; margin: 0 auto;
padding: 0 0 8px;
font-size: .9em; font-size: .9em;
color: #39e639; color: #72bbfa;
border-bottom: 1px solid #fff;
width: 304px;
} }
/* Navigation */ /* Navigation */
#nav { #nav {
width: 100%; width: 100%;
margin: 16px 0 0; margin: 8px 0 0;
padding: 0; padding: 0;
text-align: center; text-align: center;
} }
@ -52,13 +55,17 @@ h1, h2, h3, h4 {
} }
#nav li { #nav li {
/*width: 61px;*/
margin: 0;
display: inline-block; display: inline-block;
list-style: none; list-style: none;
padding: 0 1em 0; padding: 4px 8px;
background-color: #fff;
border-radius: 2px 2px 0 0;
} }
#nav a { #nav a {
color: #b9f73e; color: #428bca;
} }
/* Main body */ /* Main body */
@ -95,6 +102,7 @@ h1, h2, h3, h4 {
margin: 0; margin: 0;
padding: .5em; padding: .5em;
clear: both; clear: both;
background: #fff; background: #222;
color: #fff;
font-size: 1em; font-size: 1em;
} }

BIN
src/static/img/ian-280.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

0
src/static/img/ian.jpg → src/static/img/ian-original.jpg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 68 KiB

After

Width:  |  Height:  |  Size: 68 KiB

10
src/templates/base.html
View File

@ -8,17 +8,15 @@
<meta name="description" content="Portfolio for software engineer and sysadmin Ian Adam Naval."> <meta name="description" content="Portfolio for software engineer and sysadmin Ian Adam Naval.">
<meta name="author" content="Ian Adam Naval"> <meta name="author" content="Ian Adam Naval">
<meta name="robots" content="index,follow"> <meta name="robots" content="index,follow">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet" type="text/css" media="screen" /> <link href="{{ url_for('static', filename='css/style.css') }}" rel="stylesheet" type="text/css" media="screen" />
{% block extrastyle %}{% endblock extrastyle %} {% block extrastyle %}{% endblock extrastyle %}
<script src="{{ url_for('static', filename='lib/modernizr.js') }}"></script>
</head> </head>
<body> <body>
<header id="header"> <header id="header">
<h1 id="name">Ian Adam Naval</h1> <h1 id="name">Ian Adam Naval</h1>
<span id="tagline">Software engineer/sysadmin from Los Angeles, CA</span> <div id="tagline">Software engineer/sysadmin</div>
<nav id="nav"> <nav id="nav">
<ul> <ul>
<li><a href="{{ url_for('home') }}#portfolio">Portfolio</a></li> <li><a href="{{ url_for('home') }}#portfolio">Portfolio</a></li>
@ -38,6 +36,7 @@
{% block footer %}Copyright &copy; 2014 Ian Adam Naval. All rights reserved.{% endblock footer %} {% block footer %}Copyright &copy; 2014 Ian Adam Naval. All rights reserved.{% endblock footer %}
</footer> </footer>
<script src="{{ url_for('static', filename='lib/modernizr.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
var _gaq = _gaq || []; var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-33981209-1']); _gaq.push(['_setAccount', 'UA-33981209-1']);
@ -49,5 +48,6 @@
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})(); })();
</script> </script>
</body> </body>
</html> </html>

22
src/templates/index.html
View File

@ -4,7 +4,7 @@
{% block main %} {% block main %}
<div id="about" class="section center-wrapper"> <div id="about" class="section center-wrapper">
<img id="me" src="{{ url_for('static', filename='img/ian.jpg') }}" alt="Picture of Ian Naval" class="center-wrapped" /> <img id="me" src="{{ url_for('static', filename='img/ian-280.jpg') }}" alt="Picture of Ian Naval" class="center-wrapped" />
<div id="skills-and-facts" class="about-section center-wrapped"> <div id="skills-and-facts" class="about-section center-wrapped">
<h3>Skills</h3> <h3>Skills</h3>
@ -33,11 +33,11 @@
</div> </div>
</div> </div>
<div id="portfolio" class="section"> <div id="portfolio" class="section center-wrapper">
<h2>Portfolio</h2> <h2>Portfolio</h2>
<div id="resume"><a class="button" href='http://files.ianonavy.com/resume.pdf'>View Résumé</a></div> <div id="resume"><a class="button" href='http://files.ianonavy.com/resume.pdf'>View Résumé</a></div>
<div id="portfolio-items" class="center-wrapper"> <div id="portfolio-items" class="">
<div class="portfolio-item center-wrapped"> <div class="portfolio-item center-wrapped">
<a href="http://mirrors.acm.wpi.edu/"><img src="{{ url_for('static', filename='img/mirrors.png') }}" alt="WPI ACM Mirrors screenshot" class="screenshot"></a> <a href="http://mirrors.acm.wpi.edu/"><img src="{{ url_for('static', filename='img/mirrors.png') }}" alt="WPI ACM Mirrors screenshot" class="screenshot"></a>
@ -57,6 +57,12 @@
<p>Helps restore Android texts from Google Voice.</p> <p>Helps restore Android texts from Google Voice.</p>
</div> </div>
<div class="portfolio-item center-wrapped">
<a href="http://potatoipsum.com/"><img src="{{ url_for('static', filename='img/potatoipsum.png') }}" alt="Potato Ipsum screenshot" class="screenshot"></a>
<h3>Potato Ipsum</h3>
<p>Lorem ipsum generator. With potatoes.</p>
</div>
<div class="portfolio-item center-wrapped"> <div class="portfolio-item center-wrapped">
<a href="https://play.google.com/store/apps/details?id=com.mathhammer40k.mathhammer&amp;hl=en"><img src="{{ url_for('static', filename='img/mathhammer.png') }}" alt="MathHammer screenshot" class="screenshot"></a> <a href="https://play.google.com/store/apps/details?id=com.mathhammer40k.mathhammer&amp;hl=en"><img src="{{ url_for('static', filename='img/mathhammer.png') }}" alt="MathHammer screenshot" class="screenshot"></a>
<h3>MathHammer 40k</h3> <h3>MathHammer 40k</h3>
@ -68,21 +74,13 @@
<h3>SMSpammer</h3> <h3>SMSpammer</h3>
<p>App for spamming text messages. <span class="cheeky-aside">(With permission.)</span></p> <p>App for spamming text messages. <span class="cheeky-aside">(With permission.)</span></p>
</div> </div>
<div class="portfolio-item center-wrapped">
<a href="http://potatoipsum.com/"><img src="{{ url_for('static', filename='img/potatoipsum.png') }}" alt="Potato Ipsum screenshot" class="screenshot"></a>
<h3>Potato Ipsum</h3>
<p>Lorem ipsum generator. With potatoes.</p>
</div>
</div> </div>
</div> </div>
<div id="contact" class="section"> <div id="contact" class="section center-wrapper">
<h2>Contact</h2> <h2>Contact</h2>
<p>Information is on my <a href='http://files.ianonavy.com/resume.pdf'>résumé</a>.</p> <p>Information is on my <a href='http://files.ianonavy.com/resume.pdf'>résumé</a>.</p>
<h3>Weekly Calendar</h3>
<iframe id="calendar" src="https://www.google.com/calendar/embed?showTitle=0&amp;showNav=0&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;mode=WEEK&amp;wkst=1&amp;bgcolor=%23FFFFFF&amp;src=ianonavy@gmail.com&amp;color=%23A32929&amp;src=sodbfdhm4q7api4qvf5h5k7rlg@group.calendar.google.com&amp;color=%23B1440E&amp;src=36gqite9pam369c6mknuttgsqg@group.calendar.google.com&amp;color=%23125A12&amp;src=jnqo9lo8efm5ogj78pr176qstg@group.calendar.google.com&amp;color=%2323164E&amp;src=a82i41iavlvd37d9fnrofklrms@group.calendar.google.com&amp;color=%23182C57&amp;src=achgl7e3m1pokdo8o1uqis70fk@group.calendar.google.com&amp;color=%2323164E&amp;src=doransmestad.com_da1erfts3egct17eb5511nduf8@group.calendar.google.com&amp;src=ieikn7uck3o2ultbt19d9me740@group.calendar.google.com&amp;color=%2323164E&amp;ctz=America/New_York" frameborder="0"></iframe>
</div> </div>
{% endblock main %} {% endblock main %}

4
src/templates/labs.html
View File

@ -5,7 +5,7 @@
{% block main %} {% block main %}
<div class="section"> <div class="section">
<h2>Labs</h2> <h2>Labs</h2>
<p>Welcome to my lab! This where I run all my experimental stuff.</p> <p>Welcome to my lab! This where I run all my experimental stuff. My <a href="https://git.ianonavy.com/public">private Git server</a> has some public repositories if you are interested.</p>
<p>Click <a href="http://demo.ianonavy.com/">here</a> to see what I'm working on this very moment (if anything).</p> <p>I also use <a href="http://demo.ianonavy.com/">demo.ianonavy.com</a> as a general purpose staging site. Check it out to see what I'm working on now!</p>
</div> </div>
{% endblock main %} {% endblock main %}