~repos /website

#astro#js#html#css

git clone https://pyrossh.dev/repos/website.git

木 Personal website of pyrossh. Built with astrojs, shiki, vite.


42dae009 pyrossh

1 year ago
improve pages
src/routes/+page.svelte CHANGED
@@ -88,6 +88,7 @@
88
88
  </div>
89
89
  <p>
90
90
  The only bible app you will ever need. No ads, No in-app purchases, No distractions.
91
+ Works completely offline.
91
92
  </p>
92
93
  </Slide>
93
94
  <section>
src/routes/only-bible-app/+layout.svelte CHANGED
@@ -1,5 +1,37 @@
1
+ <script>
2
+ import Copyright from '$lib/components/Copyright.svelte';
3
+ </script>
4
+
1
5
  <div class="prose h-full sm:w-6/12 mx-auto">
6
+ <header class="flex flex-col mx-4 text-sm mt-4">
7
+ <nav class="flex flex-1 justify-between" aria-label="Global">
8
+ <div class="flex flex-1">
9
+ <a
10
+ class="flex flex-1 items-center text-xl font-semibold text-gray-200 no-underline focus:outline-none focus:ring-1 focus:ring-gray-600"
11
+ href="/only-bible-app"
12
+ aria-label="Brand"
13
+ >
14
+ <div class="flex flex-1">Only Bible App</div>
15
+ </a>
16
+ </div>
17
+ <div class="flex flex-col gap-5 mt-5 sm:flex-row sm:items-center sm:justify-end sm:mt-0">
18
+ <a
19
+ class="text-gray-300 font-medium focus:outline-none focus:ring-1 no-underline hover:text-neutral-100 focus:ring-neutral-200"
20
+ href="/only-bible-app/privacy-policy">Privacy Policy</a
21
+ >
22
+ <a
23
+ class="text-gray-300 font-medium focus:outline-none focus:ring-1 no-underline hover:text-neutral-100 focus:ring-neutral-200"
24
+ href="/only-bible-app/terms-and-conditions">Terms & Conditions</a
25
+ >
26
+ </div>
27
+ </nav>
28
+ </header>
29
+ <main class="flex flex-col mx-4 mt-10 sm:mt-0">
2
- <slot />
30
+ <slot />
31
+ </main>
32
+ <footer class="not-prose text-center py-5 mt-20">
33
+ <Copyright />
34
+ </footer>
3
35
  </div>
4
36
 
5
37
  <style lang="postcss">
src/routes/only-bible-app/+page.svelte CHANGED
@@ -3,7 +3,6 @@
3
3
  import AppStoreIcon from '$lib/assets/icons/appstore.svg?component';
4
4
  import AppIconPng from '$lib/assets/images/app_icon.png';
5
5
  import AppImagePng from '$lib/assets/images/app_image.png?enhanced';
6
- import Copyright from '$lib/components/Copyright.svelte';
7
6
  </script>
8
7
 
9
8
  <svelte:head>
@@ -11,76 +10,47 @@
11
10
  <meta name="description" content="The only bible app you will ever need" />
12
11
  </svelte:head>
13
12
 
13
+ <div class="flex flex-1 flex-col sm:flex-row items-center">
14
- <main class="flex flex-col mx-4">
14
+ <div class="flex flex-col items-center sm:items-start">
15
- <header class="text-sm mt-4">
16
- <nav class="flex flex-1 justify-between" aria-label="Global">
17
- <div class="flex flex-1">
15
+ <div class="block mb-4">
18
- <a
16
+ <h1
19
- class="flex flex-1 items-center text-xl font-semibold text-gray-200 no-underline focus:outline-none focus:ring-1 focus:ring-gray-600"
17
+ class="flex flex-col items-center sm:items-start sm:m-0 text-3xl font-bold text-center sm:text-left lg:leading-tight text-white"
20
- href="/"
21
- aria-label="Brand"
22
- >
18
+ >
23
- <img class="mr-2 w-10 m-0 rounded-xl" src={AppIconPng} alt="Only Bible App" />
19
+ <img class="w-40 m-0 rounded-xl mb-8" src={AppIconPng} alt="Only Bible App" />
24
- <div class="flex flex-1">Only Bible App</div>
20
+ The only bible app you will ever need
25
- </a>
21
+ </h1>
22
+ <div class="text-center sm:text-left flex flex-col text-lg text-neutral-100 sm:mt-5">
23
+ <span>No ads,</span>
24
+ <span>No in-app purchases,</span>
25
+ <span>No distractions.</span>
26
+ <span>Works completely offline.</span>
26
27
  </div>
28
+ </div>
27
- <div class="flex flex-col gap-5 mt-5 sm:flex-row sm:items-center sm:justify-end sm:mt-0">
29
+ <div class="flex flex-col items-center sm:items-start">
30
+ <h3 class="text-gray-200 m-0 my-4">Get it now!</h3>
31
+ <div class="flex flex-col sm:flex-row">
28
32
  <a
29
- class="text-gray-300 font-medium focus:outline-none focus:ring-1 no-underline hover:text-neutral-100 focus:ring-neutral-200"
33
+ class="mt-4 sm:mt-0 sm:mr-2"
30
- href="/only-bible-app/privacy-policy">Privacy Policy</a
34
+ href="https://play.google.com/store/apps/details?id=dev.pyrossh.onlyBible"
35
+ rel="noopener noreferrer"
36
+ target="blank"
31
37
  >
38
+ <PlayStoreIcon class="w-48 sm:w-44" />
39
+ </a>
32
40
  <a
33
- class="text-gray-300 font-medium focus:outline-none focus:ring-1 no-underline hover:text-neutral-100 focus:ring-neutral-200"
41
+ class="mt-8 sm:mt-0"
34
- href="/only-bible-app/terms-and-conditions">Terms & Conditions</a
42
+ href="https://apps.apple.com/us/app/only-bible-app/id6467606465?itsct=apps_box_badge&itscg=30200"
43
+ rel="noopener noreferrer"
44
+ target="blank"
35
45
  >
46
+ <AppStoreIcon class="w-48 sm:w-44" />
47
+ </a>
36
48
  </div>
37
- </nav>
38
- </header>
39
- <div class="flex flex-1 flex-col sm:flex-row items-center mt-10 sm:mt-0">
40
- <div class="flex flex-col items-center sm:items-start">
41
- <div class="block mb-4">
42
- <h1
43
- class="flex flex-col items-center sm:items-start sm:m-0 text-3xl font-bold text-center sm:text-left sm:text-4xl lg:leading-tight text-white"
44
- >
45
- <img class="w-40 m-0 rounded-xl mb-8" src={AppIconPng} alt="Only Bible App" />
46
- The only bible app you will ever need
47
- </h1>
48
- <div class="text-center sm:text-left flex flex-col text-lg text-neutral-100 sm:mt-5">
49
- <span>No ads,</span>
50
- <span>No in-app purchases,</span>
51
- <span>No distractions.</span>
52
- <span>Offline first.</span>
53
- </div>
54
- </div>
55
- <div class="flex flex-col items-center sm:items-start">
56
- <h3 class="text-gray-200 m-0 my-4">Get it now!</h3>
57
- <div class="flex flex-col sm:flex-row">
58
- <a
59
- class="mt-4 sm:mt-0 sm:mr-2"
60
- href="https://play.google.com/store/apps/details?id=dev.pyrossh.onlyBible"
61
- rel="noopener noreferrer"
62
- target="blank"
63
- >
64
- <PlayStoreIcon class="w-48 sm:w-44" />
65
- </a>
66
- <a
67
- class="mt-8 sm:mt-0"
68
- href="https://apps.apple.com/us/app/only-bible-app/id6467606465?itsct=apps_box_badge&itscg=30200"
69
- rel="noopener noreferrer"
70
- target="blank"
71
- >
72
- <AppStoreIcon class="w-48 sm:w-44" />
73
- </a>
74
- </div>
75
- </div>
76
- </div>
77
- <div
78
- class="not-prose flex items-center mt-10 sm:mt-20 sm:flex-row [&>picture]:flex [&>picture]:justify-center sm:[&>picture]:justify-end"
79
- >
80
- <enhanced:img class="w-9/12" src={AppImagePng} alt="app screenshot" />
81
49
  </div>
82
50
  </div>
51
+ <div
52
+ class="not-prose flex items-center mt-10 sm:mt-20 sm:flex-row [&>picture]:flex [&>picture]:justify-center sm:[&>picture]:justify-end"
53
+ >
83
- <footer class="not-prose text-center py-5 mt-20">
54
+ <enhanced:img class="w-9/12" src={AppImagePng} alt="app screenshot" />
84
- <Copyright />
85
- </footer>
86
- </main>
55
+ </div>
56
+ </div>
src/routes/only-bible-app/privacy-policy/+page.svelte CHANGED
@@ -2,7 +2,7 @@
2
2
  <title>Privacy Policy | Only Bible App</title>
3
3
  </svelte:head>
4
4
 
5
- <main class="mx-4 text-gray-300">
5
+ <main class="text-gray-300 mt-10">
6
6
  <h1 class="text-center">Privacy Policy</h1>
7
7
  <p>
8
8
  Only Bible App does not collect any information about you or your usage of the app. It does not
src/routes/only-bible-app/terms-and-conditions/+page.svelte CHANGED
@@ -2,7 +2,7 @@
2
2
  <title>Terms and Conditions | Only Bible App</title>
3
3
  </svelte:head>
4
4
 
5
- <main class="mx-4 pb-10 text-gray-300">
5
+ <main class="pb-10 text-gray-300 mt-10">
6
6
  <h1 class="text-center text-3xl">Terms and Conditions</h1>
7
7
  <p>
8
8
  By downloading or using the app, these terms will automatically apply to you – you should make