Skip to content

Commit 8b64bea

Browse files
AchoArnoldCopilot
AchoArnold
and
Copilot
authored
fix(web): restore original content on all statically generated pages (#908)
* fix(web): restore original content on all statically generated pages Restore word-for-word content from backup/web-nuxt2-vuetify2 branch while keeping Vuetify 4 component syntax. Fixes: - Blog page titles restored to original wording - Missing images added back (VImg with /img/blog/ paths) - Missing VAlert warning/info boxes restored - Code blocks with syntax highlighting restored (including tabbed JS/Go) - Internal links restored as NuxtLink components - Bold text, code tags, and formatting preserved - Meta tags (og:title, og:description, og:image, twitter:card) restored - BackButton and VDivider footer restored on all pages - Blog index listing titles and descriptions corrected - Privacy policy and terms pages: BackButton + styled email link Pages fixed (11 total): - 7 blog posts + blog index - Homepage, privacy policy, terms and conditions Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * refactor(web): update blog pages to MD3 typography classes Replace Vuetify 2 typography classes with Material Design 3 equivalents: - text-h3/text-md-h2 → text-display-small/text-display-medium (responsive via useDisplay) - text-h4 → text-headline-large - text-subtitle-1 → text-body-large Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> * fix(web): address PR review comments - Fix shared selectedTab ref in e2e encryption page (split into encryptTab, sendTab, receiveTab so tab groups are independent) - Fix wrong og:description on grant-sms-permissions page (was copied from encryption article) - Fix wrong og:description on excel page (was copied from python article) - Fix read-time prop to readTime (camelCase) on grant-sms page - Fix duplicate 'Step 3' headings in excel and CSV pages (second is now Step 4) - Fix typos in blog index: 'zapper' → 'Zapier', 'IFTTFT' → 'IFTTT' - Fix wrong description for SMS permissions article in blog index Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com> --------- Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
1 parent 7870011 commit 8b64bea

11 files changed

Lines changed: 1027 additions & 356 deletions

‎web/app/pages/blog/end-to-end-encryption-to-sms-messages.vue‎

Lines changed: 263 additions & 67 deletions
Large diffs are not rendered by default.

‎web/app/pages/blog/forward-incoming-sms-from-phone-to-webhook.vue‎

Lines changed: 106 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,73 +1,141 @@
11
<script setup lang="ts">
2+
import { useDisplay } from "vuetify";
3+
4+
const { mdAndUp } = useDisplay();
5+
26
definePageMeta({ layout: "website" });
37
48
useHead({
5-
title: "Forward Incoming SMS from Phone to Webhook - httpSMS",
9+
title:
10+
"How to forward a text message (SMS) from an android phone into your webhook - httpSMS",
11+
meta: [
12+
{
13+
property: "og:title",
14+
content:
15+
"How to forward a text message (SMS) from an android phone into your webhook",
16+
},
17+
{
18+
property: "og:description",
19+
content:
20+
"You can now program your android phone to forward messages received on your phone to your server and trigger powerful automations with tools like Zapier and IFTTT.",
21+
},
22+
{
23+
property: "og:image",
24+
content:
25+
"https://httpsms.com/img/blog/forward-incoming-sms-from-phone-to-webhook/header.png",
26+
},
27+
{
28+
name: "twitter:card",
29+
content: "summary_large_image",
30+
},
31+
{
32+
property: "og:url",
33+
content:
34+
"https://httpsms.com/blog/forward-incoming-sms-from-phone-to-webhook/",
35+
},
36+
],
637
});
738
</script>
839

940
<template>
10-
<VContainer>
11-
<VRow>
12-
<VCol cols="12" md="8" offset-md="2">
13-
<h1 class="text-display-small mb-2">
14-
Forward Incoming SMS from Phone to Webhook
41+
<VContainer class="pt-8">
42+
<VRow class="mt-16">
43+
<VCol cols="12" md="9">
44+
<VImg
45+
style="border-radius: 4px"
46+
alt="blog post header image"
47+
src="/img/blog/forward-incoming-sms-from-phone-to-webhook/header.png"
48+
/>
49+
50+
<h1
51+
:class="
52+
mdAndUp ? 'text-display-medium mt-1' : 'text-display-small mt-1'
53+
"
54+
>
55+
How to forward a text message (SMS) from an android phone into your
56+
webhook
1557
</h1>
16-
<BlogInfo date="April 08, 2023" read-time="5 min read" />
17-
<VDivider class="my-6" />
58+
<BlogInfo date="April 08, 2023" readTime="5 min read" />
1859

19-
<p class="text-body-large mb-6">
60+
<p class="text-body-large mt-2">
2061
You can now program your android phone to forward messages received on
2162
your phone to your server and trigger powerful automations with tools
2263
like Zapier and IFTTT. I created an open source application called
23-
httpSMS that helps you to set this up with ease.
64+
<NuxtLink class="text-decoration-none" to="/">httpSMS</NuxtLink>
65+
that helps you to set this up with ease
2466
</p>
2567

26-
<h2 class="text-headline-medium mb-4">Step 1: Get your API_KEY</h2>
27-
<p class="text-body-large mb-6">
28-
Create an account on the httpSMS web app and copy your API key from
29-
the
30-
<a href="https://httpsms.com/settings" target="_blank" rel="noopener"
31-
>settings page</a
32-
>.
68+
<h3 class="text-headline-large mt-2">Step 1: Get your API_KEY</h3>
69+
<p>
70+
Create an account on the httpSMS web application and copy your API key
71+
from the settings page.
72+
<NuxtLink class="text-decoration-none" to="/settings"
73+
>https://httpsms.com/settings</NuxtLink
74+
>
3375
</p>
76+
<VImg
77+
style="border-radius: 4px"
78+
alt="httpsms.com settings page"
79+
src="/img/blog/forward-incoming-sms-from-phone-to-webhook/settings.png"
80+
/>
3481

35-
<h2 class="text-headline-medium mb-4">
82+
<h3 class="text-headline-large mt-12">
3683
Step 2: Install the httpSMS android app
37-
</h2>
38-
<p class="text-body-large mb-6">
39-
Download the Android app from
84+
</h3>
85+
<p>
4086
<a
87+
class="text-decoration-none"
4188
href="https://github.com/NdoleStudio/httpsms/releases/latest/download/HttpSms.apk"
42-
target="_blank"
43-
rel="noopener"
44-
>https://github.com/NdoleStudio/httpsms/releases/latest/download/HttpSms.apk</a
89+
>⬇️ Download and install</a
4590
>
46-
and sign in using your API KEY.
91+
the httpSMS android app on your phone and sign in using your API KEY
92+
which you copied above. This app listens for SMS messages received on
93+
your android phone.
4794
</p>
95+
<VImg
96+
style="border-radius: 4px"
97+
alt="httpsms android app"
98+
height="800"
99+
src="/img/blog/forward-incoming-sms-from-phone-to-webhook/android-app.png"
100+
/>
48101

49-
<h2 class="text-headline-medium mb-4">Step 3: Set up a webhook</h2>
50-
<p class="text-body-large mb-6">
51-
Once installed, the app listens for SMS messages received on your
52-
phone. Configure your webhook URL under the
53-
<a href="https://httpsms.com/settings" target="_blank" rel="noopener"
54-
>settings page</a
102+
<h3 class="text-headline-large mt-12">Step 3: Set up a webhook</h3>
103+
<p>
104+
Once the application has been installed, it will be listening for SMS
105+
messages received on the android phone. You can configure the
106+
application to sent this SMS message to your server URL using a
107+
webhook. You can configure this URL under the settings page in the
108+
httpSMS application
109+
<NuxtLink class="text-decoration-none" to="/settings"
110+
>https://httpsms.com/settings</NuxtLink
55111
>
56-
so the messages can be delivered to your server.
57112
</p>
113+
<VImg
114+
style="border-radius: 4px"
115+
alt="httpSMS webhook configuration"
116+
src="/img/blog/forward-incoming-sms-from-phone-to-webhook/webhook.png"
117+
/>
58118

59-
<p class="text-body-large mb-6">
119+
<h3 class="text-headline-large mt-12">Conclusion</h3>
120+
<p>
60121
Congratulations, you have successfully set up SMS forwarding from your
61122
Android phone to a webhook! This powerful automation tool can help you
62-
streamline your business workflow and save you time and effort. You
63-
can also trigger the httpSMS application to send an SMS a simple API.
64-
You can find more information on the documentation page at
65-
<a href="https://docs.httpsms.com" target="_blank" rel="noopener"
123+
streamline your business workflow and save you time and effort.
124+
</p>
125+
<p>
126+
You can also trigger the httpSMS application to send an SMS a simple
127+
API. You can find more information on the documentation page at
128+
<a class="text-decoration-none" href="https://docs.httpsms.com"
66129
>https://docs.httpsms.com</a
67-
>. Until the next time ✌️
130+
>
68131
</p>
132+
<p>Until the next time✌️</p>
69133

70134
<BlogAuthorBio />
135+
<VDivider class="mx-16" />
136+
<div class="text-center mt-8 mb-4">
137+
<BackButton />
138+
</div>
71139
</VCol>
72140
</VRow>
73141
</VContainer>

‎web/app/pages/blog/grant-send-and-read-sms-permissions-on-android.vue‎

Lines changed: 85 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,55 +1,115 @@
11
<script setup lang="ts">
2+
import { mdiDotsVertical } from "@mdi/js";
3+
import { useDisplay } from "vuetify";
4+
5+
const { mdAndUp } = useDisplay();
6+
27
definePageMeta({ layout: "website" });
38
49
useHead({
5-
title: "Grant Send and Read SMS Permissions on Android - httpSMS",
10+
title:
11+
"How to grant SEND_SMS and RECEIVE_SMS permissions on Android 14+ - httpSMS",
12+
meta: [
13+
{
14+
property: "og:title",
15+
content:
16+
"How to grant SEND_SMS and RECEIVE_SMS permissions on Android 14+",
17+
},
18+
{
19+
property: "og:description",
20+
content:
21+
"In Android 15 (Vanilla Ice Cream), the SEND_SMS and RECEIVE_SMS permissions are now hard restricted. Learn how to grant these permissions step by step.",
22+
},
23+
],
624
});
725
</script>
826

927
<template>
10-
<VContainer>
11-
<VRow>
12-
<VCol cols="12" md="8" offset-md="2">
13-
<h1 class="text-display-small mb-2">
14-
Grant Send and Read SMS Permissions on Android
28+
<VContainer class="pt-8">
29+
<VRow class="mt-16">
30+
<VCol cols="12" md="9">
31+
<h1
32+
:class="
33+
mdAndUp ? 'text-display-medium mt-1' : 'text-display-small mt-1'
34+
"
35+
>
36+
How to grant SMS permissions on Android 15+
1537
</h1>
16-
<BlogInfo date="February 18, 2025" read-time="5 min read" />
17-
<VDivider class="my-6" />
38+
<BlogInfo date="February 18, 2025" readTime="5 min read" />
1839

19-
<p class="text-body-large mb-6">
20-
In Android 15 (Vanilla Ice Cream), the android.permission.SEND_SMS and
21-
android.permission.RECEIVE_SMS permissions are now hard restricted and
22-
cannot be granted via the runtime permissions interface.
40+
<p class="text-body-large mt-2">
41+
In Android 15 (Vanilla Ice Cream), the
42+
<code>android.permission.SEND_SMS</code> and
43+
<code>android.permission.RECEIVE_SMS</code> permissions are now hard
44+
restricted and cannot be granted
45+
<a
46+
class="text-decoration-none"
47+
href="https://developer.android.com/training/permissions/requesting"
48+
>via the runtime permissions interface</a
49+
>.
2350
</p>
2451

25-
<h2 class="text-headline-medium mb-4">Step 1: Open App Info</h2>
26-
<p class="text-body-large mb-6">
52+
<VAlert type="warning" variant="outlined" class="my-4">
53+
Granting the <code>SEND_SMS</code> and
54+
<code>RECEIVE_SMS</code> permissions will allow an Android app to be
55+
able to read and send SMS messages on your phone. Make sure you trust
56+
the application before allowing these permissions.
57+
</VAlert>
58+
59+
<h3 class="text-headline-large mt-8 mb-2">Step1: Open App Info</h3>
60+
<p>
2761
Long press the icon of the android app which you want to grant the
28-
permission and select 'App info'
62+
permission and select <b>"App info"</b>
2963
</p>
64+
<VImg
65+
style="border-radius: 4px"
66+
alt="httpsms android app"
67+
height="800"
68+
src="/img/blog/grant-send-and-read-sms-permissions-on-android/app-info.png"
69+
/>
3070

31-
<h2 class="text-headline-medium mb-4">
71+
<h3 class="text-headline-large mb-4 mt-16">
3272
Step 2: Allow Restricted Permissions
33-
</h2>
34-
<p class="text-body-large mb-6">
35-
On the App Info page, click on the menu button and select the 'Allow
36-
restricted settings' option
73+
</h3>
74+
<p>
75+
On the App Info page, click on the menu button
76+
<VIcon :icon="mdiDotsVertical" /> and select the
77+
<b>"Allow restricted settings"</b> option
3778
</p>
79+
<VImg
80+
style="border-radius: 4px"
81+
alt="httpsms android app"
82+
height="800"
83+
src="/img/blog/grant-send-and-read-sms-permissions-on-android/allow-restricted-settings.png"
84+
/>
3885

39-
<h2 class="text-headline-medium mb-4">Step 3: Allow SMS Permissions</h2>
40-
<p class="text-body-large mb-6">
86+
<h3 class="text-headline-large mb-4 mt-16">
87+
Step 3: Allow SMS Permissions
88+
</h3>
89+
<p>
4190
Once you have allowed the restricted settings from step 2 above, You
42-
can navigate to Permissions ➡️ SMS and tap the Allow button to grant
43-
SMS permissions to the android app.
91+
can navigate to <b>Permissions ➡️ SMS</b> and tap the Allow button to
92+
grant SMS permissions to the android app.
4493
</p>
94+
<VImg
95+
style="border-radius: 4px"
96+
alt="httpsms android app"
97+
height="800"
98+
src="/img/blog/grant-send-and-read-sms-permissions-on-android/allow.png"
99+
/>
45100

46-
<p class="text-body-large mb-6">
101+
<h3 class="text-headline-large mt-12">Conclusion</h3>
102+
<p>
47103
Congratulations, you have successfully configured SMS permissions on
48104
your Android app. Don't hesitate to contact us if you face any
49105
problems while following this guide.
50106
</p>
51107

52108
<BlogAuthorBio />
109+
<VDivider class="mx-16" />
110+
<div class="text-center mt-8 mb-4">
111+
<BackButton />
112+
</div>
53113
</VCol>
54114
</VRow>
55115
</VContainer>

0 commit comments

Comments
 (0)