From 6bed9519f3149d9ca4f8eabef62f286b4a652744 Mon Sep 17 00:00:00 2001 From: Claude Date: Fri, 6 Nov 2026 15:32:54 +0000 Subject: [PATCH] Home: say what abap2UI5 is, offer the two ways in, add an Install tile One sentence under the greeting, then two calls - the playground and the quickstart - so a visitor who has never heard the name learns in ten seconds what it is and where to start. An Install tile joins the introduction, the developer tiles come first. The page title carries the product, not only the brand. robots.txt names the sitemaps of the family; the home page gets a sitemap of its own. Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_014YZFmFUSt4hnK572fuJp8R --- AGENTS.md | 9 ++++++--- public/robots.txt | 7 +++++++ public/sitemap.xml | 6 ++++++ src/pages/index.astro | 10 ++++++++-- src/styles/global.css | 16 +++++++++++++++- 5 files changed, 42 insertions(+), 6 deletions(-) create mode 100644 public/robots.txt create mode 100644 public/sitemap.xml diff --git a/AGENTS.md b/AGENTS.md index aace07f..d92c6dc 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -48,9 +48,12 @@ imported; a change to it starts here. ## Rules -- **A greeting, the search and four groups.** The `

` says "Welcome to abap2UI5" and - nothing else introduces the page; the search box sits under it, the logo - beside both. The ids `introduction`, `try-it`, `more`, `community` +- **A greeting, one line, two ways in, the search and four groups.** The `

` says "Welcome to abap2UI5"; + under it one sentence says what abap2UI5 is (the tagline, the only + explanation on the page - a visitor who has never heard the name learns it + here, in ten seconds, and nowhere else on the page), then the two calls: + the playground (nothing to install) and the quickstart (your own system). + The search box sits under them, the logo beside all of it. The ids `introduction`, `try-it`, `more`, `community` are what the test names and what other sites may link; reword a heading freely, keep the `id`. - **A tile is one line of data.** Add, reorder or drop a tool in the `groups` diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..f18344c --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,7 @@ +User-agent: * +Allow: / + +Sitemap: https://abap2ui5.github.io/sitemap.xml +Sitemap: https://abap2ui5.github.io/docs/sitemap.xml +Sitemap: https://abap2ui5.github.io/why/sitemap.xml +Sitemap: https://abap2ui5.github.io/playground/sitemap.xml diff --git a/public/sitemap.xml b/public/sitemap.xml new file mode 100644 index 0000000..daad8eb --- /dev/null +++ b/public/sitemap.xml @@ -0,0 +1,6 @@ + + + https://abap2ui5.github.io/ + https://abap2ui5.github.io/about/ + https://abap2ui5.github.io/search/ + diff --git a/src/pages/index.astro b/src/pages/index.astro index b8446b2..8849f16 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -24,8 +24,9 @@ const groups: Group[] = [ id: "introduction", title: "Introduction", tiles: [ - { href: "https://abap2ui5.github.io/why/", for: "For managers", title: "What is abap2UI5?", text: "The business view: what it means for your team, landscape and budget." }, { href: "https://abap2ui5.github.io/docs/", for: "For developers", title: "How does it work?", text: "The technical view: how it works, how to install it, how to build apps." }, + { href: "https://abap2ui5.github.io/docs/get_started/quickstart", for: "For developers", title: "Install it", text: "An abapGit pull, one handler class, one SICF node: your own system in 15 minutes." }, + { href: "https://abap2ui5.github.io/why/", for: "For managers", title: "What is abap2UI5?", text: "The business view: what it means for your team, landscape and budget." }, ], }, { @@ -61,12 +62,17 @@ const groups: Group[] = [ ]; const base = import.meta.env.BASE_URL; --- - +

Welcome to abap2UI5

+

Build UI5 apps purely in ABAP: one class is one app, no JavaScript, no OData, no frontend project. Open source, from NetWeaver 7.02 to ABAP Cloud.

+

+ Try it in the playground + Install it in 15 minutes +

diff --git a/src/styles/global.css b/src/styles/global.css index 55f35c0..6a6082b 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -85,6 +85,18 @@ img { max-width: 100%; height: auto; } font-size: clamp(28px, 4vw, 40px); font-weight: 700; letter-spacing: -.025em; line-height: 1.15; } .hello-logo { width: 104px; height: 104px; flex: none; align-self: flex-start; } +/* one line that says what abap2UI5 is, and the two ways in: the playground + * (nothing to install) and the quickstart (your own system) */ +.tagline { margin: 0; max-width: 640px; font-size: 17px; line-height: 1.5; color: var(--muted); } +.calls { margin: 0; display: flex; flex-wrap: wrap; gap: 10px; } +.call { + display: inline-block; padding: 9px 16px; border: 1px solid var(--line); border-radius: 999px; + font-size: 15px; font-weight: 600; color: var(--ink); text-decoration: none; + transition: border-color .15s, background .15s, color .15s; +} +.call:hover { border-color: var(--brand); color: var(--brand); } +.call.primary { background: var(--brand); border-color: var(--brand); color: #fff; } +.call.primary:hover { background: var(--brand-strong); border-color: var(--brand-strong); color: #fff; } /* on a phone the logo stays beside the greeting and the search takes the * whole width under both */ @media (max-width: 620px) { @@ -92,7 +104,9 @@ img { max-width: 100%; height: auto; } .hello-text { display: contents; } .welcome { grid-area: 1 / 1; } .hello-logo { grid-area: 1 / 2; width: 64px; height: 64px; align-self: center; } - .search { grid-area: 2 / 1 / 3 / 3; } + .tagline { grid-area: 2 / 1 / 3 / 3; } + .calls { grid-area: 3 / 1 / 4 / 3; } + .search { grid-area: 4 / 1 / 5 / 3; } .search-key { display: none; } }