Set up guestbook form
This commit is contained in:
Helen Chong
parent
562e365e99
commit
a67a870c42
|
|
@ -1 +1,32 @@
|
||||||
console.log("Guestbook script successfully loaded");
|
console.log("Guestbook script successfully loaded");
|
||||||
|
|
||||||
|
// Import Firebase
|
||||||
|
import { initializeApp } from 'https://www.gstatic.com/firebasejs/10.12.0/firebase-app.js'
|
||||||
|
import { getDatabase, ref, push, onValue, update } from 'https://www.gstatic.com/firebasejs/10.12.0/firebase-database.js'
|
||||||
|
|
||||||
|
// Set up Firebase database
|
||||||
|
const appSettings = {
|
||||||
|
databaseURL: 'https://leilukin-s-hub-guestbook-default-rtdb.asia-southeast1.firebasedatabase.app/'
|
||||||
|
};
|
||||||
|
const app = initializeApp(appSettings);
|
||||||
|
const database = getDatabase(app);
|
||||||
|
const guestbookInDB = ref(database, "guestbook");
|
||||||
|
|
||||||
|
// Get DOM elements
|
||||||
|
const formEl = document.querySelector('.gb__form');
|
||||||
|
const nameInputEl = document.querySelector('#name-input');
|
||||||
|
const emailInputEl = document.querySelector('#email-input');
|
||||||
|
const websiteInputEl = document.querySelector('#website-input');
|
||||||
|
const msgInputEl = document.querySelector('#message-input');
|
||||||
|
const publishBtn = document.querySelector('.gb__form--submit');
|
||||||
|
const messageListEl = document.querySelector('.gb__message--list');
|
||||||
|
|
||||||
|
// Initiate guestbook message object
|
||||||
|
let messageObj = {
|
||||||
|
name: '',
|
||||||
|
email: '',
|
||||||
|
website: '',
|
||||||
|
message: '',
|
||||||
|
timestamp: '',
|
||||||
|
replies: [],
|
||||||
|
};
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
<subtitle>Leilukin's personal website.</subtitle>
|
<subtitle>Leilukin's personal website.</subtitle>
|
||||||
<link href="https://leilukin.neocities.org/feed.xml" rel="self"/>
|
<link href="https://leilukin.neocities.org/feed.xml" rel="self"/>
|
||||||
<link href="https://leilukin.neocities.org"/>
|
<link href="https://leilukin.neocities.org"/>
|
||||||
<updated>2024-05-19T05:26:06Z</updated>
|
<updated>2024-05-19T06:23:25Z</updated>
|
||||||
<id>https://leilukin.neocities.org</id>
|
<id>https://leilukin.neocities.org</id>
|
||||||
<author>
|
<author>
|
||||||
<name>Leilukin</name>
|
<name>Leilukin</name>
|
||||||
|
|
|
||||||
|
|
@ -376,148 +376,74 @@
|
||||||
|
|
||||||
<p><a href="https://web.archive.org/web/20240510121252/https%3A%2F%2Fleilukin.123guestbook.com%2F">Archive of my previous guestbook hosted on 123Guestbook</a></p>
|
<p><a href="https://web.archive.org/web/20240510121252/https%3A%2F%2Fleilukin.123guestbook.com%2F">Archive of my previous guestbook hosted on 123Guestbook</a></p>
|
||||||
|
|
||||||
<!-- customize labels of htmlcommentbox.com -->
|
<h2>Leave A Message</h2>
|
||||||
<script>
|
|
||||||
/* This code goes ABOVE the main HTML Comment Box code!
|
|
||||||
replace the text in the single quotes below to customize labels.*/
|
|
||||||
hcb_user = {
|
|
||||||
/* L10N */
|
|
||||||
comments_header: 'Guestbook',
|
|
||||||
name_label: 'Name',
|
|
||||||
content_label: 'Enter your message here',
|
|
||||||
submit: 'Send Message',
|
|
||||||
logout_link: '<img title="log out" src="https://www.htmlcommentbox.com/static/images/door_out.svg" alt="[logout]" class="hcb-icon hcb-door-out"/>',
|
|
||||||
admin_link: '<img src="https://www.htmlcommentbox.com/static/images/door_in.svg" alt="[login]" class="hcb-icon hcb-door-in"/>',
|
|
||||||
no_comments_msg: 'No one has left any message yet. Be the first!',
|
|
||||||
add: 'Add your message',
|
|
||||||
again: 'Post another message',
|
|
||||||
rss: '<img src="https://www.htmlcommentbox.com/static/images/feed.svg" class="hcb-icon" alt="rss"/> ',
|
|
||||||
said: 'said:',
|
|
||||||
prev_page: '<img src="https://www.htmlcommentbox.com/static/images/arrow_left.png" class="hcb-icon" title="previous page" alt="[prev]"/>',
|
|
||||||
next_page: '<img src="https://www.htmlcommentbox.com/static/images/arrow_right.png" class="hcb-icon" title="next page" alt="[next]"/>',
|
|
||||||
showing: 'Showing',
|
|
||||||
to: 'to',
|
|
||||||
website_label: 'website (optional)',
|
|
||||||
email_label: 'email',
|
|
||||||
anonymous: 'Anonymous',
|
|
||||||
mod_label: '(mod)',
|
|
||||||
subscribe: 'Email Me Replies',
|
|
||||||
add_image: 'Add Image',
|
|
||||||
are_you_sure: 'Do you want to flag this comment as inappropriate?',
|
|
||||||
|
|
||||||
reply: 'Reply',
|
<form class="gb__form">
|
||||||
flag: 'Flag',
|
<div class="gb__form--input">
|
||||||
like: 'Like',
|
<label for="name-input">Name:</label>
|
||||||
|
<input type="text" name="name" id="name-input" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
/* dates */
|
<div class="gb__form--input">
|
||||||
days_ago: 'days ago',
|
<label for="email-input">Email:</label>
|
||||||
hours_ago: 'hours ago',
|
<input type="email" name="email" id="email-input" required>
|
||||||
minutes_ago: 'minutes ago',
|
</div>
|
||||||
within_the_last_minute: 'within the last minute',
|
|
||||||
|
|
||||||
msg_thankyou: 'Thank you for your message!',
|
<div class="gb__form--input">
|
||||||
msg_approval: 'NOTE: This message is not published until approved',
|
<label for="website-input">Website (optional):</label>
|
||||||
msg_approval_required: 'Thank you for your message! Your message will appear once approved by Leilukin.',
|
<input type="text" name="website" id="website-input">
|
||||||
|
</div>
|
||||||
|
|
||||||
err_bad_html: 'Your message contained bad html.',
|
<div class="gb__form--input">
|
||||||
err_bad_email: 'Please enter a valid email address.',
|
<label for="message-input">Message:</label>
|
||||||
err_too_frequent: 'You must wait a few seconds between posting messages.',
|
<textarea type="text" rows="4" name="message" id="message-input" required></textarea>
|
||||||
err_comment_empty: 'Your message was not posted because it was empty!',
|
</div>
|
||||||
err_denied: 'Your message was not accepted.',
|
|
||||||
err_unknown: 'Your message was blocked for unknown reasons, please report this.',
|
|
||||||
err_spam: 'Your message was detected as spam.',
|
|
||||||
err_blocked: 'Your message was blocked by site policy.',
|
|
||||||
|
|
||||||
/* SETTINGS */
|
<button type="submit" class="gb__form--submit">Publish</button>
|
||||||
MAX_CHARS: 4096,
|
</form>
|
||||||
PAGE: '',
|
|
||||||
/* ID of the webpage to show comments for. defaults to the webpage the user is currently visiting. */
|
|
||||||
ON_COMMENT: function () {},
|
|
||||||
/* Function to call after commenting. */
|
|
||||||
RELATIVE_DATES: false /* show dates in the form "X hours ago." etc. */
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<!-- done customizing labels of htmlcommentbox.com -->
|
|
||||||
|
|
||||||
<!-- begin wwww.htmlcommentbox.com -->
|
<section class="gb__messages">
|
||||||
<section id="HCB_comment_box">
|
<h2>Messages</h2>
|
||||||
<a href="http://www.htmlcommentbox.com">Widget</a> is loading messages...
|
<div class="gb__message--list"></div>
|
||||||
</section>
|
</section>
|
||||||
<link rel="stylesheet" type="text/css" href="https://www.htmlcommentbox.com/static/skins/bootstrap/twitter-bootstrap.css?v=0"/>
|
|
||||||
<script type="text/javascript" id="hcb" defer>
|
|
||||||
/* <!-- */
|
|
||||||
if (!window.hcb_user) {
|
|
||||||
hcb_user = {};
|
|
||||||
}
|
|
||||||
(function () {
|
|
||||||
const s = document.createElement("script"),
|
|
||||||
l = hcb_user.PAGE || ("" + window.location).replace(/'/g, "%27"),
|
|
||||||
h = "https://www.htmlcommentbox.com";
|
|
||||||
s.setAttribute("type", "text/javascript");
|
|
||||||
s.setAttribute("src", h + "/jread?page=" + encodeURIComponent(l).replace("+", "%2B") + "&mod=%241%24wq1rdBcg%24IRFneco1bcPmYKq.t1Oae." + "&opts=16798&num=10&ts=1715702516205");
|
|
||||||
if (typeof s != "undefined")
|
|
||||||
document
|
|
||||||
.getElementsByTagName("head")[0]
|
|
||||||
.appendChild(s);
|
|
||||||
}
|
|
||||||
)();/* --> */
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
#HCB_comment_box {
|
.gb__form,
|
||||||
height: auto;
|
.gb__form--input {
|
||||||
font-family: inherit;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
#HCB_comment_box form {
|
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: 0.3em;
|
|
||||||
margin: 1rem 0 1.3rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form textarea,
|
.gb__form {
|
||||||
#HCB_comment_box #hcb_form #hcb_form_name {
|
gap: 0.6em;
|
||||||
width: 100%;
|
margin-bottom: 2em;
|
||||||
font-family: inherit;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form #replying_to_container,
|
.gb__form--input {
|
||||||
#HCB_comment_box .date {
|
gap: 0.2em;
|
||||||
font-size: 0.9rem;
|
|
||||||
color: var(--clr-body-txt);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form textarea:focus,
|
.gb__form--submit {
|
||||||
#HCB_comment_box #hcb_form #hcb_form_name:focus {
|
border: none;
|
||||||
outline: 0.25em solid var(--clr-link);
|
|
||||||
}
|
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .btn,
|
|
||||||
#HCB_comment_box #HCB_comment_form_box .btn {
|
|
||||||
background: var(--clr-link-btn-bg);
|
background: var(--clr-link-btn-bg);
|
||||||
color: var(--clr-link-btn-txt);
|
color: var(--clr-link-btn-txt);
|
||||||
font-size: 1.2rem;
|
padding: 0.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .btn:focus,
|
.gb__form--input input,
|
||||||
#HCB_comment_box #HCB_comment_form_box .btn:focus {
|
.gb__form--input textarea,
|
||||||
outline: 0.15em solid var(--clr-link-btn-txt);
|
.gb__form--submit {
|
||||||
|
border-radius: 0.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .home-desc a,
|
.gb__form--input textarea {
|
||||||
#HCB_comment_box .home-desc a:visited,
|
resize: vertical;
|
||||||
#HCB_comment_box .hcb-comment-tb button {
|
|
||||||
color: var(--clr-link);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .home-desc a,
|
.gb__form--input input:focus,
|
||||||
#HCB_comment_box .home-desc a:visited {
|
.gb__form--input textarea:focus {
|
||||||
text-decoration: underline;
|
outline: 0.15em solid var(--clr-link);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<!-- end www.htmlcommentbox.com -->
|
|
||||||
|
|
||||||
<script type="module" src="/assets/js/guestbook.js" defer></script>
|
<script type="module" src="/assets/js/guestbook.js" defer></script>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1 +1,32 @@
|
||||||
console.log("Guestbook script successfully loaded");
|
console.log("Guestbook script successfully loaded");
|
||||||
|
|
||||||
|
// Import Firebase
|
||||||
|
import { initializeApp } from 'https://www.gstatic.com/firebasejs/10.12.0/firebase-app.js'
|
||||||
|
import { getDatabase, ref, push, onValue, update } from 'https://www.gstatic.com/firebasejs/10.12.0/firebase-database.js'
|
||||||
|
|
||||||
|
// Set up Firebase database
|
||||||
|
const appSettings = {
|
||||||
|
databaseURL: 'https://leilukin-s-hub-guestbook-default-rtdb.asia-southeast1.firebasedatabase.app/'
|
||||||
|
};
|
||||||
|
const app = initializeApp(appSettings);
|
||||||
|
const database = getDatabase(app);
|
||||||
|
const guestbookInDB = ref(database, "guestbook");
|
||||||
|
|
||||||
|
// Get DOM elements
|
||||||
|
const formEl = document.querySelector('.gb__form');
|
||||||
|
const nameInputEl = document.querySelector('#name-input');
|
||||||
|
const emailInputEl = document.querySelector('#email-input');
|
||||||
|
const websiteInputEl = document.querySelector('#website-input');
|
||||||
|
const msgInputEl = document.querySelector('#message-input');
|
||||||
|
const publishBtn = document.querySelector('.gb__form--submit');
|
||||||
|
const messageListEl = document.querySelector('.gb__message--list');
|
||||||
|
|
||||||
|
// Initiate guestbook message object
|
||||||
|
let messageObj = {
|
||||||
|
name: '',
|
||||||
|
email: '',
|
||||||
|
website: '',
|
||||||
|
message: '',
|
||||||
|
timestamp: '',
|
||||||
|
replies: [],
|
||||||
|
};
|
||||||
|
|
@ -13,147 +13,73 @@ eleventyNavigation:
|
||||||
|
|
||||||
<p><a href="https://web.archive.org/web/20240510121252/https%3A%2F%2Fleilukin.123guestbook.com%2F">Archive of my previous guestbook hosted on 123Guestbook</a></p>
|
<p><a href="https://web.archive.org/web/20240510121252/https%3A%2F%2Fleilukin.123guestbook.com%2F">Archive of my previous guestbook hosted on 123Guestbook</a></p>
|
||||||
|
|
||||||
<!-- customize labels of htmlcommentbox.com -->
|
<h2>Leave A Message</h2>
|
||||||
<script>
|
|
||||||
/* This code goes ABOVE the main HTML Comment Box code!
|
|
||||||
replace the text in the single quotes below to customize labels.*/
|
|
||||||
hcb_user = {
|
|
||||||
/* L10N */
|
|
||||||
comments_header: 'Guestbook',
|
|
||||||
name_label: 'Name',
|
|
||||||
content_label: 'Enter your message here',
|
|
||||||
submit: 'Send Message',
|
|
||||||
logout_link: '<img title="log out" src="https://www.htmlcommentbox.com/static/images/door_out.svg" alt="[logout]" class="hcb-icon hcb-door-out"/>',
|
|
||||||
admin_link: '<img src="https://www.htmlcommentbox.com/static/images/door_in.svg" alt="[login]" class="hcb-icon hcb-door-in"/>',
|
|
||||||
no_comments_msg: 'No one has left any message yet. Be the first!',
|
|
||||||
add: 'Add your message',
|
|
||||||
again: 'Post another message',
|
|
||||||
rss: '<img src="https://www.htmlcommentbox.com/static/images/feed.svg" class="hcb-icon" alt="rss"/> ',
|
|
||||||
said: 'said:',
|
|
||||||
prev_page: '<img src="https://www.htmlcommentbox.com/static/images/arrow_left.png" class="hcb-icon" title="previous page" alt="[prev]"/>',
|
|
||||||
next_page: '<img src="https://www.htmlcommentbox.com/static/images/arrow_right.png" class="hcb-icon" title="next page" alt="[next]"/>',
|
|
||||||
showing: 'Showing',
|
|
||||||
to: 'to',
|
|
||||||
website_label: 'website (optional)',
|
|
||||||
email_label: 'email',
|
|
||||||
anonymous: 'Anonymous',
|
|
||||||
mod_label: '(mod)',
|
|
||||||
subscribe: 'Email Me Replies',
|
|
||||||
add_image: 'Add Image',
|
|
||||||
are_you_sure: 'Do you want to flag this comment as inappropriate?',
|
|
||||||
|
|
||||||
reply: 'Reply',
|
<form class="gb__form">
|
||||||
flag: 'Flag',
|
<div class="gb__form--input">
|
||||||
like: 'Like',
|
<label for="name-input">Name:</label>
|
||||||
|
<input type="text" name="name" id="name-input" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
/* dates */
|
<div class="gb__form--input">
|
||||||
days_ago: 'days ago',
|
<label for="email-input">Email:</label>
|
||||||
hours_ago: 'hours ago',
|
<input type="email" name="email" id="email-input" required>
|
||||||
minutes_ago: 'minutes ago',
|
</div>
|
||||||
within_the_last_minute: 'within the last minute',
|
|
||||||
|
|
||||||
msg_thankyou: 'Thank you for your message!',
|
<div class="gb__form--input">
|
||||||
msg_approval: 'NOTE: This message is not published until approved',
|
<label for="website-input">Website (optional):</label>
|
||||||
msg_approval_required: 'Thank you for your message! Your message will appear once approved by Leilukin.',
|
<input type="text" name="website" id="website-input">
|
||||||
|
</div>
|
||||||
|
|
||||||
err_bad_html: 'Your message contained bad html.',
|
<div class="gb__form--input">
|
||||||
err_bad_email: 'Please enter a valid email address.',
|
<label for="message-input">Message:</label>
|
||||||
err_too_frequent: 'You must wait a few seconds between posting messages.',
|
<textarea type="text" rows="4" name="message" id="message-input" required></textarea>
|
||||||
err_comment_empty: 'Your message was not posted because it was empty!',
|
</div>
|
||||||
err_denied: 'Your message was not accepted.',
|
|
||||||
err_unknown: 'Your message was blocked for unknown reasons, please report this.',
|
|
||||||
err_spam: 'Your message was detected as spam.',
|
|
||||||
err_blocked: 'Your message was blocked by site policy.',
|
|
||||||
|
|
||||||
/* SETTINGS */
|
<button type="submit" class="gb__form--submit">Publish</button>
|
||||||
MAX_CHARS: 4096,
|
</form>
|
||||||
PAGE: '',
|
|
||||||
/* ID of the webpage to show comments for. defaults to the webpage the user is currently visiting. */
|
|
||||||
ON_COMMENT: function () {},
|
|
||||||
/* Function to call after commenting. */
|
|
||||||
RELATIVE_DATES: false /* show dates in the form "X hours ago." etc. */
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<!-- done customizing labels of htmlcommentbox.com -->
|
|
||||||
|
|
||||||
<!-- begin wwww.htmlcommentbox.com -->
|
<section class="gb__messages">
|
||||||
<section id="HCB_comment_box">
|
<h2>Messages</h2>
|
||||||
<a href="http://www.htmlcommentbox.com">Widget</a> is loading messages...
|
<div class="gb__message--list"></div>
|
||||||
</section>
|
</section>
|
||||||
<link rel="stylesheet" type="text/css" href="https://www.htmlcommentbox.com/static/skins/bootstrap/twitter-bootstrap.css?v=0"/>
|
|
||||||
<script type="text/javascript" id="hcb" defer>
|
|
||||||
/* <!-- */
|
|
||||||
if (!window.hcb_user) {
|
|
||||||
hcb_user = {};
|
|
||||||
}
|
|
||||||
(function () {
|
|
||||||
const s = document.createElement("script"),
|
|
||||||
l = hcb_user.PAGE || ("" + window.location).replace(/'/g, "%27"),
|
|
||||||
h = "https://www.htmlcommentbox.com";
|
|
||||||
s.setAttribute("type", "text/javascript");
|
|
||||||
s.setAttribute("src", h + "/jread?page=" + encodeURIComponent(l).replace("+", "%2B") + "&mod=%241%24wq1rdBcg%24IRFneco1bcPmYKq.t1Oae." + "&opts=16798&num=10&ts=1715702516205");
|
|
||||||
if (typeof s != "undefined")
|
|
||||||
document
|
|
||||||
.getElementsByTagName("head")[0]
|
|
||||||
.appendChild(s);
|
|
||||||
}
|
|
||||||
)();/* --> */
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
#HCB_comment_box {
|
.gb__form,
|
||||||
height: auto;
|
.gb__form--input {
|
||||||
font-family: inherit;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
#HCB_comment_box form {
|
|
||||||
display: grid;
|
display: grid;
|
||||||
gap: 0.3em;
|
|
||||||
margin: 1rem 0 1.3rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form textarea,
|
.gb__form {
|
||||||
#HCB_comment_box #hcb_form #hcb_form_name {
|
gap: 0.6em;
|
||||||
width: 100%;
|
margin-bottom: 2em;
|
||||||
font-family: inherit;
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form #replying_to_container,
|
.gb__form--input {
|
||||||
#HCB_comment_box .date {
|
gap: 0.2em;
|
||||||
font-size: 0.9rem;
|
|
||||||
color: var(--clr-body-txt);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form textarea:focus,
|
.gb__form--submit {
|
||||||
#HCB_comment_box #hcb_form #hcb_form_name:focus {
|
border: none;
|
||||||
outline: 0.25em solid var(--clr-link);
|
|
||||||
}
|
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .btn,
|
|
||||||
#HCB_comment_box #HCB_comment_form_box .btn {
|
|
||||||
background: var(--clr-link-btn-bg);
|
background: var(--clr-link-btn-bg);
|
||||||
color: var(--clr-link-btn-txt);
|
color: var(--clr-link-btn-txt);
|
||||||
font-size: 1.2rem;
|
padding: 0.3em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .btn:focus,
|
.gb__form--input input,
|
||||||
#HCB_comment_box #HCB_comment_form_box .btn:focus {
|
.gb__form--input textarea,
|
||||||
outline: 0.15em solid var(--clr-link-btn-txt);
|
.gb__form--submit {
|
||||||
|
border-radius: 0.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .home-desc a,
|
.gb__form--input textarea {
|
||||||
#HCB_comment_box .home-desc a:visited,
|
resize: vertical;
|
||||||
#HCB_comment_box .hcb-comment-tb button {
|
|
||||||
color: var(--clr-link);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
#HCB_comment_box #hcb_form .home-desc a,
|
.gb__form--input input:focus,
|
||||||
#HCB_comment_box .home-desc a:visited {
|
.gb__form--input textarea:focus {
|
||||||
text-decoration: underline;
|
outline: 0.15em solid var(--clr-link);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
<!-- end www.htmlcommentbox.com -->
|
|
||||||
|
|
||||||
<script type="module" src="/assets/js/guestbook.js" defer></script>
|
<script type="module" src="/assets/js/guestbook.js" defer></script>
|
||||||
Loading…
Reference in New Issue