feat(landing-page): shorter install script (#280)
This commit is contained in:
Ayo Ayco
GitHub
parent
c2384944fb
commit
6e27739d7e
5 changed files with 168 additions and 165 deletions
5
.changeset/chilly-rules-crash.md
Normal file
5
.changeset/chilly-rules-crash.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
"@astro-reactive/landing-page": major
|
||||
---
|
||||
|
||||
Make the npm install script shorter
|
||||
1
.github/pull_request_template.md
vendored
1
.github/pull_request_template.md
vendored
|
|
@ -23,6 +23,7 @@ Tag a reviewer: @
|
|||
Tasks:
|
||||
- [ ] I have ran the build command to make sure apps are working: `npm run build`
|
||||
- [ ] I have ran the tests to make sure nothing is broken: `npm run test`
|
||||
- [ ] I have ran the Astro checker: `npm run check`
|
||||
- [ ] I have ran the linter to make sure code is clean: `npm run lint`
|
||||
- [ ] I have reviewed my own code to remove changes that are not needed
|
||||
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
---
|
||||
import { Icon } from "astro-icon";
|
||||
import { Icon } from 'astro-icon';
|
||||
---
|
||||
|
||||
<div
|
||||
|
|
@ -46,13 +46,11 @@ import { Icon } from "astro-icon";
|
|||
</div>
|
||||
|
||||
<button
|
||||
class="copy-btn flex items-center w-4/5 mt-3 justify-center astro-md:w-1/2 astro-lg:w-[28%] astro-lg:mt-0 astro-lg:ml-3 max-w-md"
|
||||
class="copy-btn flex items-center w-4/5 mt-3 justify-center max-w-xs astro-md:w-1/2 astro-lg:w-sm astro-lg:mt-0 astro-lg:ml-3"
|
||||
id="copy-command-button"
|
||||
>
|
||||
<span id="command"
|
||||
>npm install @astro-reactive/form @astro-reactive/validator</span
|
||||
>
|
||||
<Icon name="mdi:content-copy" width="40px" height="40px" />
|
||||
<span id="command">> npm install @astro-reactive/form</span>
|
||||
<Icon name="mdi:content-copy" width="30px" height="30px" />
|
||||
</button>
|
||||
|
||||
<style>
|
||||
|
|
@ -68,6 +66,11 @@ import { Icon } from "astro-icon";
|
|||
transition: background-color 0.2s ease-in-out;
|
||||
}
|
||||
|
||||
span#command {
|
||||
margin-right: 1rem;
|
||||
padding: 0.5rem 0;
|
||||
}
|
||||
|
||||
.copy-btn > span {
|
||||
white-space: nowrap;
|
||||
overflow-x: hidden;
|
||||
|
|
@ -89,19 +92,19 @@ import { Icon } from "astro-icon";
|
|||
</style>
|
||||
|
||||
<script>
|
||||
const copyCommandButton = document.getElementById("copy-command-button");
|
||||
const commandText = document.getElementById("command").innerText;
|
||||
const toastSuccess = document.getElementById("toast-success");
|
||||
const toastClose = document.getElementById("toast-close-btn");
|
||||
const copyCommandButton = document.getElementById('copy-command-button');
|
||||
const commandText = document.getElementById('command').innerText;
|
||||
const toastSuccess = document.getElementById('toast-success');
|
||||
const toastClose = document.getElementById('toast-close-btn');
|
||||
|
||||
copyCommandButton?.addEventListener("click", () => {
|
||||
toastSuccess.style.transform = "translateX(-50%) translateY(0)";
|
||||
toastSuccess.style.opacity = "1";
|
||||
copyCommandButton?.addEventListener('click', () => {
|
||||
toastSuccess.style.transform = 'translateX(-50%) translateY(0)';
|
||||
toastSuccess.style.opacity = '1';
|
||||
navigator.clipboard.writeText(commandText);
|
||||
});
|
||||
|
||||
toastClose?.addEventListener("click", () => {
|
||||
toastSuccess.style.transform = "translateX(-50%) translateY(100%)";
|
||||
toastSuccess.style.opacity = "0";
|
||||
toastClose?.addEventListener('click', () => {
|
||||
toastSuccess.style.transform = 'translateX(-50%) translateY(100%)';
|
||||
toastSuccess.style.opacity = '0';
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
---
|
||||
import "~/styles/index.css";
|
||||
import Header from "~/components/header.astro";
|
||||
import '~/styles/index.css';
|
||||
import Header from '~/components/header.astro';
|
||||
// import Icon from "astro-icon";
|
||||
import Splash from "~/components/splash.astro";
|
||||
import Splash from '~/components/splash.astro';
|
||||
// import AstroSection from "~/sections/astro-section.astro";
|
||||
import Starfield from "~/components/starfield.astro";
|
||||
import Starfield from '~/components/starfield.astro';
|
||||
|
||||
const { site } = Astro;
|
||||
const image = new URL("social.jpg", site);
|
||||
const image = new URL('social.jpg', site);
|
||||
const description =
|
||||
"Library of components and utilities for building reactive user interfaces with Astro";
|
||||
'Library of components and utilities for building reactive user interfaces with Astro';
|
||||
---
|
||||
|
||||
<html lang="en" class="h-full motion-safe:scroll-smooth" data-theme="dark">
|
||||
|
|
@ -18,7 +18,6 @@ const description =
|
|||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" href="/favicon.ico" sizes="any" />
|
||||
|
||||
|
||||
<title>Astro Reactive | {description} 🚀</title>
|
||||
<meta name="description" content={description} />
|
||||
|
||||
|
|
@ -52,7 +51,7 @@ const description =
|
|||
|
||||
<!-- initialize theme -->
|
||||
<script is:inline>
|
||||
document.documentElement.dataset.theme = "dark";
|
||||
document.documentElement.dataset.theme = 'dark';
|
||||
// const themeSaved = localStorage.getItem("theme");
|
||||
// const forceTheme = "dark";
|
||||
|
||||
|
|
@ -83,10 +82,5 @@ const description =
|
|||
<Header />
|
||||
<Splash />
|
||||
<!--AstroSection /-->
|
||||
|
||||
|
||||
<!-- for Mastodon verification -->
|
||||
<a rel="me" href="https://fosstodon.org/@ayo" style="display:none">Mastodon</a>
|
||||
<a rel="me" href="https://social.ayco.io/@ayo" style="display:none">Mastodon</a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
6
package-lock.json
generated
6
package-lock.json
generated
|
|
@ -12670,7 +12670,7 @@
|
|||
},
|
||||
"packages/common": {
|
||||
"name": "@astro-reactive/common",
|
||||
"version": "0.1.7",
|
||||
"version": "0.1.8",
|
||||
"license": "MIT",
|
||||
"devDependencies": {
|
||||
"@astro-reactive/tsconfig": "*",
|
||||
|
|
@ -12679,7 +12679,7 @@
|
|||
},
|
||||
"packages/form": {
|
||||
"name": "@astro-reactive/form",
|
||||
"version": "0.7.1",
|
||||
"version": "0.7.2",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@astro-reactive/common": "*",
|
||||
|
|
@ -13027,7 +13027,7 @@
|
|||
},
|
||||
"packages/validator": {
|
||||
"name": "@astro-reactive/validator",
|
||||
"version": "0.3.1",
|
||||
"version": "0.3.2",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@astro-reactive/common": "*"
|
||||
|
|
|
|||
Loading…
Reference in a new issue