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; } }