diff --git a/_data/highlights.yml b/_data/highlights.yml index 0fcb3a2..c1b91ee 100644 --- a/_data/highlights.yml +++ b/_data/highlights.yml @@ -6,39 +6,39 @@ - title: "Twitter — Elecciones 2019" blurb: - es: "Seguimiento de las Elecciones presidenciales de 2019." - en: "Tracking the 2019 Argentinian presidential elections." - fr: "Suivi des élections présidentielles argentines de 2019." + es: "Las elecciones presidenciales de 2019, vistas desde Twitter." + en: "The 2019 Argentine presidential elections, seen from Twitter." + fr: "Les élections présidentielles argentines de 2019, vues depuis Twitter." # The live site is gone (default nginx page); 2019 Wayback snapshot. url: "https://web.archive.org/web/20190912124205/http://elecciones2019.fi.uba.ar/" - title: "CDNs" blurb: - es: "Cómo los proveedores de contenido pasaron a estar en el centro de Internet." - en: "How Content Providers became central to the AS ecosystem after the rise of private CDNs." - fr: "Comment les fournisseurs de contenu sont devenus centraux dans l'écosystème des AS après l'essor des CDN privés." + es: "Cómo los proveedores de contenido llegaron al centro de Internet." + en: "How content providers moved to the center of the Internet." + fr: "Comment les fournisseurs de contenu sont arrivés au cœur d'Internet." # cnet.fi.uba.ar/TMA2018/ now meta-redirects here. url: "https://netcores.fi.uba.ar/" - title: "LaNet-vi" blurb: - es: "Software de visualización de redes grandes mediante k-núcleos." - en: "Large-network visualization software using k-cores and k-denses decomposition." - fr: "Logiciel de visualisation de grands réseaux par décomposition en k-cœurs et k-denses." + es: "Visualización de redes grandes mediante k-núcleos." + en: "Large-network visualization with k-cores." + fr: "Visualisation de grands réseaux par k-cœurs." url: "http://lanet-vi.fi.uba.ar/" - title: "I'm Here!" blurb: - es: "Visualizá un mapa de la topología de Internet indicando dónde estás." - en: "Visualize a map of the Internet topology, showing where you are." - fr: "Visualisez la topologie d'Internet et le point où vous vous trouvez." + es: "Un mapa de Internet que muestra dónde estás." + en: "A map of the Internet that shows where you are." + fr: "Une carte d'Internet qui montre où vous êtes." url: "http://lanet-vi.fi.uba.ar/i-am-here" - title: "TiX" blurb: - es: "Traffic information eXchange — herramienta para medir la calidad de su acceso a Internet." - en: "Traffic information eXchange — a tool to measure the quality of your Internet access." - fr: "Traffic information eXchange — outil de mesure de la qualité de votre accès Internet." + es: "Medí la calidad de tu acceso a Internet." + en: "Measure the quality of your Internet access." + fr: "Mesurez la qualité de votre accès Internet." url: "https://github.com/TiX-measurements" cta: es: "Código en GitHub" @@ -47,9 +47,9 @@ - title: "UBACyT" blurb: - es: "Internet: medición de QoS domiciliaria, análisis tomográfico y propuestas de algoritmos de ruteo." - en: "Internet: residential QoS measurement, tomographic analysis, and routing-algorithm proposals." - fr: "Internet : mesure de la QoS résidentielle, analyse tomographique et propositions d'algorithmes de routage." + es: "Calidad de servicio domiciliaria, tomografía y ruteo en Internet." + en: "Residential quality of service, tomography, and routing on the Internet." + fr: "Qualité de service résidentielle, tomographie et routage sur Internet." # Internal link: polyglot prefixes /en/ or /fr/ automatically. url: "/projects/" cta: diff --git a/_data/home.yml b/_data/home.yml new file mode 100644 index 0000000..aeeed1a --- /dev/null +++ b/_data/home.yml @@ -0,0 +1,68 @@ +# ============================================================================= +# CoNexDat — home page labels (rendered by _includes/home.html). +# The three _pages/home*.md files only set front matter and include that file, +# so every label lives here in the three languages. +# ============================================================================= + +affiliations_label: + es: "Pertenencia institucional" + en: "Affiliations" + fr: "Affiliations institutionnelles" + +# Section headings +areas_label: + es: "Áreas de investigación" + en: "Research areas" + fr: "Axes de recherche" +news_label: + es: "Noticias" + en: "News" + fr: "Actualités" +recent_label: + es: "Publicaciones recientes" + en: "Recent publications" + fr: "Publications récentes" +highlights_label: + es: "Proyectos destacados" + en: "Featured projects" + fr: "Projets phares" + +# Link labels +more_label: + es: "Saber más" + en: "Learn more" + fr: "En savoir plus" +all_publications_label: + es: "Ver todas las publicaciones" + en: "See all publications" + fr: "Voir toutes les publications" +visit_label: + es: "Ir al sitio" + en: "Visit site" + fr: "Visiter le site" + +# Figures strip. Counts come from the bibliography and _data/ at build time; +# `since` is the year of the oldest entry in _bibliography/conexdat.bib. +since: 1995 +stats: + publications: + es: "publicaciones" + en: "publications" + fr: "publications" + theses: + es: "tesis dirigidas" + en: "theses supervised" + fr: "thèses dirigées" + projects: + es: "proyectos financiados" + en: "funded projects" + fr: "projets financés" + years: + es: "años de investigación" + en: "years of research" + fr: "années de recherche" + +intecin: + es: "Grupo de investigación perteneciente al" + en: "Research group within" + fr: "Groupe de recherche affilié à l'" diff --git a/_data/research_areas.yml b/_data/research_areas.yml index 2307cbf..14d586e 100644 --- a/_data/research_areas.yml +++ b/_data/research_areas.yml @@ -12,6 +12,11 @@ es: "Sistemas Complejos" en: "Complex Systems" fr: "Systèmes complexes" + # One line for the home-page card; `excerpt` is the longer text on /research/. + tagline: + es: "Descomposición en k-núcleos, comunidades y propagación en redes reales." + en: "k-core decomposition, communities, and propagation in real-world networks." + fr: "Décomposition en k-cœurs, communautés et propagation dans les réseaux réels." excerpt: es: "Estudiamos redes complejas con métodos como descomposición en *k-núcleos* y detección de comunidades. Aplicamos teoría de grafos y modelos de propagación a redes biológicas, sociales y tecnológicas." en: "We study complex networks via *k-core* decomposition and community detection. Graph theory and propagation models applied to biological, social and technological networks." @@ -73,6 +78,11 @@ es: "Ciencia de Datos" en: "Data Science" fr: "Science des données" + # One line for the home-page card; `excerpt` is the longer text on /research/. + tagline: + es: "Twitter, elecciones y movilidad humana a gran escala." + en: "Twitter, elections, and human mobility at scale." + fr: "Twitter, élections et mobilité humaine à grande échelle." excerpt: es: "Análisis a gran escala de trazas de Twitter, datos electorales y registros móviles (CDR). Inferimos movilidad humana, demanda de contenidos y dinámica de comunidades online." en: "Large-scale analysis of Twitter traces, electoral data, and Call Detail Records (CDR). We infer human mobility, content demand, and online community dynamics." @@ -132,6 +142,11 @@ es: "Internet" en: "Internet" fr: "Internet" + # One line for the home-page card; `excerpt` is the longer text on /research/. + tagline: + es: "Topología, tomografía y ruteo de Internet a nivel de sistemas autónomos." + en: "Internet topology, tomography, and routing at the autonomous-system level." + fr: "Topologie, tomographie et routage d'Internet au niveau des systèmes autonomes." excerpt: es: "Tomografía de Internet y modelado de su topología (BGP, IXPs, AS-level). Diseñamos protocolos de ruteo cuyas tablas crecen sub-linealmente con el tamaño de la red." en: "Internet tomography and topology modeling (BGP, IXPs, AS-level). We design routing protocols whose tables grow sub-linearly with network size." @@ -231,6 +246,11 @@ es: "Tráfico de red" en: "Network traffic" fr: "Trafic réseau" + # One line for the home-page card; `excerpt` is the longer text on /research/. + tagline: + es: "Tráfico autosimilar y medición de la calidad del acceso residencial." + en: "Self-similar traffic and quality measurement of residential Internet access." + fr: "Trafic autosimilaire et mesure de la qualité de l'accès résidentiel." excerpt: es: "Caracterización estadística *autosimilar* del tráfico residencial. Mediciones continuas de baja carga para evaluar QoS y detectar tráfico de IXPs y CDNs." en: "Statistical *self-similar* characterization of residential traffic. Continuous low-load probing for QoS assessment and IXP/CDN traffic detection." @@ -287,6 +307,11 @@ es: "Redes ad-hoc" en: "Ad-hoc networks" fr: "Réseaux ad-hoc" + # One line for the home-page card; `excerpt` is the longer text on /research/. + tagline: + es: "Ruteo bio-inspirado para redes inalámbricas sin infraestructura." + en: "Bio-inspired routing for infrastructure-less wireless networks." + fr: "Routage bio-inspiré pour les réseaux sans fil sans infrastructure." excerpt: es: "Protocolos de ruteo para redes inalámbricas sin infraestructura. Desarrollamos *ANTop* (algoritmo bio-inspirado) y lo evaluamos sobre el simulador QUENAS." en: "Routing protocols for infrastructure-less wireless networks. We developed *ANTop* (bio-inspired algorithm) and evaluated it on the QUENAS simulator." diff --git a/_includes/home.html b/_includes/home.html new file mode 100644 index 0000000..6f3cf98 --- /dev/null +++ b/_includes/home.html @@ -0,0 +1,74 @@ +{%- comment -%} + Home page body, shared by _pages/home.md, home.en.md and home.fr.md. + Required: include.lang (es|en|fr). Labels live in _data/home.yml; cards come + from _data/research_areas.yml (tagline) and _data/highlights.yml; the news + timeline from _news/; the recent papers from jekyll-scholar. The page title + (H1) is rendered by the layout, so the first thing below it is the research + areas grid. +{%- endcomment -%} +{%- assign lang = include.lang | default: site.default_lang -%} +{%- assign t = site.data.home -%} +{%- assign year_now = site.time | date: "%Y" | plus: 0 -%} +{%- assign years = year_now | minus: t.since -%} + +
+
{{ t.affiliations_label[lang] }}
+ +
+ +

{{ t.areas_label[lang] }}

+ +
+ {%- for a in site.data.research_areas -%} + + + {{ a.title[lang] }} + {{ a.tagline[lang] }} + {{ t.more_label[lang] }} + + {%- endfor -%} +
+ + + +

{{ t.news_label[lang] }}

+ +{% include news.html lang=lang limit=5 %} + +

{{ t.recent_label[lang] }}

+ +
+{% bibliography --file conexdat --max 3 %} +
+

{{ t.all_publications_label[lang] }} »

+ +

{{ t.highlights_label[lang] }}

+ +
+ {%- for h in site.data.highlights -%} + {%- if h.url and h.url != "" -%} + + {{ h.title }} + {{ h.blurb[lang] }} + {{ h.cta[lang] | default: t.visit_label[lang] }} + + {%- else -%} +
+ {{ h.title }} + {{ h.blurb[lang] }} +
+ {%- endif -%} + {%- endfor -%} +
+ +

{{ t.intecin[lang] }} INTECIN — Instituto de Tecnologías y Ciencias de la Ingeniería "Ing. Hilario Fernández Long".

diff --git a/_includes/news.html b/_includes/news.html index c31cfdd..932c1eb 100644 --- a/_includes/news.html +++ b/_includes/news.html @@ -1,27 +1,36 @@ {%- comment -%} - Renders the news collection filtered by language. - Required: include.lang (es|en|fr), optional include.limit. - Mirrors al-folio's news table: date | message. + Renders the news collection as a timeline, filtered by language. + Required: include.lang (es|en|fr), optional include.limit (default 10). + Dates are written in the page language (day, abbreviated month, year). {%- endcomment -%} {%- assign lang = include.lang | default: site.default_lang -%} {%- assign limit = include.limit | default: 10 -%} {%- assign news_items = site.news | where: "lang", lang | sort: "date" | reverse -%} +{%- if lang == "es" -%} + {%- assign months = "ene,feb,mar,abr,may,jun,jul,ago,sep,oct,nov,dic" | split: "," -%} +{%- elsif lang == "fr" -%} + {%- assign months = "janv.,févr.,mars,avr.,mai,juin,juil.,août,sept.,oct.,nov.,déc." | split: "," -%} +{%- else -%} + {%- assign months = "Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec" | split: "," -%} +{%- endif -%} {% if news_items.size > 0 %} -
- - {% for item in news_items limit: limit %} - - - - - {% endfor %} -
{{ item.date | date: "%b %-d, %Y" }} - {%- if item.inline -%} - {{ item.content | markdownify | remove: "

" | remove: "

" }} - {%- else -%} - {{ item.title }} - {%- endif -%} -
-
+
    + {% for item in news_items limit: limit %} + {%- assign m = item.date | date: "%-m" | minus: 1 -%} +
  1. + +
    + {%- if item.inline -%} + {{ item.content | markdownify | remove: "

    " | remove: "

    " }} + {%- else -%} + {{ item.title }} + {%- endif -%} +
    +
    2. + {% endfor %} +
{% endif %} diff --git a/_pages/home.en.md b/_pages/home.en.md index 44cd09d..150922c 100644 --- a/_pages/home.en.md +++ b/_pages/home.en.md @@ -5,52 +5,4 @@ title: "Complex Networks and Data Communication Group" author_profile: true --- -
-
Affiliations
- -
- -## Research areas - -
-{% for a in site.data.research_areas %} -
-
-
-

{{ a.title[page.lang] }}

-
{{ a.excerpt[page.lang] | markdownify }}
-

Learn more »

-
-
-
-{% endfor %} -
- -## News - -{% include news.html lang="en" %} - -## Featured projects - -
-{% for h in site.data.highlights %} -
-
-
-

{{ h.title }}

-

{{ h.blurb.en }}

- {% if h.url and h.url != "" %}

{{ h.cta.en | default: "Visit site" }} »

{% endif %} -
-
-
-{% endfor %} -
- ---- - -*Research group within [INTECIN — Instituto de Tecnologías y Ciencias de la Ingeniería "Ing. Hilario Fernández Long"](https://intecin.fi.uba.ar).* +{% include home.html lang="en" %} diff --git a/_pages/home.fr.md b/_pages/home.fr.md index 2d46e91..09b27c6 100644 --- a/_pages/home.fr.md +++ b/_pages/home.fr.md @@ -5,52 +5,4 @@ title: "Groupe de Réseaux Complexes et Communication de Données" author_profile: true --- -
-
Affiliations institutionnelles
- -
- -## Axes de recherche - -
-{% for a in site.data.research_areas %} -
-
-
-

{{ a.title[page.lang] }}

-
{{ a.excerpt[page.lang] | markdownify }}
-

En savoir plus »

-
-
-
-{% endfor %} -
- -## Actualités - -{% include news.html lang="fr" %} - -## Projets phares - -
-{% for h in site.data.highlights %} -
-
-
-

{{ h.title }}

-

{{ h.blurb.fr }}

- {% if h.url and h.url != "" %}

{{ h.cta.fr | default: "Visiter le site" }} »

{% endif %} -
-
-
-{% endfor %} -
- ---- - -*Groupe de recherche affilié à l'[INTECIN — Instituto de Tecnologías y Ciencias de la Ingeniería "Ing. Hilario Fernández Long"](https://intecin.fi.uba.ar).* +{% include home.html lang="fr" %} diff --git a/_pages/home.md b/_pages/home.md index 9c24a38..49e81a4 100644 --- a/_pages/home.md +++ b/_pages/home.md @@ -5,52 +5,4 @@ title: "Grupo de Redes Complejas y Comunicación de Datos" author_profile: true --- -
-
Pertenencia institucional
- -
- -## Áreas de investigación - -
-{% for a in site.data.research_areas %} -
-
-
-

{{ a.title[page.lang] }}

-
{{ a.excerpt[page.lang] | markdownify }}
-

Saber más »

-
-
-
-{% endfor %} -
- -## Noticias - -{% include news.html lang="es" %} - -## Proyectos destacados - -
-{% for h in site.data.highlights %} -
-
-
-

{{ h.title }}

-

{{ h.blurb.es }}

- {% if h.url and h.url != "" %}

{{ h.cta.es | default: "Ir al sitio" }} »

{% endif %} -
-
-
-{% endfor %} -
- ---- - -*Grupo de investigación perteneciente al [INTECIN — Instituto de Tecnologías y Ciencias de la Ingeniería "Ing. Hilario Fernández Long"](https://intecin.fi.uba.ar).* +{% include home.html lang="es" %} diff --git a/_sass/_conexdat.scss b/_sass/_conexdat.scss index 04f8fb0..561db25 100644 --- a/_sass/_conexdat.scss +++ b/_sass/_conexdat.scss @@ -410,8 +410,12 @@ html[data-theme="dark"] { background: rgba(255,255,255,0.10); color: var(--cnet-celeste); } - .news table th { color: var(--cnet-celeste); } - .news table td { color: #fff; a { color: var(--cnet-celeste); } } + .news-timeline__day, + .home-card__title, + .home-stats__num { color: var(--cnet-celeste); } + .home-card__icon { background: rgba(255, 255, 255, 0.12); color: var(--cnet-celeste); } + .page__content a.home-card { color: #fff; } + .news-timeline__body { color: #fff; } .affiliations__list li a { background: var(--cnet-surface); color: #fff; @@ -495,38 +499,184 @@ html[data-theme="dark"] { } } -// ---- News table (al-folio look — clean, no grid lines) -------------------- -.news { - margin: 1rem 0 2rem; +// ---- News timeline (see _includes/news.html) ------------------------------ +// Each item is a date badge (day over abbreviated month + year) next to the +// text; a thin vertical line runs behind the badges. +.news-timeline { + list-style: none; + margin: 1rem 0 1.75rem; + padding: 0; + position: relative; - table { - width: 100%; - border-collapse: collapse; - border: none; - - th, td { - padding: 0.35rem 0.9rem 0.35rem 0; - vertical-align: top; - border: none; - background: transparent; - } - th { - font-weight: 500; - white-space: nowrap; - width: 1%; - color: var(--cnet-navy); - font-size: 0.85rem; - letter-spacing: 0.01em; - } - td { - font-size: 0.95rem; - line-height: 1.45; - color: var(--cnet-ink); - a { color: var(--cnet-link); } - } + &::before { + content: ""; + position: absolute; + left: 2.1rem; + top: 0.75rem; + bottom: 1rem; + width: 2px; + background: var(--cnet-border); + } + + &__item { + display: grid; + grid-template-columns: 4.2rem 1fr; + column-gap: 0.9rem; + align-items: start; + margin: 0 0 0.9rem; + &:last-child { margin-bottom: 0; } + } + &__date { + position: relative; // above the vertical line + display: block; + width: 4.2rem; // wide enough for "JANV. 2023" and "SEPT. 2025" + padding: 0.3rem 0 0.35rem; + text-align: center; + border: 1px solid var(--cnet-border); + border-radius: 8px; + background: var(--cnet-surface); + line-height: 1.1; + } + &__day { + display: block; + font-size: 1.15rem; + font-weight: 700; + color: var(--cnet-navy); + font-variant-numeric: tabular-nums; + } + &__month { + display: block; + margin-top: 0.1rem; + font-size: 0.64rem; + font-weight: 600; + letter-spacing: 0.05em; + text-transform: uppercase; + color: var(--global-text-color-light); + white-space: nowrap; + } + &__body { + padding-top: 0.55rem; + font-size: 0.95rem; + line-height: 1.5; + color: var(--cnet-ink); } } +// ---- Home page (see _includes/home.html) ---------------------------------- +// The header (H1 + affiliation pills) stays as short as possible so the +// research-area cards are visible on landing. +.affiliations--compact { margin: -0.5rem 0 1rem; } +.page__content .home-section-title { margin-top: 0.3rem; } + +.home-grid { + display: grid; + grid-template-columns: 1fr; + gap: 0.8rem; + margin: 1rem 0 1.25rem; + @media (min-width: 600px) { grid-template-columns: repeat(2, 1fr); } + @media (min-width: 980px) { grid-template-columns: repeat(3, 1fr); } +} + +// Whole card is one link: icon, title, one line of text, "more" footer. +// (A highlight without a url renders the same box as a plain
.) +.home-card { + display: flex; + flex-direction: column; + gap: 0.3rem; + padding: 0.95rem 1.05rem 0.85rem; + border: 1px solid var(--cnet-border); + border-radius: 8px; + background: var(--cnet-surface); +} +.page__content a.home-card { + color: var(--cnet-ink); + text-decoration: none; + transition: box-shadow 0.15s ease, transform 0.15s ease, border-color 0.15s ease; + + &:hover, &:focus-visible { + border-color: var(--cnet-celeste); + box-shadow: 0 4px 14px rgba(0, 57, 117, 0.18); + transform: translateY(-1px); + text-decoration: none; + .home-card__more i { transform: translateX(3px); } + } +} +.home-card__icon { + display: inline-flex; + align-items: center; + justify-content: center; + width: 2.1rem; + height: 2.1rem; + margin-bottom: 0.15rem; + border-radius: 50%; + background: rgba(116, 172, 223, 0.2); + color: var(--cnet-navy); + font-size: 0.95rem; +} +.home-card__title { + font-size: 1.02rem; + font-weight: 700; + line-height: 1.25; + color: var(--cnet-navy); +} +.home-card__text { + font-size: 0.9rem; + line-height: 1.45; +} +.home-card__more { + margin-top: auto; + padding-top: 0.5rem; + font-size: 0.82rem; + font-weight: 600; + color: var(--global-link-color); + i { + font-size: 0.75em; + margin-left: 0.2em; + transition: transform 0.15s ease; + } +} + +// Figures strip under the research areas (counts computed at build time). +.home-stats { + list-style: none; + margin: 0 0 1.5rem; + padding: 0.9rem 0.25rem; + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 0.6rem; + border-top: 1px solid var(--cnet-border); + border-bottom: 1px solid var(--cnet-border); + @media (min-width: 600px) { grid-template-columns: repeat(4, 1fr); } + + li { margin: 0; text-align: center; } + a { + display: block; + text-decoration: none; + &:hover .home-stats__num { color: var(--global-link-color); } + } + &__num { + display: block; + font-size: 1.7rem; + font-weight: 700; + line-height: 1.1; + color: var(--cnet-navy); + font-variant-numeric: tabular-nums; + transition: color 0.15s ease; + } + &__label { + display: block; + margin-top: 0.15rem; + font-size: 0.72rem; + font-weight: 600; + letter-spacing: 0.06em; + text-transform: uppercase; + color: var(--global-text-color-light); + } +} + +.home-more { margin: -0.5rem 0 1.5rem; } +.home-intecin { margin-top: 1.5rem; font-size: 0.9rem; } + // Small outlined buttons used under publications and IETF documents. @mixin cnet-small-buttons { // academicpages' base .btn ships with `color: #fff !important` and