~repos /website

#astro#js#html#css

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

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


bfca4808 pyrossh

7 months ago
fix formatting
only-bible-app/+page.svelte DELETED
@@ -1,57 +0,0 @@
1
- <script>
2
- import PlayStoreIcon from '$lib/assets/icons/playstore.svg?component';
3
- import AppStoreIcon from '$lib/assets/icons/appstore.svg?component';
4
- import AppIconPng from '$lib/assets/images/app_icon.png';
5
- import AppImagePng from '$lib/assets/images/app_image.png?enhanced';
6
- </script>
7
-
8
- <svelte:head>
9
- <title>Only Bible App</title>
10
- <meta name="description" content="The only bible app you will ever need" />
11
- </svelte:head>
12
-
13
- <div class="flex flex-1 flex-col sm:flex-row items-center">
14
- <div class="flex flex-col items-center sm:items-start">
15
- <div class="block mb-4">
16
- <h1
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"
18
- >
19
- <img class="w-40 m-0 rounded-xl mb-8" src={AppIconPng} alt="Only Bible App" />
20
- The only bible app you will ever need
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>
27
- <!-- <span>11 Indian, 12 European, and 8 Asian languages available.</span> -->
28
- </div>
29
- </div>
30
- <div class="flex flex-col items-center sm:items-start">
31
- <h3 class="text-gray-200 m-0 my-4">Get it now!</h3>
32
- <div class="flex flex-col sm:flex-row">
33
- <a
34
- class="mt-4 sm:mt-0 sm:mr-2"
35
- href="https://play.google.com/store/apps/details?id=dev.pyrossh.onlyBible"
36
- rel="noopener noreferrer"
37
- target="blank"
38
- >
39
- <PlayStoreIcon class="w-48 sm:w-44" />
40
- </a>
41
- <a
42
- class="mt-8 sm:mt-0"
43
- href="https://apps.apple.com/us/app/only-bible-app/id6467606465?itsct=apps_box_badge&itscg=30200"
44
- rel="noopener noreferrer"
45
- target="blank"
46
- >
47
- <AppStoreIcon class="w-48 sm:w-44" />
48
- </a>
49
- </div>
50
- </div>
51
- </div>
52
- <div
53
- class="flex items-center mt-10 sm:mt-20 sm:flex-row [&>picture]:flex [&>picture]:justify-center sm:[&>picture]:justify-end"
54
- >
55
- <enhanced:img class="w-9/12" src={AppImagePng} alt="app screenshot" />
56
- </div>
57
- </div>
only-bible-app/privacy-policy/+page.svelte DELETED
@@ -1,20 +0,0 @@
1
- <svelte:head>
2
- <title>Privacy Policy | Only Bible App</title>
3
- </svelte:head>
4
-
5
- <main class="text-gray-300 mt-10">
6
- <h1 class="text-center">Privacy Policy</h1>
7
- <p>
8
- Only Bible App does not collect any information about you or your usage of the app. It does not
9
- send any information about you to anyone. It does not contain ads. It will never install
10
- additional products on your device or change your device's configuration. No ads, No in-app
11
- purchases, No distractions.
12
- </p>
13
- <h4>Changes to this Privacy Policy</h4>
14
- I may update our Privacy Policy from time to time. Thus, you are advised to review this page periodically
15
- for any changes. I will notify you of any changes by posting the new Privacy Policy on this page.
16
- <p>This policy is effective as of <strong class="text-gray-300">2023-09-08</strong></p>
17
- <h4>Contact Us</h4>
18
- If you have any questions or suggestions for us you can contact us at
19
- <strong class="text-gray-300">pyros2097@gmail.com</strong>
20
- </main>
only-bible-app/terms-and-conditions/+page.svelte DELETED
@@ -1,38 +0,0 @@
1
- <svelte:head>
2
- <title>Terms and Conditions | Only Bible App</title>
3
- </svelte:head>
4
-
5
- <main class="pb-10 text-gray-300 mt-10">
6
- <h1 class="text-center text-3xl">Terms and Conditions</h1>
7
- <p>
8
- By downloading or using the app, these terms will automatically apply to you – you should make
9
- sure therefore that you read them carefully before using the app. You’re not allowed to copy or
10
- modify the app, any part of the app, or our trademarks in any way. You’re not allowed to attempt
11
- to extract the source code of the app, and you also shouldn’t try to translate the app into
12
- other languages or make derivative versions. The app itself, and all the trademarks, copyright,
13
- database rights, and other intellectual property rights related to it, still belong to us.
14
- </p>
15
- <p>
16
- We are committed to ensuring that the app is as useful and efficient as possible. For that
17
- reason, we reserve the right to make changes to the app or to charge for its services, at any
18
- time and for any reason. We will never charge you for the app or its services without making it
19
- very clear to you exactly what you’re paying for.
20
- </p>
21
- <p>
22
- The Only Bible App app stores and processes personal data that you have provided to us, to
23
- provide my Service. It’s your responsibility to keep your phone and access to the app secure. We
24
- therefore recommend that you do not jailbreak or root your phone, which is the process of
25
- removing software restrictions and limitations imposed by the official operating system of your
26
- device. It could make your phone vulnerable to malware/viruses/malicious programs, compromise
27
- your phone’s security features and it could mean that the Only Bible App app won’t work properly
28
- or at all.
29
- </p>
30
- <h4>Changes to this Terms and conditions</h4>
31
- I may update our Terms and conditions from time to time. Thus, you are advised to review this page
32
- periodically for any changes. I will notify you of any changes by posting the new Terms and conditions
33
- on this page.
34
- <p>This policy is effective as of <strong class="text-gray-300">2023-09-08</strong></p>
35
- <h4>Contact Us</h4>
36
- If you have any questions or suggestions for us you can contact us at
37
- <strong class="text-gray-300">pyros2097@gmail.com</strong>
38
- </main>
src/components/BaseHead.astro DELETED
@@ -1,55 +0,0 @@
1
- ---
2
- // Import the global.css file here so that it is included on
3
- // all pages through the use of the <BaseHead /> component.
4
- import '../styles/global.css';
5
- import { SITE_TITLE } from '../consts';
6
-
7
- interface Props {
8
- title: string;
9
- description: string;
10
- image?: string;
11
- }
12
-
13
- const canonicalURL = new URL(Astro.url.pathname, Astro.site);
14
-
15
- const { title, description, image = '/blog-placeholder-1.jpg' } = Astro.props;
16
- ---
17
-
18
- <!-- Global Metadata -->
19
- <meta charset="utf-8" />
20
- <meta name="viewport" content="width=device-width,initial-scale=1" />
21
- <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
22
- <link rel="sitemap" href="/sitemap-index.xml" />
23
- <link
24
- rel="alternate"
25
- type="application/rss+xml"
26
- title={SITE_TITLE}
27
- href={new URL('rss.xml', Astro.site)}
28
- />
29
- <meta name="generator" content={Astro.generator} />
30
-
31
- <!-- Font preloads -->
32
- <link rel="preload" href="/fonts/atkinson-regular.woff" as="font" type="font/woff" crossorigin />
33
- <link rel="preload" href="/fonts/atkinson-bold.woff" as="font" type="font/woff" crossorigin />
34
-
35
- <!-- Canonical URL -->
36
- <link rel="canonical" href={canonicalURL} />
37
-
38
- <!-- Primary Meta Tags -->
39
- <title>{title}</title>
40
- <meta name="title" content={title} />
41
- <meta name="description" content={description} />
42
-
43
- <!-- Open Graph / Facebook -->
44
- <meta property="og:type" content="website" />
45
- <meta property="og:url" content={Astro.url} />
46
- <meta property="og:title" content={title} />
47
- <meta property="og:description" content={description} />
48
- <meta property="og:image" content={new URL(image, Astro.url)} />
49
-
50
- <!-- Twitter -->
51
- <meta property="twitter:card" content="summary_large_image" />
52
- <meta property="twitter:url" content={Astro.url} />
53
- <meta property="twitter:title" content={title} />
54
- <meta property="twitter:description" content={description} />
55
- <meta property="twitter:image" content={new URL(image, Astro.url)} />
src/components/Footer.astro CHANGED
@@ -1,41 +1,45 @@
1
1
  ---
2
+ import Wrapper from "./Wrapper.astro";
3
+
2
4
  const today = new Date();
3
5
  ---
4
6
 
5
7
  <footer>
8
+ <Wrapper>
6
- <div class="wrapper container">
9
+ <div class="container">
7
- <div class="flex-1"></div>
10
+ <div class="flex-1"></div>
8
- <div class="flex items-center justify-center mx-2">
11
+ <div class="flex items-center justify-center mx-2">
9
- <span class="text-base text-gray-200 hover:no-underline mr-2">
12
+ <span class="text-base text-gray-200 hover:no-underline mr-2">
10
- Copyright © {today.getFullYear()}
13
+ Copyright © {today.getFullYear()}
11
- <a class="link" href="https://git.sr.ht/~pyrossh/"> pyrossh </a>
14
+ <a class="link" href="https://git.sr.ht/~pyrossh/"> pyrossh </a>
12
- </span>
15
+ </span>
13
- </div>
16
+ </div>
14
- </div>
17
+ </div>
18
+ </Wrapper>
15
19
  </footer>
16
20
  <style>
17
- footer {
21
+ footer {
18
- background: var(--color-black);
22
+ background: var(--color-black);
19
- }
23
+ }
20
24
 
21
- .container {
25
+ .container {
22
- display: flex;
26
+ display: flex;
23
- flex-direction: row;
27
+ flex-direction: row;
24
- flex: 1;
28
+ flex: 1;
25
- padding: 16px 0px;
29
+ padding: 16px 0px;
26
- }
30
+ }
27
31
 
28
- .link {
32
+ .link {
29
- color: var(--color-white);
33
+ color: var(--color-white);
30
- font-weight: 500;
34
+ font-weight: 500;
31
- text-underline-offset: 2px;
35
+ text-underline-offset: 2px;
32
- text-decoration-thickness: 2px;
36
+ text-decoration-thickness: 2px;
33
- text-decoration-line: underline;
37
+ text-decoration-line: underline;
34
- text-decoration-color: white;
38
+ text-decoration-color: white;
35
39
 
36
- &:hover {
40
+ &:hover {
37
- color: var(--color-gray-200);
41
+ color: var(--color-gray-200);
38
- text-decoration-color: var(--color-gray-200);
42
+ text-decoration-color: var(--color-gray-200);
39
- }
43
+ }
40
- }
44
+ }
41
45
  </style>
src/components/Header.astro CHANGED
@@ -1,77 +1,80 @@
1
1
  ---
2
- import HeaderLink from './HeaderLink.astro';
2
+ import HeaderLink from "./HeaderLink.astro";
3
+ import Wrapper from "./Wrapper.astro";
3
4
  ---
4
5
 
5
6
  <header>
6
- <nav class="wrapper">
7
+ <Wrapper>
8
+ <nav>
7
- <HeaderLink class="logo" href="/"> 木 pyrossh </HeaderLink>
9
+ <HeaderLink class="logo" href="/"> 木 pyrossh </HeaderLink>
8
- <div class="links">
10
+ <div class="links">
9
- <HeaderLink href="/cv">cv</HeaderLink>
11
+ <HeaderLink href="/cv">cv</HeaderLink>
10
- <div>|</div>
12
+ <div>|</div>
11
- <HeaderLink href="/posts">posts</HeaderLink>
13
+ <HeaderLink href="/posts">posts</HeaderLink>
12
- <div>|</div>
14
+ <div>|</div>
13
- <HeaderLink href="https://git.sr.ht/~pyrossh/">code</HeaderLink>
15
+ <HeaderLink href="https://git.sr.ht/~pyrossh/">code</HeaderLink>
14
- </div>
16
+ </div>
15
- </nav>
17
+ </nav>
18
+ </Wrapper>
16
19
  </header>
17
20
  <style>
18
- header {
21
+ header {
19
- background-color: var(--color-black);
22
+ background-color: var(--color-black);
20
- border-top: 5px solid #444;
23
+ border-top: 5px solid #444;
21
- border-bottom: 1px solid #444;
24
+ border-bottom: 1px solid #444;
22
- min-height: 56px;
25
+ min-height: 56px;
23
- position: relative;
26
+ position: relative;
24
- }
27
+ }
25
28
 
26
- nav {
29
+ nav {
27
- /* padding-left: 0px; */
30
+ /* padding-left: 0px; */
28
- /* padding-right: 0px; */
31
+ /* padding-right: 0px; */
29
- }
32
+ }
30
33
 
31
- .logo {
34
+ .logo {
32
- display: flex;
35
+ display: flex;
33
- font-size: 22px;
36
+ font-size: 22px;
34
- line-height: 56px;
37
+ line-height: 56px;
35
- font-weight: 400;
38
+ font-weight: 400;
36
- margin-bottom: 0;
39
+ margin-bottom: 0;
37
- float: left;
40
+ float: left;
38
- color: var(--color-accent);
41
+ color: var(--color-accent);
39
- margin-right: 8px;
42
+ margin-right: 8px;
40
43
 
41
- &.active,
44
+ &.active,
42
- &:hover {
45
+ &:hover {
43
- color: var(--color-accent);
46
+ color: var(--color-accent);
44
- text-decoration: underline;
47
+ text-decoration: underline;
45
- text-decoration-color: var(--color-accent);
48
+ text-decoration-color: var(--color-accent);
46
- text-underline-offset: 8px;
49
+ text-underline-offset: 8px;
47
- }
50
+ }
48
- }
51
+ }
49
52
 
50
- .links {
53
+ .links {
51
- display: flex;
54
+ display: flex;
52
- flex-direction: row;
55
+ flex-direction: row;
53
- float: right;
56
+ float: right;
54
- font-size: 22px;
57
+ font-size: 22px;
55
- line-height: 56px;
58
+ line-height: 56px;
56
- color: white;
59
+ color: white;
57
- }
60
+ }
58
61
 
59
- .links a {
62
+ .links a {
60
- display: inline-block;
63
+ display: inline-block;
61
- text-decoration: none;
64
+ text-decoration: none;
62
- font-size: 22px;
65
+ font-size: 22px;
63
- line-height: 56px;
66
+ line-height: 56px;
64
- color: white;
67
+ color: white;
65
- font-weight: 400;
68
+ font-weight: 400;
66
- padding-left: 12px;
69
+ padding-left: 12px;
67
- padding-right: 12px;
70
+ padding-right: 12px;
68
71
 
69
- &.active,
72
+ &.active,
70
- &:hover {
73
+ &:hover {
71
- color: var(--color-gray-200);
74
+ color: var(--color-gray-200);
72
- text-decoration: underline;
75
+ text-decoration: underline;
73
- text-decoration-color: var(--color-accent);
76
+ text-decoration-color: var(--color-accent);
74
- text-underline-offset: 8px;
77
+ text-underline-offset: 8px;
75
- }
78
+ }
76
- }
79
+ }
77
80
  </style>
src/components/Wrapper.astro ADDED
@@ -0,0 +1,19 @@
1
+ <div>
2
+ <slot />
3
+ </div>
4
+
5
+ <style>
6
+ div {
7
+ width: calc(95ex - (1em * 2));
8
+ margin-right: auto;
9
+ margin-left: auto;
10
+ padding-left: 1em;
11
+ padding-right: 1em;
12
+ }
13
+
14
+ @media (max-width: 720px) {
15
+ div {
16
+ width: 100%;
17
+ }
18
+ }
19
+ </style>
src/layouts/Base.astro CHANGED
@@ -1,73 +1,66 @@
1
1
  ---
2
- import { Font } from 'astro:assets';
2
+ import { Font } from "astro:assets";
3
- import BaseHead from '../components/BaseHead.astro';
4
- import Header from '../components/Header.astro';
3
+ import Header from "@/components/Header.astro";
5
- import Footer from '../components/Footer.astro';
4
+ import Footer from "@/components/Footer.astro";
6
- import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
5
+ import Wrapper from "@/components/Wrapper.astro";
7
- // import '@effective/css-reset';
6
+ // import "@effective/css-reset";
8
- import './src/styles/global.css';
7
+ import "./Base.css";
8
+
9
+ interface Props {
10
+ title: string;
11
+ description: string;
12
+ image?: string;
13
+ }
9
14
 
10
15
  const { title, description } = Astro.props;
16
+ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
17
+ const image = "/blog-placeholder-1.jpg";
11
18
  ---
12
19
 
13
20
  <!doctype html>
14
21
  <html lang="en">
15
- <head>
22
+ <head>
23
+ <meta charset="utf-8" />
24
+ <meta name="viewport" content="width=device-width,initial-scale=1" />
25
+ <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
26
+ <link rel="sitemap" href="/sitemap-index.xml" />
27
+ <link
28
+ rel="alternate"
29
+ type="application/rss+xml"
30
+ title={title}
31
+ href={new URL("rss.xml", Astro.site)}
32
+ />
33
+ <meta name="generator" content={Astro.generator} />
34
+ <link rel="canonical" href={canonicalURL} />
35
+ <title>{title}</title>
16
- <!-- <title slot="head"></title> -->
36
+ <meta name="title" content={title} />
37
+ <meta name="description" content={description} />
17
- <!-- <meta name="author" content="pyrossh" />
38
+ <meta name="author" content="pyrossh" />
18
- <meta name="keywords" content="pyrossh.dev,pyrossh,svelte,website" />
39
+ <meta name="keywords" content="pyrossh.dev,pyrossh,astrojs,website" />
19
- <link rel="canonical" href={url} />
20
- <meta property="og:site_name" content="pyrossh.dev" />
21
- <meta property="og:type" content="website" />
22
- <meta property="og:url" content={url} /> -->
23
- <BaseHead title={title} description={description} />
24
- <Font cssVariable="--font-roboto" preload />
25
- </head>
26
- <body>
27
- <div class="flex flex-1 flex-col">
28
- <Header />
29
- <main class="wrapper">
30
- <slot />
31
- <!-- <div class="flex flex-1 flex-row">
32
- <div class="flex flex-1 flex-row my-4">
33
- <slot />
34
- </div>
35
- </div> -->
36
- </main>
37
- <Footer />
38
- </div>
39
- </body>
40
- </html>
41
40
 
42
- <style>
43
- html {
44
- background-color: white;
41
+ <!-- Open Graph / Facebook -->
42
+ <meta property="og:site_name" content="pyrossh.dev" />
43
+ <meta property="og:type" content="website" />
44
+ <meta property="og:url" content={Astro.url} />
45
- }
45
+ <meta property="og:title" content={title} />
46
+ <meta property="og:description" content={description} />
47
+ <meta property="og:image" content={new URL(image, Astro.url)} />
46
48
 
49
+ <!-- Twitter -->
50
+ <meta property="twitter:card" content="summary_large_image" />
51
+ <meta property="twitter:url" content={Astro.url} />
52
+ <meta property="twitter:title" content={title} />
53
+ <meta property="twitter:description" content={description} />
54
+ <meta property="twitter:image" content={new URL(image, Astro.url)} />
55
+ <Font cssVariable="--font-roboto" preload />
56
+ </head>
47
- body {
57
+ <body>
58
+ <Header />
59
+ <Wrapper>
60
+ <main>
61
+ <slot />
48
- /* margin: 0;
62
+ </main>
49
- padding: 0;
50
- text-align: left;
63
+ </Wrapper>
51
- background: linear-gradient(var(--gray-gradient)) no-repeat;
52
- background-size: 100% 600px;
53
- word-wrap: break-word;
54
- overflow-wrap: break-word;
55
- color: rgb(var(--gray-dark));
56
- font-size: 20px;
57
- line-height: 1.7; */
64
+ <Footer />
58
- background-color: var(--color-white);
59
- font-family: var(--font-roboto);
60
- text-rendering: optimizeLegibility;
61
- font-variant-ligatures: common-ligatures;
62
- font-kerning: normal;
63
- font-size: 14pt;
64
- line-height: 1.6;
65
+ </body>
65
- color: #222;
66
- }
67
-
68
- main {
69
- background-color: var(--color-white);
70
- padding-top: 1em;
71
- padding-bottom: 1em;
72
- }
73
- </style>
66
+ </html>
src/layouts/Base.css ADDED
@@ -0,0 +1,48 @@
1
+ @import "tailwindcss";
2
+
3
+ :root {
4
+ --color-accent: #f1fa8c;
5
+ --color-accent-dark: #000d8a;
6
+ --color-black: #000000;
7
+ --color-white: #ffffff;
8
+ --gray: 96, 115, 159;
9
+ --gray-light: 229, 233, 240;
10
+ --gray-dark: 34, 41, 57;
11
+ --gray-gradient: rgba(var(--gray-light), 50%), #fff;
12
+ --box-shadow: 0 2px 6px rgba(var(--gray), 25%),
13
+ 0 8px 24px rgba(var(--gray), 33%), 0 16px 32px rgba(var(--gray), 33%);
14
+ }
15
+
16
+ html {
17
+ background-color: white;
18
+ }
19
+
20
+ body {
21
+ /* margin: 0;
22
+ padding: 0;
23
+ text-align: left;
24
+ background: linear-gradient(var(--gray-gradient)) no-repeat;
25
+ background-size: 100% 600px;
26
+ word-wrap: break-word;
27
+ overflow-wrap: break-word;
28
+ color: rgb(var(--gray-dark));
29
+ font-size: 20px;
30
+ line-height: 1.7; */
31
+ display: flex;
32
+ flex-direction: column;
33
+ flex: 1;
34
+ background-color: var(--color-white);
35
+ font-family: var(--font-roboto);
36
+ text-rendering: optimizeLegibility;
37
+ font-variant-ligatures: common-ligatures;
38
+ font-kerning: normal;
39
+ font-size: 14pt;
40
+ line-height: 1.6;
41
+ color: #222;
42
+ }
43
+
44
+ main {
45
+ background-color: var(--color-white);
46
+ padding-top: 1em;
47
+ padding-bottom: 1em;
48
+ }
{only-bible-app → src/pages/only-bible-app}/+layout.svelte RENAMED
File without changes
src/pages/only-bible-app/index.astro ADDED
@@ -0,0 +1,74 @@
1
+ ---
2
+ import { Image } from "astro:assets";
3
+ import Layout from "@/layouts/Base.astro";
4
+ import PlayStoreIcon from "@/assets/icons/playstore.svg";
5
+ import AppStoreIcon from "@/assets/icons/appstore.svg";
6
+ import AppIconPng from "@/assets/images/app_icon.png";
7
+ import AppImagePng from "@/assets/images/app_image.png";
8
+ ---
9
+
10
+ <Layout
11
+ title="Only Bible App"
12
+ description="The only bible app you will ever need"
13
+ >
14
+ <div class="flex flex-1 flex-col sm:flex-row pb-64">
15
+ <div class="flex flex-col items-center sm:items-start">
16
+ <div class="block mb-4">
17
+ <h1
18
+ class="flex flex-col items-center sm:items-start sm:m-0 text-3xl font-bold text-center sm:text-left lg:leading-tight"
19
+ >
20
+ <Image
21
+ class="mr-2rounded-xl"
22
+ src={AppIconPng}
23
+ alt="Only Bible App"
24
+ width="128"
25
+ />
26
+ The only bible app you will ever need
27
+ </h1>
28
+ <div class="text-center sm:text-left flex flex-col text-lg sm:mt-5">
29
+ <span>No ads,</span>
30
+ <span>No in-app purchases,</span>
31
+ <span>No distractions.</span>
32
+ <span>Works completely offline.</span>
33
+ </div>
34
+ </div>
35
+ <div class="flex flex-1 flex-col items-center sm:items-start">
36
+ <h3 class="m-0 my-4 font-bold text-xl">
37
+ What are you waiting for? Get it now! Quickly.
38
+ </h3>
39
+ <div class="flex flex-col sm:flex-row">
40
+ <a
41
+ class="mt-4 sm:mt-0 sm:mr-2"
42
+ href="https://play.google.com/store/apps/details?id=dev.pyrossh.onlyBible"
43
+ rel="noopener noreferrer"
44
+ target="_blank"
45
+ >
46
+ <PlayStoreIcon width={196} />
47
+ </a>
48
+ <a
49
+ class="mt-8 sm:mt-0"
50
+ href="https://apps.apple.com/us/app/only-bible-app/id6467606465?itsct=apps_box_badge&itscg=30200"
51
+ rel="noopener noreferrer"
52
+ target="_blank"
53
+ >
54
+ <AppStoreIcon width={196} />
55
+ </a>
56
+ </div>
57
+ </div>
58
+ </div>
59
+ <!-- <div class="flex flex-1 justify-center sm:justify-end pb-36">
60
+ <Image
61
+ src="https://play-lh.googleusercontent.com/RHXOXHwSlGPvid-YnzMSGuCtkuBLeV6-PDE1Z8c9f4014oGfr64MSXHgFf1uID0w5mAQ=w1052-h592-rw"
62
+ alt="app screenshot android"
63
+ width="196"
64
+ height="200"
65
+ />
66
+ <Image
67
+ src="https://is1-ssl.mzstatic.com/image/thumb/PurpleSource211/v4/5b/8e/7c/5b8e7c17-2f6b-59f4-9a16-b08cff4cf73c/Simulator_Screenshot_-_iPhone_16_-_2024-11-02_at_14.20.40.png/460x0w.webp"
68
+ alt="app screenshot ios"
69
+ width="196"
70
+ height="200"
71
+ />
72
+ </div> -->
73
+ </div>
74
+ </Layout>
src/pages/only-bible-app/privacy-policy/index.astro ADDED
@@ -0,0 +1,72 @@
1
+ ---
2
+ import Layout from "@/layouts/Base.astro";
3
+ ---
4
+
5
+ <Layout
6
+ title="Privacy Policy | Only Bible App"
7
+ description="Privacy Policy | Only Bible App"
8
+ >
9
+ <h1 class="font-bold text-3xl">Privacy Policy</h1>
10
+ <p>
11
+ Only Bible App does not collect any information about you or your usage of
12
+ the app. It does not send any information about you to anyone. It does not
13
+ contain ads. It will never install additional products on your device or
14
+ change your device's configuration. No ads, No in-app purchases, No
15
+ distractions.
16
+ </p>
17
+ <h4>Changes to this Privacy Policy</h4>
18
+ I may update our Privacy Policy from time to time. Thus, you are advised to review
19
+ this page periodically for any changes. I will notify you of any changes by posting
20
+ the new Privacy Policy on this page.
21
+ <p>
22
+ This policy is effective as of <strong>2023-09-08</strong>
23
+ </p>
24
+ <h4>Contact Us</h4>
25
+ If you have any questions or suggestions for us you can contact us at
26
+ <strong>pyros2097@gmail.com</strong>
27
+ </Layout>
28
+ <style>
29
+ h1 {
30
+ font-size: 1.8rem;
31
+ }
32
+ b {
33
+ font-weight: 600;
34
+ }
35
+
36
+ ul {
37
+ margin: 0.5rem;
38
+ padding-left: 1rem;
39
+ }
40
+
41
+ li {
42
+ list-style-type: disc;
43
+ list-style-position: outside;
44
+ }
45
+
46
+ h3 {
47
+ font-weight: 700;
48
+ font-size: 1.4rem;
49
+ margin-top: 0.5rem;
50
+ margin-bottom: 0.5rem;
51
+ }
52
+
53
+ h4 {
54
+ font-weight: 600;
55
+ margin-top: 0.5rem;
56
+ }
57
+
58
+ h5 {
59
+ margin-top: 0.5rem;
60
+ }
61
+
62
+ h6 {
63
+ font-weight: 600;
64
+ margin-top: 0.5rem;
65
+
66
+ span {
67
+ font-family: sans-serif;
68
+ font-weight: 400;
69
+ font-size: 0.95rem;
70
+ }
71
+ }
72
+ </style>
src/pages/only-bible-app/terms-and-conditions/index.astro ADDED
@@ -0,0 +1,50 @@
1
+ ---
2
+ import Layout from "@/layouts/Base.astro";
3
+ ---
4
+
5
+ <Layout
6
+ title="Terms and Conditions | Only Bible App"
7
+ description="Terms and Conditions | Only Bible App"
8
+ >
9
+ <div class="pb-10 mt-10">
10
+ <h1 class="font-bold text-3xl">Terms and Conditions</h1>
11
+ <p>
12
+ By downloading or using the app, these terms will automatically apply to
13
+ you – you should make sure therefore that you read them carefully before
14
+ using the app. You’re not allowed to copy or modify the app, any part of
15
+ the app, or our trademarks in any way. You’re not allowed to attempt to
16
+ extract the source code of the app, and you also shouldn’t try to
17
+ translate the app into other languages or make derivative versions. The
18
+ app itself, and all the trademarks, copyright, database rights, and other
19
+ intellectual property rights related to it, still belong to us.
20
+ </p>
21
+ <p>
22
+ We are committed to ensuring that the app is as useful and efficient as
23
+ possible. For that reason, we reserve the right to make changes to the app
24
+ or to charge for its services, at any time and for any reason. We will
25
+ never charge you for the app or its services without making it very clear
26
+ to you exactly what you’re paying for.
27
+ </p>
28
+ <p>
29
+ The Only Bible App app stores and processes personal data that you have
30
+ provided to us, to provide my Service. It’s your responsibility to keep
31
+ your phone and access to the app secure. We therefore recommend that you
32
+ do not jailbreak or root your phone, which is the process of removing
33
+ software restrictions and limitations imposed by the official operating
34
+ system of your device. It could make your phone vulnerable to
35
+ malware/viruses/malicious programs, compromise your phone’s security
36
+ features and it could mean that the Only Bible App app won’t work properly
37
+ or at all.
38
+ </p>
39
+ <h4>Changes to this Terms and conditions</h4>
40
+ I may update our Terms and conditions from time to time. Thus, you are advised
41
+ to review this page periodically for any changes. I will notify you of any changes
42
+ by posting the new Terms and conditions on this page.
43
+ <p>
44
+ This policy is effective as of <strong>2023-09-08</strong>
45
+ </p>
46
+ <h4>Contact Us</h4>
47
+ If you have any questions or suggestions for us you can contact us at
48
+ <strong>pyros2097@gmail.com</strong>
49
+ </div>
50
+ </Layout>
src/styles/global.css DELETED
@@ -1,150 +0,0 @@
1
- @import "tailwindcss";
2
-
3
- :root {
4
- --color-accent: #F1FA8C;
5
- --color-accent-dark: #000D8A;
6
- --color-black: #000000;
7
- --color-white: #FFFFFF;
8
- --gray: 96, 115, 159;
9
- --gray-light: 229, 233, 240;
10
- --gray-dark: 34, 41, 57;
11
- --gray-gradient: rgba(var(--gray-light), 50%), #fff;
12
- --box-shadow:
13
- 0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%),
14
- 0 16px 32px rgba(var(--gray), 33%);
15
- }
16
-
17
- /* body {
18
- margin: 0;
19
- padding: 0;
20
- text-align: left;
21
- background: linear-gradient(var(--gray-gradient)) no-repeat;
22
- background-size: 100% 600px;
23
- word-wrap: break-word;
24
- overflow-wrap: break-word;
25
- color: rgb(var(--gray-dark));
26
- font-size: 20px;
27
- line-height: 1.7;
28
- } */
29
-
30
- /* h1,
31
- h2,
32
- h3,
33
- h4,
34
- h5,
35
- h6 {
36
- margin: 0 0 0.5rem 0;
37
- color: rgb(var(--black));
38
- line-height: 1.2;
39
- }
40
-
41
- h1 {
42
- font-size: 3.052em;
43
- }
44
-
45
- h2 {
46
- font-size: 2.441em;
47
- }
48
-
49
- h3 {
50
- font-size: 1.953em;
51
- }
52
-
53
- h4 {
54
- font-size: 1.563em;
55
- }
56
-
57
- h5 {
58
- font-size: 1.25em;
59
- }
60
-
61
- strong,
62
- b {
63
- font-weight: 700;
64
- }
65
-
66
- a {
67
- color: var(--color-black);
68
- }
69
-
70
- a:hover {
71
- color: var(--accent);
72
- }
73
-
74
- p {
75
- margin-bottom: 1em;
76
- }
77
-
78
- .prose p {
79
- margin-bottom: 2em;
80
- }
81
-
82
- textarea {
83
- width: 100%;
84
- font-size: 16px;
85
- }
86
-
87
- input {
88
- font-size: 16px;
89
- }
90
-
91
- table {
92
- width: 100%;
93
- }
94
-
95
- img {
96
- max-width: 100%;
97
- height: auto;
98
- border-radius: 8px;
99
- }
100
-
101
- code {
102
- padding: 2px 5px;
103
- background-color: rgb(var(--gray-light));
104
- border-radius: 2px;
105
- }
106
-
107
- pre {
108
- padding: 1.5em;
109
- border-radius: 8px;
110
- }
111
-
112
- pre>code {
113
- all: unset;
114
- }
115
-
116
- blockquote {
117
- border-left: 4px solid var(--accent);
118
- padding: 0 0 0 20px;
119
- margin: 0px;
120
- font-size: 1.333em;
121
- }
122
-
123
- hr {
124
- border: none;
125
- border-top: 1px solid rgb(var(--gray-light));
126
- }
127
-
128
- @media (max-width: 720px) {
129
- body {
130
- font-size: 18px;
131
- }
132
-
133
- main {
134
- padding: 1em;
135
- }
136
- } */
137
-
138
- .wrapper {
139
- width: calc(95ex - (1em * 2));
140
- margin-right: auto;
141
- margin-left: auto;
142
- padding-left: 1em;
143
- padding-right: 1em;
144
- }
145
-
146
- @media (max-width: 720px) {
147
- .wrapper {
148
- width: 100%;
149
- }
150
- }