From c14e8cd4c9e5b9272453bbd56c4d654f702e9960 Mon Sep 17 00:00:00 2001 From: Ariel Aharonson Date: Wed, 17 Jun 2026 13:40:26 +0300 Subject: [PATCH 1/3] feat: serve research site under rylo.com/sign/research with Rylo branding [SIGN-520] Move the Sign Language Processing research page onto the main Rylo site at rylo.com/sign/research, behind the existing Cloudflare reverse proxy. - Add so relative assets/links resolve under the proxied prefix regardless of trailing slash. - SEO: canonical + Open Graph/Twitter tags pointing at the rylo.com URL, and point the sitemap loc at https://rylo.com/sign/research/. - Brand cohesion with rylo.com / rylo.com/sign/translate: cream (#faf5f2) background, dark (#191412) text, orange (#ff8b2b) accent, Inter Tight, brand radii, and a navbar with the Rylo wordmark linking back to rylo.com. - Update the sign translate embed to the Rylo Translate app. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/assets/rylo-logo.svg | 17 ++++++++ src/index.md | 4 +- src/sitemap.js | 2 +- src/styles/custom.css | 87 ++++++++++++++++++++++++++++++++++++++++ src/template/index.html | 29 +++++++++++++- 5 files changed, 134 insertions(+), 5 deletions(-) create mode 100644 src/assets/rylo-logo.svg diff --git a/src/assets/rylo-logo.svg b/src/assets/rylo-logo.svg new file mode 100644 index 00000000..3aa329ab --- /dev/null +++ b/src/assets/rylo-logo.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/index.md b/src/index.md index 2b9e3fb7..dfb58932 100644 --- a/src/index.md +++ b/src/index.md @@ -21,8 +21,8 @@ abstract: | ```{=html}

- -Try sign translate to experience state-of-the art-sign language translation technology. + +Try sign translate to experience state-of-the art-sign language translation technology.

``` diff --git a/src/sitemap.js b/src/sitemap.js index f2c11936..91eadaf4 100644 --- a/src/sitemap.js +++ b/src/sitemap.js @@ -9,7 +9,7 @@ console.log(` http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd"> - https://sign-language-processing.github.io/ + https://rylo.com/sign/research/ ${date} diff --git a/src/styles/custom.css b/src/styles/custom.css index 98e0ee81..b09f617c 100644 --- a/src/styles/custom.css +++ b/src/styles/custom.css @@ -1,3 +1,81 @@ +/* Rylo brand layer — values mirror the live rylo.com swatches + (--swatch--light, --swatch--dark, --swatch--brand-primary, radii) so this + page reads as part of the main site. Inter Tight matches rylo.com/sign/translate. */ +:root { + --rylo-cream: #faf5f2; + --rylo-dark: #191412; + --rylo-orange: #ff8b2b; + --rylo-orange-shade: #e07826; + --rylo-sky: #a9c2d7; + --rylo-card: #eee7e1; + --rylo-border: rgba(25, 20, 18, 0.1); + --rylo-radius: 16px; + + --bs-body-bg: var(--rylo-cream); + --bs-body-color: var(--rylo-dark); + --bs-body-font-family: 'Inter Tight', system-ui, -apple-system, sans-serif; + --bs-emphasis-color: var(--rylo-dark); + --bs-link-color: var(--rylo-orange-shade); + --bs-link-hover-color: var(--rylo-dark); + --bs-border-radius: var(--rylo-radius); + --bs-border-radius-lg: 24px; + --bs-nav-pills-link-active-bg: var(--rylo-orange); + --bs-nav-pills-link-active-color: #fff; +} + +body { + background-color: var(--rylo-cream); + color: var(--rylo-dark); + font-family: var(--bs-body-font-family); +} + +h1, h2, h3, h4, h5, h6, .rylo-navbar-title { + font-family: var(--bs-body-font-family); + letter-spacing: -0.02em; +} + +::selection { + background: var(--rylo-sky); + color: var(--rylo-dark); +} + +.rylo-navbar { + background-color: rgba(250, 245, 242, 0.85); + backdrop-filter: saturate(180%) blur(12px); + border-bottom: 1px solid var(--rylo-border); + padding-top: 0.6rem; + padding-bottom: 0.6rem; +} + +.rylo-navbar-brand { + display: inline-flex; + align-items: center; + gap: 0.85rem; + min-height: 44px; +} + +.rylo-logo { + display: inline-flex; + color: var(--rylo-dark); +} + +.rylo-navbar-divider { + width: 1px; + height: 22px; + background: var(--rylo-border); +} + +.rylo-navbar-title { + color: var(--rylo-dark); + font-weight: 600; + font-size: 1.05rem; + text-decoration: none; +} + +.rylo-navbar-title:hover { + color: var(--rylo-orange-shade); +} + #container { max-width: 1800px; margin: 1em auto; @@ -89,6 +167,15 @@ iframe { padding: 0.1em 0.2em; } +#navbar .nav-link { + color: rgba(25, 20, 18, 0.7); + border-radius: 8px; +} + +#navbar .nav-link:hover { + color: var(--rylo-orange-shade); +} + #refs div[id] { padding-top: 66px; margin-top: -66px; diff --git a/src/template/index.html b/src/template/index.html index 29e932de..a25decc5 100644 --- a/src/template/index.html +++ b/src/template/index.html @@ -5,10 +5,29 @@ + + $if(title-prefix)$$title-prefix$ – $endif$$pagetitle$ + + + + + + + + + + + + + + + $for(author-meta)$ $endfor$ @@ -42,9 +61,15 @@ $for(include-before)$$include-before$$endfor$ -
+
- $if(title-prefix)$$title-prefix$ – $endif$$pagetitle$ + + + + $if(title-prefix)$$title-prefix$ – $endif$$pagetitle$ + Star From 7016778fa2dcd1d6ae4d2f399c6502ef3170b395 Mon Sep 17 00:00:00 2001 From: Ariel Aharonson Date: Wed, 17 Jun 2026 13:43:10 +0300 Subject: [PATCH 2/3] chore: simplify after Rylo branding (drop redundant rules, trim font weights) [SIGN-520] - Remove unused --rylo-card token and the redundant body{} block (Bootstrap reboot already consumes --bs-body-bg/color/font-family). - Drop the redundant font-family override on headings (inherited from body). - Use a --rylo-dark-rgb token for the two translucent dark colors. - Trim the unused 300 weight from the Inter Tight request. Co-Authored-By: Claude Opus 4.8 (1M context) --- src/styles/custom.css | 13 +++---------- src/template/index.html | 2 +- 2 files changed, 4 insertions(+), 11 deletions(-) diff --git a/src/styles/custom.css b/src/styles/custom.css index b09f617c..c1a24149 100644 --- a/src/styles/custom.css +++ b/src/styles/custom.css @@ -7,8 +7,8 @@ --rylo-orange: #ff8b2b; --rylo-orange-shade: #e07826; --rylo-sky: #a9c2d7; - --rylo-card: #eee7e1; - --rylo-border: rgba(25, 20, 18, 0.1); + --rylo-dark-rgb: 25, 20, 18; + --rylo-border: rgba(var(--rylo-dark-rgb), 0.1); --rylo-radius: 16px; --bs-body-bg: var(--rylo-cream); @@ -23,14 +23,7 @@ --bs-nav-pills-link-active-color: #fff; } -body { - background-color: var(--rylo-cream); - color: var(--rylo-dark); - font-family: var(--bs-body-font-family); -} - h1, h2, h3, h4, h5, h6, .rylo-navbar-title { - font-family: var(--bs-body-font-family); letter-spacing: -0.02em; } @@ -168,7 +161,7 @@ iframe { } #navbar .nav-link { - color: rgba(25, 20, 18, 0.7); + color: rgba(var(--rylo-dark-rgb), 0.7); border-radius: 8px; } diff --git a/src/template/index.html b/src/template/index.html index a25decc5..4c7eeb20 100644 --- a/src/template/index.html +++ b/src/template/index.html @@ -26,7 +26,7 @@ - + $for(author-meta)$ From 9e9e5e5732f01a5f43a01bec12ae2d8f12fb4994 Mon Sep 17 00:00:00 2001 From: Ariel Aharonson Date: Wed, 17 Jun 2026 17:04:25 +0300 Subject: [PATCH 3/3] fix: use the Rylo wordmark (not the Rylo Translate logo) in the navbar [SIGN-520] Co-Authored-By: Claude Opus 4.8 (1M context) --- src/assets/rylo-logo.svg | 19 +++++-------------- 1 file changed, 5 insertions(+), 14 deletions(-) diff --git a/src/assets/rylo-logo.svg b/src/assets/rylo-logo.svg index 3aa329ab..9267ef62 100644 --- a/src/assets/rylo-logo.svg +++ b/src/assets/rylo-logo.svg @@ -1,17 +1,8 @@ - - - - - - - - - - - - - - + + + + +