Added projects theme pages

This commit is contained in:
Felipe Martín 2015-03-19 23:12:08 +01:00
parent 5de2706d90
commit ff20cc9f23
10 changed files with 138 additions and 14 deletions

View File

@ -15,6 +15,8 @@
],
"dependencies": {
"font-awesome": "~4.2.0",
"google-code-prettify": "~1.0.3"
"google-code-prettify": "~1.0.3",
"jquery": "~2.1.3",
"lightbox2": "~2.7.1"
}
}

View File

@ -135,10 +135,16 @@ hr
margin-top: 5px
padding: 8px 0 8px 0
font-weight: bold
text-shadow: 0 0 1px #000
width: 90%
text-align: left
transition: 0.3s all
i.fa
margin: 0 8px 0 10px
width: 20px
&.half
width: 38%

View File

@ -79,6 +79,9 @@
width: $size/3
height: $size/3
.hidden
display: none
/* Mix-ins */
@mixin rotate($degrees)
-webkit-transform: rotate(#{$degrees}deg)

View File

@ -0,0 +1,56 @@
body
&.projects
background-color: #fff
background-image: url('/static/images/homepage/bg.png')
background-attachment: fixed
.project-papers
background: #fff
box-shadow: 0 0 10px rgba(0,0,0,0.3)
margin: 30px 0
max-width: 600px
min-width: 200px
padding: 24px
position: relative
font-size: 110%
width: 80%
.project-papers:before, .project-papers:after
content: ""
height: 98%
position: absolute
width: 100%
z-index: -1
.project-papers:before
background: #fafafa
box-shadow: 0 0 8px rgba(0,0,0,0.2)
left: -5px
top: 4px
@include rotate(-2.5)
.project-papers:after
background: #f6f6f6
box-shadow: 0 0 3px rgba(0,0,0,0.2)
right: -3px
top: 1px
@include rotate(1.4)
.project-papers
&:hover
cursor: pointer
.title
float: left
margin: 0
.role, .stack, .company, .title, .date, .url
margin: 12px 0 12px 0
.date
float: right
.computer
max-width: inherit
.image
max-width: inherit
width: 90%
margin-top: 3%

View File

@ -38,16 +38,16 @@ $github-text-color: #000
$linkedin-color: #0976b4
$linkedin-text-color: #fff
$rss-color: #ff7f25
$rss-color: #ff9557
$rss-text-color: #eee
$blog-color: #ff3617
$blog-color: desaturate(#fe160e, 50)
$blog-text-color: #fff
$homepage-color: #01b2f1
$homepage-color: desaturate(#00cbf4, 50)
$homepage-text-color: #efefef
$projects-color: #2b82ad
$projects-color: desaturate(#491b93, 50)
$projects-text-color: #efefef
// Colors

View File

@ -4,6 +4,7 @@
@import "layout"
@import "homepage"
@import "blog"
@import "projects"
@import "syntax"
@import "responsive"

View File

@ -47,15 +47,9 @@
<a href="{{ url('blog:list') }}" class="button blog">
<i class="fa fa-comment"></i> Blog
</a>
{#
{% if section != 'projects' %}
<a href="#">
<button class="projects">
<i class="fa fa-folder-open"></i> Projects
</button>
<a href="{{ url('projects:list') }}" class="button projects">
<i class="fa fa-folder-open"></i> Portfolio
</a>
{% endif %}
#}
{% endblock %}
</div>
<nav class="zone-menu buttons">

View File

@ -0,0 +1,3 @@
{% extends "_layout.jinja" %}
{% block page_title %}Projects{% endblock %}

View File

@ -0,0 +1,56 @@
{% extends "projects/layout.jinja" %}
{% block menu %}
{{ super() }}
{% for grp in groups %}
<a class="button" href="#{{ grp.slug }}"><i class="fa fa-arrow-right"></i> {{ grp.name }}</a><br />
{% endfor %}
<a class="button" href="#notes"><i class="fa fa-arrow-right"></i> Notes</a><br />
{% endblock %}
{% block content %}
{% for grp in groups %}
<h2 id="{{ grp.slug }}">{{ grp.name }}</h2>
{% for project in grp.projects.all().order_by('-date') %}
<div class="project-papers" data-toggle-on-click>
<h4 class="date"><i class="fa fa-calendar"></i> {{ project.date|date('F Y') }}</h4>
<h3 class="title">{{ project.title }}</h3>
<div class="clearfix"></div>
<div class="hidden" data-viewmore>
{% if project.company %}
<h5 class="company"><i class="fa fa-building-o"></i> {{ project.company }}</h5>
{% endif %}
{% if project.role %}
<h5 class="role"><i class="fa fa-user"></i> {{ project.role }}</h5>
{% endif %}
{% if project.stack %}
<h5 class="stack"><i class="fa fa-cogs"></i> {{ project.stack }}</h5>
{% endif %}
{% if project.url %}
<h5 class="url"><i class="fa fa-link"></i> <a href="{{ project.url }}">{{ project.url }}</a></h5>
{% endif %}
<div class="text-center computer">
<img class="image" src="{{ MEDIA_URL }}{{ project.image }}" />
</div>
<p class="description">{{ project.description|safe }}</p>
</div>
</div>
{% endfor %}
{% endfor %}
<h2 id="notes">Notes</h2>
<div class="papers">
<p>Some notes goes here. Bacom ipsum and stuff</p>
</div>
{% endblock %}
{% block javascript %}
{{ super() }}
<script type="text/javascript" src="{{ STATIC_URL }}bower/jquery/dist/jquery.js"></script>
<script type="text/javascript">
$(function() {
$('[data-toggle-on-click]').click(function(event) {
$(this).children('[data-viewmore]').slideToggle(300);
})
})
</script>
{% endblock %}

View File

@ -13,10 +13,13 @@ sitemaps = {
admin.autodiscover()
urlpatterns = patterns('',
urlpatterns = patterns(
'',
(r'^ckeditor/', include('ckeditor.urls')),
url(r'^admin/', include(admin.site.urls)),
url(r'^blog/', include('fmartingrcom.apps.blog.urls', namespace='blog')),
url(r'^projects/',
include('fmartingrcom.apps.projects.urls', namespace='projects')),
url(r'^$', include('fmartingrcom.apps.homepage.urls', namespace='home')),
)