Add aria labels to links; Progressive loading of pages css; Font swap display;

main
Bruno Carrión 6 months ago
parent 2923740b36
commit 91e1acbfa2
  1. 4
      _includes/navigation.html
  2. 4
      _layouts/default.html
  3. 2
      _layouts/post.html
  4. 1
      _sass/_typography.scss
  5. 2
      archive.html
  6. 19
      assets/css/styles.scss
  7. 2
      blog/index.html
  8. 1
      index.html
  9. 5
      products.html
  10. 1
      workshops.html

@ -4,7 +4,7 @@
aria-label="main navigation"
>
<div class="navbar-brand">
<a class="navbar-item" data-id="home" href="/#home"></a>
<a aria-label="Inici" class="navbar-item" data-id="home" href="/#home"></a>
<a
role="button"
@ -52,7 +52,7 @@
<div class="navbar-item">
{% for link in site.data.links %}
<span data-link="{{ link.id }}" class="icon is-small">
<a href="{{ link.url }}" ><i></i></a>
<a aria-label="Enllaç al nostre perfil de {{ link.id }}" href="{{ link.url }}" ><i></i></a>
</span>
{% endfor %}
</div>

@ -3,7 +3,7 @@ layout: compress
---
<!DOCTYPE html>
<html>
<html lang="ca">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
@ -27,7 +27,7 @@ layout: compress
<link rel="icon" type="image/png" sizes="48x48" href="{{ base.url | prepend: site.url }}/assets/images/favicons/48x48.png" />
{% feed_meta %} {% seo %} {% if jekyll.environment == "production" %}
<script src="my-analytics-script.js"></script>
<!-- <script src="my-analytics-script.js"></script> -->
{% endif %}
<script src="{{ base.url | prepend: site.url }}/assets/js/index.js"></script>

@ -2,6 +2,8 @@
layout: default
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/post.css" />
<nav class="post__breadcrumb breadcrumb is-small has-arrow-separator" aria-label="breadcrumbs">
<ul>
<li><a href="{{ base.url | prepend: site.url }}/blog/">Blog</a></li>

@ -9,6 +9,7 @@ $mobile-line-height: 1.4;
@font-face {
font-family: "Quicksand";
src: url("/assets/fonts/Quicksand/Quicksand-VariableFont_wght.ttf");
font-display: swap;
}
@function pow($number, $exponent) {

@ -4,6 +4,8 @@ title: Còdec | Projectes
page: archive
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/projects.css" />
<div class="projects__content content">
<h1 class="projects__title title is-4">
Coneix els nostres projectes

@ -1,10 +1,5 @@
---
---
/* PARTIALS */
@import "typography";
@import "colors";
@import "reset";
/* VENDOR */
@import "vendor/bulma.min.css";
@ -12,13 +7,13 @@
@import "main.css";
/* PAGES */
@import "pages/home.css";
@import "pages/products.css";
@import "pages/workshops.css";
@import "pages/blog.css";
@import "pages/post.css";
@import "pages/workshop.css";
@import "pages/projects.css";
/* @import "pages/home.css"; */
/* @import "pages/products.css"; */
/* @import "pages/workshops.css"; */
/* @import "pages/blog.css"; */
/* @import "pages/post.css"; */
/* @import "pages/workshop.css"; */
/* @import "pages/projects.css"; */
/* COMPONENTS */
@import "components/header.css";

@ -4,6 +4,8 @@ title: Còdec | Blog
page: blog
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/blog.css" />
<div class="blog__banner"></div>
<h3 class="blog__title title is-3">El blog de Còdec</h3>
{% assign cat_len = site.categories | size %}

@ -4,6 +4,7 @@ title: Còdec
page: home
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/home.css" />
<section id="home" class="home__section">
<div class="home__landing">
<div class="home__brand"></div>

@ -4,6 +4,7 @@ title: Còdec | Productes
page: products
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/products.css" />
<div class="products__content content">
<h1 class="products__title title is-4">
Codifiquem la web
@ -54,10 +55,10 @@ page: products
<p><strong>Preu mínim: {{ product.price }}</strong></p>
</div>
<div>
<a class="products__product-link" target="__blank" href="{{ product.url }}">
<a class="products__product-link" target="__blank" aria-label="Pàgina web del projecte {{ product.name }}" href="{{ product.url }}">
<span class="icon is-small webpage"><i></i></span>
</a>
<a class="products__product-link" target="__blank" href="{{ product.github }}">
<a class="products__product-link" target="__blank" aria-label="Repositori github del projecte {{ product.name }}" href="{{ product.github }}">
<span class="icon is-small github"><i></i></span>
</a>
</div>

@ -4,6 +4,7 @@ title: Còdec | Tallers
page: workshops
---
<link rel="stylesheet" href="{{ base.url | prepend: site.url }}/assets/css/pages/workshops.css" />
<div class="workshops__content content">
<h1 class="workshops__title title is-4">
Descodifiquem la informàtica

Loading…
Cancel
Save