azom.dev
Self-hosted, federated location sharing app and server that prioritizes user privacy and security
end-to-end-encryption
location-sharing
privacy
self-hosted
federated
added a 15% padding to top of header on home and add-friend pages so top controls can be accessed and aren't cut off.
kishka.cc
+47
-9
+1
app/src/add-friend-page/add-friend.css
+1
app/src/add-friend-page/add-friend.css
+1
app/src/home-page/home.css
+1
app/src/home-page/home.css
+45
-9
app/src/home-page/home.html
+45
-9
app/src/home-page/home.html
···
15
15
<!-- <@azom.dev> somehow the "+" emoji does not display in the code for me, but it's temporary anyways -->
16
16
<!-- <@kishka.cc> we will need to replace these with svgs, as it's the font that messes up the emoji -->
17
17
<button class="icon-btn" @click="updateServer()">
18
-
<img class="svg-icon" src="/src/assets/paperplane.svg" alt="Paperplane Flying Icon" />
18
+
<img
19
+
class="svg-icon"
20
+
src="/src/assets/paperplane.svg"
21
+
alt="Paperplane Flying Icon"
22
+
/>
19
23
</button>
20
24
<button class="icon-btn" @click="addFriend()">
21
-
<img class="svg-icon" src="/src/assets/user+.svg" alt="Friend Add Icon" />
25
+
<img
26
+
class="svg-icon"
27
+
src="/src/assets/user+.svg"
28
+
alt="Friend Add Icon"
29
+
/>
22
30
</button>
23
31
<button class="icon-btn" @click="openSettings()">
24
-
<img class="svg-icon" src="/src/assets/setting.svg" alt="Settings Icon" />
32
+
<img
33
+
class="svg-icon"
34
+
src="/src/assets/setting.svg"
35
+
alt="Settings Icon"
36
+
/>
25
37
</button>
26
38
</div>
27
39
</header>
···
37
49
<div class="content">
38
50
<div class="friends-header">
39
51
<h2 style="font-size: 1rem; margin: 0">Friends</h2>
40
-
<span style="color: #6b7280; font-size: 0.9rem">(<span x-text="friends.length"></span>)</span>
52
+
<span style="color: #6b7280; font-size: 0.9rem"
53
+
>(<span x-text="friends.length"></span>)</span
54
+
>
41
55
</div>
42
56
<!--TODO idk why but sometimes when i launch the app I see the stuff when you have no friends for a split second before I see them appear, even tho we get them in init -->
43
57
<template x-if="friends.length > 0">
···
46
60
<div class="friend-card">
47
61
<strong x-text="friend.name"></strong>
48
62
<div class="friend-actions">
49
-
<button class="view-btn" @click="viewLocation(friend.id)"><img class="svg-icon" src="/src/assets/pin-location.svg" alt="Pin Icon" />View</button>
63
+
<button
64
+
class="view-btn"
65
+
@click="viewLocation(friend.id)"
66
+
>
67
+
<img
68
+
class="svg-icon"
69
+
src="/src/assets/pin-location.svg"
70
+
alt="Pin Icon"
71
+
/>View
72
+
</button>
50
73
51
-
<button class="menu-icon" style="margin-bottom: auto" @click="friendOptions(friend.id)">
52
-
<img class="svg-icon" src="/src/assets/ellipsis-vertical.svg" alt="Options menu" />
74
+
<button
75
+
class="menu-icon"
76
+
style="margin-bottom: auto"
77
+
@click="friendOptions(friend.id)"
78
+
>
79
+
<img
80
+
class="svg-icon"
81
+
src="/src/assets/ellipsis-vertical.svg"
82
+
alt="Options menu"
83
+
/>
53
84
</button>
54
85
</div>
55
86
</div>
···
72
103
<div class="content" style="text-align: center">
73
104
<h4>Admin Controls:</h4>
74
105
<div style="display: flex; justify-content: center">
75
-
<button @click="generateSignupKey()">Generate signup key</button>
106
+
<button @click="generateSignupKey()">
107
+
Generate signup key
108
+
</button>
76
109
</div>
77
-
<div style="display: flex; justify-content: center" x-show="newSignupKey != ''">
110
+
<div
111
+
style="display: flex; justify-content: center"
112
+
x-show="newSignupKey != ''"
113
+
>
78
114
<p>New signup key: <a x-text="newSignupKey"></a></p>
79
115
</div>
80
116
</div>