andyburke/autonomous.contact
1
0
Fork 1
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: add a way to close the invite box

Browse source
This commit is contained in:
Andy Burke 2025-10-08 19:07:21 -07:00
parent 32cec2baab
commit 8337f81b85
2 changed files with 50 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

29
public/base.css
View file

@ -755,6 +755,35 @@ body[data-perms*="files.write.own"] [data-requires-permission="files.write.own"]
border-radius: 100px; border-radius: 100px;
} }
/* ICON - CLOSE */
.icon.close {
box-sizing: border-box;
position: relative;
display: block;
transform: scale(var(--icon-scale, 1));
width: 22px;
height: 22px;
border: 2px solid;
border-radius: var(--border-radius);
}
.icon.close::after,
.icon.close::before {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
width: 12px;
height: 2px;
background: currentColor;
transform: rotate(45deg);
border-radius: var(--border-radius);
top: 8px;
left: 3px;
}
.icon.close::after {
transform: rotate(-45deg);
}
/* ICON - CONTROLLER */ /* ICON - CONTROLLER */
.icon.controller { .icon.controller {
box-sizing: border-box; box-sizing: border-box;

26
public/sidebar/sidebar.html
View file

@ -33,14 +33,21 @@
document.addEventListener("topic_changed", update_topic_indicators); document.addEventListener("topic_changed", update_topic_indicators);
document.addEventListener("user_logged_in", update_topic_indicators); document.addEventListener("user_logged_in", update_topic_indicators);
function clear_invite_popup() {
document.body.querySelectorAll(".invitepopover").forEach((element) => element.remove());
}
function generate_invite(click_event) { function generate_invite(click_event) {
click_event.preventDefault();
const button = click_event.target; const button = click_event.target;
document.body.querySelectorAll(".invitepopover").forEach((element) => element.remove()); clear_invite_popup();
const invite_div = document.createElement("div"); const invite_div = document.createElement("div");
invite_div.classList.add("invitepopover"); invite_div.classList.add("invitepopover");
invite_div.innerHTML = `<form> invite_div.innerHTML = `
<div class="icon close" onclick="clear_invite_popup()"></div>
<form>
<input name="code" type="text" placeholder="Custom code (optional)"> <input name="code" type="text" placeholder="Custom code (optional)">
<button onclick="create_invite(event);">Generate</button> <button onclick="create_invite(event);">Generate</button>
</form>`; </form>`;
@ -89,6 +96,7 @@
invite_popover.innerHTML = ` invite_popover.innerHTML = `
<div> <div>
<div class="icon close" onclick="clear_invite_popup()"></div>
<div class="share-option"> <div class="share-option">
<span class="name">Code</span> <span class="name">Code</span>
<input readonly type="text" name="code" value="${invite_code.code}" /> <input readonly type="text" name="code" value="${invite_code.code}" />
@ -234,7 +242,15 @@
display: inline-block; display: inline-block;
} }
.share-option input { .invitepopover .icon.close {
cursor: pointer;
margin-right: -0.25rem;
margin-top: -0.25rem;
margin-bottom: 0.75rem;
margin-left: auto;
}
.invitepopover .share-option input {
padding: 0.75rem; padding: 0.75rem;
margin: 0 1rem 1rem 0; margin: 0 1rem 1rem 0;
background: none; background: none;
@ -246,7 +262,7 @@
width: 15rem; width: 15rem;
} }
.share-option button { .invitepopover .share-option button {
padding: 1rem; padding: 1rem;
text-transform: uppercase; text-transform: uppercase;
border: 1px solid var(--border-subtle); border: 1px solid var(--border-subtle);