twk95/11ty-site
Public Access
1
0
Fork 0
Code Actions Packages Activity

style: update work experience responsiveness

Browse Source
This commit is contained in:
Jesus Otero Lagunes
2025-08-27 11:01:26 -04:00
parent e774890735
commit 135e93a569
1 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/index.md
View File

@@ -82,22 +82,22 @@ image: "/assets/images/jesus.webp"
<!-- Work Experience Section --> <!-- Work Experience Section -->
<section id="experience" class="py-16"> <section id="experience" class="py-16">
<h2 class="text-3xl font-bold text-center section-title">Work Experience</h2> <h2 class="text-3xl font-bold text-center section-title">Work Experience</h2>
<div class="relative border-l-2 border-gray-700 ml-6"> <div class="relative border-l-2 border-gray-700 ml-4">
{# Loop through and display all "featured" roles #} {# Loop through and display all "featured" roles #}
{%- for role in roles -%} {%- for role in roles -%}
{%- if role.featured -%} {%- if role.featured -%}
<div class="mb-10 mx-6"> <div class="mb-10 mx-4">
<span class="absolute flex items-center justify-center w-6 h-6 bg-blue-500 rounded-full -left-3 ring-8 ring-gray-900"> <span class="absolute flex items-center justify-center w-6 h-6 bg-blue-500 rounded-full -left-3 ring-8 ring-gray-900">
<i class="fas fa-briefcase text-white text-xs"></i> <i class="fas fa-briefcase text-white text-xs"></i>
</span> </span>
<div class="card"> <div class="card">
<div class="flex flex-col md:flex-row md:items-baseline md:gap-x-2 mb-2"> <div class="flex flex-col sm:flex-row sm:items-baseline sm:gap-x-2 mb-2">
<h3 class="text-lg font-semibold text-white"> <h3 class="text-lg font-semibold text-white">
{{ role.title }} {{ role.title }}
</h3> </h3>
{%- if role.company -%} {%- if role.company -%}
<p class="text-lg font-medium text-blue-400"> <p class="text-lg font-medium text-blue-400">
<span class="hidden md:inline text-gray-400">@ </span>{{ role.company }} <span class="mr-2 hidden sm:inline text-gray-400">@</span>{{ role.company }}
</p> </p>
{%- endif -%} {%- endif -%}
</div> </div>
@@ -116,12 +116,15 @@ image: "/assets/images/jesus.webp"
<div class="card"> <div class="card">
<h3 class="text-lg font-semibold text-white mb-2">Previous Roles</h3> <h3 class="text-lg font-semibold text-white mb-2">Previous Roles</h3>
<time class="block mb-2 text-sm font-normal leading-none text-gray-200 mb-2">Since 2014</time> <time class="block mb-2 text-sm font-normal leading-none text-gray-200 mb-2">Since 2014</time>
<ul class="list-disc list-inside text-gray-400"> <ul class="list-disc list-outside pl-4 text-base font-normal text-gray-400">
{%- for role in roles -%} {%- for role in roles -%}
{%- if not role.featured -%} {%- if not role.featured -%}
{%- if role.company -%} {%- if role.company -%}
<li> <li class="mb-2">
{{ role.title }} at <span class="text-blue-400 text-md font-medium">{{ role.company }}</span> {{ role.title -}}
<p class="block sm:inline-block sm:ml-2 font-medium text-blue-400">
<span class="mr-2 hidden sm:inline text-gray-400">@</span>{{ role.company }}
</p>
</li> </li>
{%- endif -%} {%- endif -%}
{%- endif -%} {%- endif -%}