Started work on portfolio
This commit is contained in:
Claudio Maggioni (maggicl)
parent
0f0300a23a
commit
4e46051e19
3 changed files with 143 additions and 5 deletions
|
|
@ -94,6 +94,62 @@ ul.navbar-list {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.portfolio {
|
||||||
|
position: relative;
|
||||||
|
padding-top: 2rem;
|
||||||
|
|
||||||
|
.line {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 1rem;
|
||||||
|
border: 3px solid #AAA;
|
||||||
|
z-index: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-end, .line-end-bottom {
|
||||||
|
position: absolute;
|
||||||
|
left: .75rem;
|
||||||
|
width: 1rem;
|
||||||
|
height: 1rem;
|
||||||
|
border-radius: .25rem;
|
||||||
|
background: #AAA;
|
||||||
|
z-index: 200;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line-end { top: 0 }
|
||||||
|
.line-end-bottom { bottom: 0 }
|
||||||
|
|
||||||
|
.port-elem {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
|
||||||
|
> * { padding: .5rem; z-index: 200 }
|
||||||
|
|
||||||
|
.year {
|
||||||
|
background: $nav-bg;
|
||||||
|
color: $nav-col;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description {
|
||||||
|
border: 2px solid $nav-bg;
|
||||||
|
|
||||||
|
.images {
|
||||||
|
background: $nav-bg;
|
||||||
|
padding: .5rem;
|
||||||
|
margin: -.5rem -.5rem .5rem -.5rem;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 175px;
|
||||||
|
margin: .25rem;
|
||||||
|
border: 3px solid $nav-col;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 700px) {
|
@media (max-width: 700px) {
|
||||||
.navbar-list .navbar-item {
|
.navbar-list .navbar-item {
|
||||||
width: calc(100% - 2em);
|
width: calc(100% - 2em);
|
||||||
|
|
@ -123,16 +179,18 @@ footer {
|
||||||
background: $nav-bg;
|
background: $nav-bg;
|
||||||
color: $nav-col;
|
color: $nav-col;
|
||||||
|
|
||||||
@include media-query($on-palm) {
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.author {
|
.author {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include media-query($on-palm) {
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.author { text-align: center }
|
||||||
|
}
|
||||||
|
|
||||||
.icons {
|
.icons {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
flex: 0;
|
flex: 0;
|
||||||
|
|
|
||||||
BIN
images/smarthut.png
Normal file
BIN
images/smarthut.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 MiB |
80
portfolio.html
Normal file
80
portfolio.html
Normal file
|
|
@ -0,0 +1,80 @@
|
||||||
|
---
|
||||||
|
layout: page
|
||||||
|
title: Portfolio
|
||||||
|
permalink: /portfolio/
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="portfolio">
|
||||||
|
<div class="line"></div>
|
||||||
|
<div class="line-end"></div>
|
||||||
|
<div class="line-end-bottom"></div>
|
||||||
|
<section class="port-elem">
|
||||||
|
<div class="year">
|
||||||
|
2020-03 to 2020-06
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<div class="images">
|
||||||
|
<a href="/images/smarthut.png">
|
||||||
|
<img src="/images/smarthut.png" alt="Smarthut homepage"></a>
|
||||||
|
<a href="/images/smarthut.png">
|
||||||
|
<img src="/images/smarthut.png" alt="Smarthut homepage"></a>
|
||||||
|
<a href="/images/smarthut.png">
|
||||||
|
<img src="/images/smarthut.png" alt="Smarthut homepage"></a>
|
||||||
|
<a href="/images/smarthut.png">
|
||||||
|
<img src="/images/smarthut.png" alt="Smarthut homepage"></a>
|
||||||
|
</div>
|
||||||
|
<h2><a href="#">Smarthut</a></h2>
|
||||||
|
<p>Work done during <em>Software Atelier 4</em>. The project is a smart
|
||||||
|
device control platform complete with devices clustering and trigger
|
||||||
|
logic.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="port-elem">
|
||||||
|
<div class="year">
|
||||||
|
2020-03 to 2020-06
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h2>Smarthut</h2>
|
||||||
|
<p>Work done during <em>Software Atelier 4</em>. The project is a smart
|
||||||
|
device control platform complete with devices clustering and trigger
|
||||||
|
logic.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="port-elem">
|
||||||
|
<div class="year">
|
||||||
|
2020-03 to 2020-06
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h2>Smarthut</h2>
|
||||||
|
<p>Work done during <em>Software Atelier 4</em>. The project is a smart
|
||||||
|
device control platform complete with devices clustering and trigger
|
||||||
|
logic.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="port-elem">
|
||||||
|
<div class="year">
|
||||||
|
2020-03 to 2020-06
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h2>Smarthut</h2>
|
||||||
|
<p>Work done during <em>Software Atelier 4</em>. The project is a smart
|
||||||
|
device control platform complete with devices clustering and trigger
|
||||||
|
logic.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="port-elem">
|
||||||
|
<div class="year">
|
||||||
|
2020-03 to 2020-06
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h2>Smarthut</h2>
|
||||||
|
<p>Work done during <em>Software Atelier 4</em>. The project is a smart
|
||||||
|
device control platform complete with devices clustering and trigger
|
||||||
|
logic.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{% comment %}
|
||||||
|
vim: set ts=2 sw=2 et tw=80:
|
||||||
|
{% endcomment %}
|
||||||
Loading…
Reference in a new issue