Changing how the RSVP button is displayed and how setting the cookie works
This commit is contained in:
parent
a535d65b52
commit
0e04c0a235
6 changed files with 29 additions and 28 deletions
|
|
@ -6,6 +6,13 @@
|
|||
<body>
|
||||
<h1 class="title fontXL textCenter backgroundLightGreen colorWhite">Collin and Lucy's Wedding</h1>
|
||||
<div class="contents fontM">
|
||||
<a class="rsvpButton backgroundLightGreen hidden" href="/rsvp">
|
||||
<div class="textCenter">
|
||||
<p class="colorBlack">
|
||||
RSVP
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<div>
|
||||
<h2 class="textLeft fontL colorLightGreen">When?</h2>
|
||||
<p>Saturday 16th of May 2026</p>
|
||||
|
|
@ -35,16 +42,6 @@
|
|||
<a href="https://www.openstreetmap.org/node/2869212621"><h5 class="fontS">Open Map</h5></a>
|
||||
</div>
|
||||
</div>
|
||||
<a href="/rsvp">
|
||||
<div class="rsvpButton textCenter backgroundLightGreen hidden">
|
||||
<p class="colorBlack">
|
||||
R <br/>
|
||||
S <br/>
|
||||
V <br/>
|
||||
P <br/>
|
||||
</p>
|
||||
</div>
|
||||
</a>
|
||||
<script src="/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -8,20 +8,10 @@ function hasRsvped() {
|
|||
return cookies[COOKIE_NAME] === "true";
|
||||
}
|
||||
|
||||
function persistRsvp(hasRsvped = true) {
|
||||
document.cookie = `${COOKIE_NAME}=${String(hasRsvped)}; path=/`;
|
||||
console.log(document.cookie);
|
||||
}
|
||||
|
||||
function rsvpButtonClicked() {
|
||||
persistRsvp(true);
|
||||
}
|
||||
|
||||
window.onload = function () {
|
||||
if (!hasRsvped()) {
|
||||
const rsvpButton = document.querySelector(".rsvpButton");
|
||||
rsvpButton.classList.remove("hidden");
|
||||
|
||||
rsvpButton.onclick = rsvpButtonClicked;
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -10,5 +10,6 @@
|
|||
<br/>
|
||||
<a href="/">Back</a>
|
||||
</div>
|
||||
<script src="/rsvp_confirmed.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
11
client/rsvp_confirmed.js
Normal file
11
client/rsvp_confirmed.js
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
const COOKIE_NAME = "hasRsvped";
|
||||
|
||||
function persistRsvp(hasRsvped = true) {
|
||||
document.cookie = `${COOKIE_NAME}=${String(hasRsvped)}; path=/`;
|
||||
}
|
||||
|
||||
function rsvpConfirmed() {
|
||||
persistRsvp(true);
|
||||
}
|
||||
|
||||
rsvpConfirmed();
|
||||
|
|
@ -138,7 +138,7 @@ button {
|
|||
/* #region contents */
|
||||
.contents {
|
||||
height: auto;
|
||||
padding: 50px;
|
||||
padding: 32px;
|
||||
}
|
||||
|
||||
@media (max-width: 539px) {
|
||||
|
|
@ -188,14 +188,13 @@ button {
|
|||
|
||||
/* #region rsvp */
|
||||
.rsvpButton {
|
||||
position: fixed;
|
||||
height: 100px;
|
||||
width: 18px;
|
||||
top: 25px;
|
||||
right: 0px;
|
||||
display:inline-block;
|
||||
width: 80%;
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
text-decoration: none;
|
||||
padding: 16px;
|
||||
border-radius: 16px 0px 0px 16px;
|
||||
mix-blend-mode: color-dodge;
|
||||
border-radius: 16px 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -176,6 +176,9 @@ func (h *Handler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
|
|||
case r.Method == "GET" && r.URL.Path == "/rsvp.js":
|
||||
getStaticFile("./client/rsvp.js", "text/javascript", w)
|
||||
|
||||
case r.Method == "GET" && r.URL.Path == "/rsvp_confirmed.js":
|
||||
getStaticFile("./client/rsvp_confirmed.js", "text/javascript", w)
|
||||
|
||||
case r.Method == "GET" && r.URL.Path == "/rsvps_list.js":
|
||||
getStaticFile("./client/rsvps_list.js", "text/javascript", w)
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue