TheThomaas/11ty-resume
1
0
Fork 0
Code Issues 1 Pull requests Packages Projects Releases Wiki Activity

Compare commits

base: TheThomaas:2e7239e7a6949e5156afcb461d1b844496fa40ed
Branches Tags
TheThomaas:main
...
compare: TheThomaas:8ab9ee04ff2fc071a82e4c2cea38891f142e7763
Branches Tags
TheThomaas:main

11 commits
2e7239e7a6 ... 8ab9ee04ff

Author SHA1 Message Date
TheThomaas 8ab9ee04ff Change languages text 2024-02-10 21:19:37 +01:00
TheThomaas 778d776907 Remove section classes 2024-02-10 21:18:06 +01:00
TheThomaas 9319ee7d52 Change name of hero section 2024-02-10 21:17:59 +01:00
TheThomaas f16988fae8 Update background variable 2024-02-10 21:16:11 +01:00
TheThomaas 698c59d4f4 Remove section classes 2024-02-10 21:14:30 +01:00
TheThomaas ad574ba89a Check if timeline exists before displaying it 2024-02-10 21:09:27 +01:00
TheThomaas 0d648729f7 Create components for project cards 2024-02-10 21:08:57 +01:00
TheThomaas fdb14d6a35 Create navigation partial 2024-02-10 21:08:36 +01:00
TheThomaas 33f0aecdf6 Rename header.html to header.liquid 2024-02-10 21:04:54 +01:00
TheThomaas 507bb7448a Remove image parameter, add displayedTitle option 2024-02-10 21:04:26 +01:00
TheThomaas 7a3143fbe1 Remove '.liquid' from components 2024-02-10 21:01:39 +01:00
18 changed files with 101 additions and 114 deletions
Show stats Expand all files Collapse all files

4
src/_includes/hero.liquid
View file

@ -1,8 +1,8 @@
<section id="{{ subpage.data.title | slug }}" class="{{ subpage.data.classes }} wrapper-full hero-section"> <section id="{{ subpage.data.title | slug }}" class="wrapper-full hero">
<div> <div>
<h1 class="hero-title">{% if subpage.data.displayedTitle %}{{ subpage.data.displayedTitle }}{% else %}{{ subpage.data.title }}{% endif %}</h1> <h1 class="hero-title">{% if subpage.data.displayedTitle %}{{ subpage.data.displayedTitle }}{% else %}{{ subpage.data.title }}{% endif %}</h1>
<p>{{subpage.data.description}}</p> <p>{{subpage.data.description}}</p>
{{ subpage.templateContent }} {{ subpage.templateContent }}
{% render 'partials/components/socials.liquid', socials: author.socials, mail: author.mail, showLabel: true %} {% render 'partials/components/socials', socials: author.socials, mail: author.mail, showLabel: true %}
</div> </div>
</section> </section>

2
src/_includes/layouts/base.html
View file

@ -4,7 +4,7 @@
{% include "partials/metas.html" %} {% include "partials/metas.html" %}
</head> </head>
<body> <body>
{% include "partials/header.html" %} {% include "partials/header.liquid" %}
<main tabindex="-1" id="main-content"> <main tabindex="-1" id="main-content">
{% block content %} {% block content %}

5
src/_includes/page.liquid
View file

@ -1,9 +1,6 @@
<section id="{{ subpage.data.title | slug }}" class="{{ subpage.data.classes }} wrapper-full"> <section id="{{ subpage.data.title | slug }}" class="{{ subpage.data.classes }} wrapper-full">
{% if subpage.data.img %}
<img src="{{subpage.data.img.src}}" alt="{{subpage.data.img.alt}}">
{% endif %}
{% if subpage.data.showTitle != false %} {% if subpage.data.showTitle != false %}
<h2>{{ subpage.data.title }}</h2> <h2>{% if subpage.data.displayedTitle %}{{ subpage.data.displayedTitle }}{% else %}{{ subpage.data.title }}{% endif %}</h2>
{% endif %} {% endif %}
{{ subpage.templateContent }} {{ subpage.templateContent }}
</section> </section>

16
src/_includes/partials/components/card.liquid Normal file
View file

@ -0,0 +1,16 @@
<li>
<article class="card" {% if background %}style="--background: {{ background }}"{% endif %}>
<div class="top">
<span></span>
<div class="links">
{%- for link in links -%}
<a href="{{ link.link }}" target="_blank" title="{{ link.title }}" class="{{ link.icon }}"></a>
{%- endfor -%}
</div>
</div>
<div class="content">
<h3>{{ title }}</h3>
<p>{{ description }}</p>
</div>
</article>
</li>

12
src/_includes/partials/components/project-grid.liquid Normal file
View file

@ -0,0 +1,12 @@
{% if projects %}
<ul class="project-grid">
{%- for project in projects -%}
{% assign data = project.data %}
{% render "partials/components/card",
background: data.background,
links: data.links,
title: data.title,
description: data.description %}
{%- endfor -%}
</ul>
{% endif %}

26
src/_includes/partials/components/timeline.liquid
View file

@ -1,12 +1,14 @@
<ol class="timeline"> {% if timeline %}
{%- for elements in timeline -%} <ol class="timeline">
{% assign data = elements.data %} {%- for elements in timeline -%}
{% render 'partials/components/timeline-item', {% assign data = elements.data %}
start: data.startDate, {% render 'partials/components/timeline-item',
end: data.endDate, start: data.startDate,
link: data.link, end: data.endDate,
title: data.title, link: data.link,
location: data.location, title: data.title,
description: data.description %} location: data.location,
{%- endfor -%} description: data.description %}
</ol> {%- endfor -%}
</ol>
{% endif %}

2
src/_includes/partials/footer.liquid
View file

@ -7,6 +7,6 @@
{% endif %} {% endif %}
</ul> </ul>
{% render 'partials/components/socials.liquid', socials: author.socials, mail: author.mail, showLabel: false %} {% render 'partials/components/socials', socials: author.socials, mail: author.mail, showLabel: false %}
</div> </div>
</footer> </footer>

17
src/_includes/partials/header.html
View file

@ -1,17 +0,0 @@
{% include "partials/skip-link.html" %}
<header id="site-header">
<span></span>
<div>
<nav>
<ul>
{% for item in collections.subpages %}
{% if item.data.excludeFromNav != true %}
<li>
<a href="#{{ item.data.title | slug }}">{{ item.data.title }}</a>
</li>
{% endif %}
{% endfor %}
</ul>
</nav>
</div>
</header>

7
src/_includes/partials/header.liquid Normal file
View file

@ -0,0 +1,7 @@
{% include "partials/skip-link.html" %}
<header id="site-header">
<span></span>
<div>
{% include "partials/navigation" %}
</div>
</header>

11
src/_includes/partials/navigation.liquid Normal file
View file

@ -0,0 +1,11 @@
<nav>
<ul>
{% for item in collections.subpages %}
{% if item.data.excludeFromNav != true %}
<li>
<a href="#{{ item.data.title | slug }}">{{ item.data.title }}</a>
</li>
{% endif %}
{% endfor %}
</ul>
</nav>

20
src/_includes/partials/project.liquid
View file

@ -1,20 +0,0 @@
<ul>
{%- for project in projects -%}
<li>
<article {% if project.data.background %}style="--background: {{ project.data.background }}"{% endif %}>
<div class="top">
<span></span>
<div class="links">
{%- for link in project.data.links -%}
<a href="{{ link.link }}" target="_blank" title="{{ link.title }}" class="{{ link.icon }}"></a>
{%- endfor -%}
</div>
</div>
<div class="content">
<h3>{{ project.data.title }}</h3>
<p>{{ project.data.description }}</p>
</div>
</article>
</li>
{%- endfor -%}
</ul>

4
src/pages/index.liquid
View file

@ -7,9 +7,9 @@ permalink: /
{% for subpage in collections.subpages %} {% for subpage in collections.subpages %}
{% if subpage.data.excludeFromList != true %} {% if subpage.data.excludeFromList != true %}
{% if subpage.data.template == 'hero' %} {% if subpage.data.template == 'hero' %}
{% include 'hero.liquid' %} {% include 'hero' %}
{% else %} {% else %}
{% include 'page.liquid' %} {% include 'page' %}
{% endif %} {% endif %}
{% endif %} {% endif %}
{% endfor %} {% endfor %}

9
src/pages/subpages/competences.liquid
View file

@ -21,12 +21,9 @@ classes: 'competences-section langues-section'
<div class="col"> <div class="col">
<h2>Langues</h2> <h2>Langues</h2>
<ul style="list-style-type: initial"> <ul style="list-style-type: initial">
<li>HTML</li> <li>Français (langue maternelle)</li>
<li>CSS</li> <li>Anglais</li>
<li>Bootstrap</li> <li>Allemand (Connaissance scolaires)</li>
<li>Javascript</li>
<li>jQuery</li>
<li>Eleventy</li>
</ul> </ul>
</div> </div>
</div> </div>

3
src/pages/subpages/download.liquid
View file

@ -2,10 +2,9 @@
title: Download title: Download
showTitle: false showTitle: false
order: 4 order: 4
classes: 'download-section'
--- ---
<div class="flex-container justify-center"> <div class="flex-container justify-center download">
<p>You want to print this document ?</p> <p>You want to print this document ?</p>
<i>--></i> <i>--></i>
<button type="button" onclick="window.print()" class="btn btn-download icon--right icon-download">Download as PDF</button> <button type="button" onclick="window.print()" class="btn btn-download icon--right icon-download">Download as PDF</button>

1
src/pages/subpages/experiences.liquid
View file

@ -1,7 +1,6 @@
--- ---
title: Experiences title: Experiences
order: 3 order: 3
classes: 'experiences-section'
--- ---
{% assign experiences = collections.experiences %} {% assign experiences = collections.experiences %}

3
src/pages/subpages/projects.liquid
View file

@ -1,8 +1,7 @@
--- ---
title: Projects title: Projects
order: 2 order: 2
classes: 'projects-section'
--- ---
{% assign projects = collections.projects %} {% assign projects = collections.projects %}
{% include 'partials/project.liquid' %} {% include 'partials/components/project-grid' %}

2
src/scss/components/_variables.scss
View file

@ -1,7 +1,7 @@
:root { :root {
--bg-gradient: linear-gradient(180deg, rgb(var(--brand-primary-medium)) 0%, rgb(var(--brand-primary-medium)) 5%, rgb(var(--brand-primary-low)) 30%, rgb(var(--brand-primary-lower)) 50%, rgb(var(--brand-secondary-lower)) 51%, rgb(var(--brand-secondary-low)) 65%, rgb(var(--brand-secondary-medium)) 98%, rgb(var(--brand-secondary-medium)) 100%); --bg-gradient: linear-gradient(180deg, rgb(var(--brand-primary-medium)) 0%, rgb(var(--brand-primary-medium)) 5%, rgb(var(--brand-primary-low)) 30%, rgb(var(--brand-primary-lower)) 50%, rgb(var(--brand-secondary-lower)) 51%, rgb(var(--brand-secondary-low)) 65%, rgb(var(--brand-secondary-medium)) 98%, rgb(var(--brand-secondary-medium)) 100%);
--background: rgb(var(--brand-primary-low)); --background: rgb(var(--brand-primary-medium));
--text: rgb(var(--neutral-highest)); --text: rgb(var(--neutral-highest));
--text-2: rgba(var(--neutral-highest), .8); --text-2: rgba(var(--neutral-highest), .8);

71
src/scss/critical.scss
View file

@ -85,7 +85,7 @@ i {
} }
} }
.hero-section { .hero {
height: 90vh; height: 90vh;
height: 90svh; height: 90svh;
@ -116,65 +116,60 @@ i {
} }
} }
.projects-section { .project-grid {
ul { display: grid;
display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: 1rem;
gap: 1rem;
}
li { li {
border-radius: var(--border-radius); border-radius: var(--border-radius);
overflow: hidden; overflow: hidden;
} }
article { }
--background: url('https://placehold.co/200x150'); // Default background .card {
position: relative; --background: url('https://placehold.co/200x150'); // Default background
height: 100%; position: relative;
padding: .4rem; height: 100%;
display: flex; padding: .4rem;
flex-direction: column; display: flex;
justify-content: space-between; flex-direction: column;
gap: 2.5rem; justify-content: space-between;
z-index: 1; gap: 2.5rem;
background: var(--background); z-index: 1;
background-repeat: no-repeat; background: var(--background);
background-size: cover; background-repeat: no-repeat;
} background-size: cover;
a { a {
&:hover { &:hover {
color: #3a3a3a; color: #3a3a3a;
transition: color .2s ease-in-out; transition: color .2s ease-in-out;
} }
&:before, &:before,
&:after { &:after {
--icon-size: 1.2rem; --icon-size: 1.2rem;
} }
} }
.top { .top {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
} }
.links { .links {
display: flex; display: flex;
gap: .35rem; gap: .35rem;
align-self: flex-end; align-self: flex-end;
} }
.content { .content {
padding: 1rem .4rem 0 .4rem; padding: 1rem .4rem 0 .4rem;
} }
} }
.about-section, section {
.competences-section,
.projects-section,
.experiences-section,
.download-section {
padding-block: 2rem; padding-block: 2rem;
margin-block: 3.5rem; margin-block: 3.5rem;
} }
@ -293,19 +288,9 @@ i {
} }
} }
.experiences-section {
p {
margin: 0;
}
}
.download-section {
text-align: center;
> div {
gap: .8rem;
}
.download {
gap: .8rem;
p { p {
font-size: 1.4rem; font-size: 1.4rem;
} }