From ea94d44e53f9cb9a0f2b27298093a0cc0b59b498 Mon Sep 17 00:00:00 2001 From: Alex Ost Date: Mon, 27 Jul 2026 14:58:09 +0200 Subject: [PATCH 1/2] Added Search page --- website/modules/@apostrophecms/page/index.js | 6 + .../@apostrophecms/search/views/index.html | 68 ++++++++ website/modules/asset/ui/src/index.scss | 1 + .../modules/asset/ui/src/scss/_search.scss | 165 ++++++++++++++++++ .../public/js/home-simplified.js | 9 - .../modules/home-simplified/views/page.html | 4 +- website/modules/testimonials/index.js | 1 - .../css/home-simplified/home-simplified.css | 17 +- 8 files changed, 250 insertions(+), 21 deletions(-) create mode 100644 website/modules/@apostrophecms/search/views/index.html create mode 100644 website/modules/asset/ui/src/scss/_search.scss delete mode 100644 website/modules/home-simplified/public/js/home-simplified.js diff --git a/website/modules/@apostrophecms/page/index.js b/website/modules/@apostrophecms/page/index.js index 9a62877e..85a670a3 100644 --- a/website/modules/@apostrophecms/page/index.js +++ b/website/modules/@apostrophecms/page/index.js @@ -32,6 +32,12 @@ module.exports = { title: 'Case Studies', }, }, + { + slug: '/search', + parkedId: 'search', + title: 'Search', + type: '@apostrophecms/search', + }, ], }, }; diff --git a/website/modules/@apostrophecms/search/views/index.html b/website/modules/@apostrophecms/search/views/index.html new file mode 100644 index 00000000..eeaf0136 --- /dev/null +++ b/website/modules/@apostrophecms/search/views/index.html @@ -0,0 +1,68 @@ +{% extends 'layout.html' %} + +{% block title %} + {{ data.page.title }} +{% endblock %} +{% import '@apostrophecms/pager:macros.html' as pager with context %} + +{% block extraHead %} + {{ super() }} +{% endblock %} + +{% block main %} +
+

{{ __('Search Results') }}

+ + {% if data.query.search %} +

+ {{ __('Showing Results for ') }}'{{ data.query.search }}' +

+ {% endif %} + + {% if data.docs|length > 0 %} +
+ {% for doc in data.docs %} + {% if doc.type == 'case-studies' %} + {% set meta = __('Case Study') %} + {% set resultUrl = doc._url %} + {% elif doc.type == 'team-members' %} + {% set meta = __('Team Member') %} + {% set resultUrl = '/meet-the-team' %} + {% elif doc.type == 'testimonials' %} + {% set meta = __('Testimonial') %} + {% set resultUrl = '/cases' %} + {% elif doc.type == 'vacancies' %} + {% set meta = __('Job Opening') %} + {% set resultUrl = '/careers' %} + {% elif doc.type == 'business-partner' %} + {% set meta = __('Partner') %} + {% set resultUrl = '/about-us' %} + {% else %} + {% set meta = __('Page') %} + {% set resultUrl = doc._url %} + {% endif %} + +
+

{{ meta }}

+ + {{ doc.title }} + + +
+ {% endfor %} +
+ {% else %} +

+ {{ __('Sorry, there are no results that match your search.') }} +

+ {% endif %} + + {% if data.totalPages > 1 %} +
+ {{ + pager.render({ page: data.currentPage, total: data.totalPages, class: 'c-pagination', shown: 2 }, data.url) + }} +
+ {% endif %} +
+{% endblock %} diff --git a/website/modules/asset/ui/src/index.scss b/website/modules/asset/ui/src/index.scss index 6fcd1654..0e6b3bfa 100644 --- a/website/modules/asset/ui/src/index.scss +++ b/website/modules/asset/ui/src/index.scss @@ -26,4 +26,5 @@ @import './scss/_not-found.scss'; @import './scss/_table-widget'; @import './scss/_vacancies'; +@import './scss/_search'; @import './scss/_animation'; diff --git a/website/modules/asset/ui/src/scss/_search.scss b/website/modules/asset/ui/src/scss/_search.scss new file mode 100644 index 00000000..37c2ffcb --- /dev/null +++ b/website/modules/asset/ui/src/scss/_search.scss @@ -0,0 +1,165 @@ +.sf-search-page { + --sf-ink: #141414; + --sf-muted: #6B6B6B; + --sf-teal: #00897B; + --sf-rule: rgba(20, 20, 20, 0.1); + max-width: 768px; + margin: 0 auto; + padding: 24px 0 96px; + color: var(--sf-ink); + font-family: Poppins, sans-serif; + -webkit-font-smoothing: antialiased; +} + +.sf-search-page__heading { + margin: 0; + font-size: 40px; + font-weight: 800; + line-height: 1.15; + letter-spacing: -1.8px; +} + +.sf-search-page__term { + margin: 20px 0 0; + font-size: 12px; + font-weight: 600; + line-height: 1.4; +} + +.sf-search-page__term span { + border-bottom: 2px solid var(--sf-teal); + padding-bottom: 3px; +} + +.sf-search-page__results { + margin-top: 76px; +} + +.sf-search-page__result { + padding: 18px 0 20px; + border-bottom: 1px solid var(--sf-rule); +} + +.sf-search-page__meta { + margin: 0 0 8px; + color: var(--sf-muted); + font-size: 8px; + font-weight: 800; + line-height: 1.2; + letter-spacing: 0.16em; + text-transform: uppercase; +} + +.sf-search-page__link { + display: inline-flex; + align-items: center; + gap: 10px; + color: var(--sf-ink); + font-size: 19px; + font-weight: 600; + line-height: 1.35; + letter-spacing: -0.55px; + text-decoration: none; + transition: color 0.2s ease; +} + +.sf-search-page__arrow { + color: var(--sf-teal); + font-size: 16px; + font-weight: 600; + transition: transform 0.2s ease; +} + +.sf-search-page__link:hover { + color: var(--sf-teal); +} + +.sf-search-page__link:hover .sf-search-page__arrow { + transform: translateX(4px); +} + +.sf-search-page__empty { + margin: 76px 0 0; + font-size: 19px; + font-weight: 600; +} + +.sf-search-page .c-pagination { + display: flex; + justify-content: flex-start; + margin-top: 48px; + font-family: Poppins, sans-serif; +} + +.sf-search-page .c-pagination ul { + display: flex; + align-items: center; + gap: 8px; + margin: 0; + padding: 0; + list-style: none; +} + +.sf-search-page .c-pagination li { + margin: 0; +} + +.sf-search-page .c-pagination a, +.sf-search-page .c-pagination span { + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 32px; + height: 32px; + padding: 0 8px; + border: 1px solid var(--sf-rule); + color: var(--sf-ink); + font-size: 11px; + font-weight: 600; + line-height: 1; + text-decoration: none; + transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease; +} + +.sf-search-page .c-pagination a:hover { + border-color: var(--sf-teal); + color: var(--sf-teal); +} + +.sf-search-page .c-pagination .current, +.sf-search-page .c-pagination [aria-current='page'] { + border-color: var(--sf-ink); + background: var(--sf-ink); + color: #fff; +} + +.sf-search-page .c-pagination .disabled, +.sf-search-page .c-pagination [aria-disabled='true'] { + color: var(--sf-muted); + opacity: 0.5; +} + +@media (max-width: 820px) { + .sf-search-page { + padding: 44px 24px 72px; + } +} + +@media (max-width: 600px) { + .sf-search-page { + padding-top: 32px; + } + + .sf-search-page__heading { + font-size: 32px; + letter-spacing: -1.2px; + } + + .sf-search-page__results { + margin-top: 56px; + } + + .sf-search-page__link { + font-size: 17px; + } +} diff --git a/website/modules/home-simplified/public/js/home-simplified.js b/website/modules/home-simplified/public/js/home-simplified.js deleted file mode 100644 index 8d7a2bf6..00000000 --- a/website/modules/home-simplified/public/js/home-simplified.js +++ /dev/null @@ -1,9 +0,0 @@ -document.addEventListener('DOMContentLoaded', function() { - const searchForm = document.getElementById('search-form'); - if (searchForm) { - searchForm.addEventListener('submit', function(e) { - e.preventDefault(); - window.location.href = '/search'; - }); - } -}); diff --git a/website/modules/home-simplified/views/page.html b/website/modules/home-simplified/views/page.html index e039eb85..a05566be 100644 --- a/website/modules/home-simplified/views/page.html +++ b/website/modules/home-simplified/views/page.html @@ -27,10 +27,10 @@

Speed & Function is an engineering and AI consultancy. For over a decade Here's what matters most while
the new site takes shape. - diff --git a/website/modules/testimonials/index.js b/website/modules/testimonials/index.js index b9ecae24..686d8908 100644 --- a/website/modules/testimonials/index.js +++ b/website/modules/testimonials/index.js @@ -3,7 +3,6 @@ module.exports = { options: { label: 'Testimonial', pluralLabel: 'Testimonials', - searchable: false, shortcut: false, }, fields: { diff --git a/website/public/css/home-simplified/home-simplified.css b/website/public/css/home-simplified/home-simplified.css index ef966019..cdabea37 100644 --- a/website/public/css/home-simplified/home-simplified.css +++ b/website/public/css/home-simplified/home-simplified.css @@ -103,7 +103,7 @@ body { align-items: center; gap: 10px; padding: 12px 24px; - border-radius: 999px; + border-radius: 0; background: #141414; color: #fff; font-size: 12px; @@ -247,17 +247,16 @@ svg.sicon { } .ca-search .sgo { - font-size: 12px; - font-weight: 800; - letter-spacing: 0.1em; - text-transform: uppercase; + font-size: 22px; color: #6B6B6B; + display: inline-block; flex: 0 0 auto; - transition: color .2s ease; + transition: transform .3s cubic-bezier(.16,1,.3,1), color .3s ease; } .ca-search:focus-within .sgo { color: #00897B; + transform: translateX(10px) rotate(45deg); } .ca-search:focus-within { @@ -270,7 +269,7 @@ svg.sicon { .ca-index { border-top: none; - margin-top: 28px; + margin-top: 80px; animation: fade-up .8s cubic-bezier(.16,1,.3,1) .3s both; } @@ -322,7 +321,7 @@ svg.sicon { } .ca-foot { - padding: 52px 0 60px; + padding: 120px 0 60px; display: flex; align-items: center; justify-content: space-between; @@ -456,7 +455,7 @@ svg.sicon { } .ca-search .sgo { - display: none; + font-size: 16px; } .ca-index { From 8d9cef65577d8e592803afdb62cffb292adaaf59 Mon Sep 17 00:00:00 2001 From: Alex Ost Date: Mon, 27 Jul 2026 15:09:43 +0200 Subject: [PATCH 2/2] rabbit fixes --- website/modules/@apostrophecms/search/views/index.html | 4 ++-- website/modules/asset/ui/src/index.scss | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/website/modules/@apostrophecms/search/views/index.html b/website/modules/@apostrophecms/search/views/index.html index eeaf0136..0bba2dc1 100644 --- a/website/modules/@apostrophecms/search/views/index.html +++ b/website/modules/@apostrophecms/search/views/index.html @@ -13,9 +13,9 @@

{{ __('Search Results') }}

- {% if data.query.search %} + {% if data.query.q %}

- {{ __('Showing Results for ') }}'{{ data.query.search }}' + {{ __('Showing Results for ') }}'{{ data.query.q }}'

{% endif %} diff --git a/website/modules/asset/ui/src/index.scss b/website/modules/asset/ui/src/index.scss index 0e6b3bfa..53bac250 100644 --- a/website/modules/asset/ui/src/index.scss +++ b/website/modules/asset/ui/src/index.scss @@ -26,5 +26,5 @@ @import './scss/_not-found.scss'; @import './scss/_table-widget'; @import './scss/_vacancies'; -@import './scss/_search'; +@import './scss/search'; @import './scss/_animation';