masterhc
/
Remchanv2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Visual Implementation of Allow invites

Browse Source
master
Cristiano Pires 1 year ago
parent f7a6503d4c
commit f5f84953c9
3 changed files with 89 additions and 32 deletions
Show Stats Download Patch File Download Diff File

91
public/css/dashboard.css
Unescape View File

@ -12,6 +12,10 @@ body
#userWrapper #userWrapper
{ {
position: absolute; position: absolute;
display: flex;
flex-wrap: wrap;
gap: 1em;
justify-content: center;
top:3vh; top:3vh;
left:50%; left:50%;
transform: translateX(-50%); transform: translateX(-50%);
@ -23,37 +27,35 @@ body
} }
#avatar #avatar
{ {
flex-direction: column;
background-color: ivory; background-color: ivory;
height: 10vh; height: 10vh;
width: 10vh; width: 10vh;
background-size: 10vh 10vh; background-size: 10vh 10vh;
position: relative; position: relative;
top:2vh; top:2vh;
left: 10%;
border-radius: 10px; border-radius: 10px;
} }
#userName .userNameWrapper
{ {
position: relative; display: flex;
left: 50%; flex-direction: column;
top:-25%; min-width: 20vh;
font-size: larger; max-width: 70%;
font-family: 'Lato'; height: 15vh;
font-weight: bolder; justify-content: center;
color: rgb(15, 98, 131); text-align: center;
} }
#guilds #userName
{ {
position: relative; margin: 0;
top:20vh; position: relative;
background-color: rgba(210, 252, 253, 0.541);
width: 80%; font-size: 2.5em;
height: 70%; font-family: 'Lato';
font-family: 'Lato';
font-weight: bolder; font-weight: bolder;
text-align: center; white-space: pre-wrap;
border-radius: 2%; color: rgb(15, 98, 131);
border: 2px solid #020608;
} }
.DiscordAddBtn .DiscordAddBtn
{ {
@ -69,28 +71,69 @@ body
} }
.material-symbols-outlined .close, .checkBox
{ {
cursor: pointer; cursor: pointer;
} }
.popup .material-symbols-outlined .close
{
position: relative;
top:-0.1em;
right:1vh;
float:right;
}
.popup .checkBox
{ {
position: relative; position: relative;
top:-0.1em; top:-0.1em;
right:1vh; right:1vh;
float:right; float:right;
} }
.popup .info
{
position: relative;
font-size: 20px;
}
.popup .tooltip {
visibility: hidden;
width: 17vw;
background-color: rgba(37, 14, 165, 0.171);
color: ivory;
font-size: small;
text-align: center;
border-radius: 6px;
padding: 5px 0;
white-space: pre-wrap;
/* Position the tooltip */
position: absolute;
z-index: 1;
}
.info:hover .tooltip{
visibility: visible;
}
.popup .popup
{ {
position: absolute; position: absolute;
height: 30%; min-height: 30%;
max-height: 50%;
width: 50%; width: 50%;
top:calc(50% - 15%); top:calc(50% - 15%);
background-color: rgba(210, 252, 253, 0.541); background-color: rgba(210, 252, 253, 0.295);
border-radius: 5px; border-radius: 5px;
border: 2px solid #020608; border: 2px solid #020608;
z-index: 10; z-index: 10;
text-align: center; text-align: center;
backdrop-filter: blur(3px);
}
.popup p
{
margin-top: 0.5em;
margin-bottom: 0.5em;
}
.popup h3
{
margin-bottom: 1.7em;
} }
h1 h1
{ {

2
public/js/dashboard.js
Unescape View File

@ -26,7 +26,7 @@ function updateUser(accessToken, tokenType)
{ {
userID = response.id; userID = response.id;
avatar.style.backgroundImage = `url(https://cdn.discordapp.com/avatars/${response.id}/${response.avatar}.jpeg)` avatar.style.backgroundImage = `url(https://cdn.discordapp.com/avatars/${response.id}/${response.avatar}.jpeg)`
userName.textContent = response.username+"'s servers:" userName.textContent = response.username+"'s servers"
}) })
.catch(console.error); .catch(console.error);
} }

28
views/dashboard.ejs
Unescape View File

@ -9,14 +9,16 @@
<link rel="scr" type="text/js" href="js/dashboard.js"/> <link rel="scr" type="text/js" href="js/dashboard.js"/>
<link rel="stylesheet" type="text/css" href="/css/dashboard.css" id="pagesheet"/> <link rel="stylesheet" type="text/css" href="/css/dashboard.css" id="pagesheet"/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" /> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@48,400,0,0" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
</head> </head>
<body> <body>
</body> </body>
<div id="userWrapper"> <div id="userWrapper">
<div id="avatar"></div> <div id="avatar"></div>
<h1><span id="userName">USERNAME</span></h1> <div class="userNameWrapper">
<p id="userName">USERNAME</p>
</div>
</div> </div>
<div id="Guilds"> <div id="Guilds">
@ -26,11 +28,23 @@
cancel cancel
</i> </i>
<h3 id="guild" class="guildname">PLACEHOLDER</h3> <h3 id="guild" class="guildname">PLACEHOLDER</h3>
<p>Activate Music: <p>Activate Music: <span class="material-symbols-outlined info">
<span class="material-symbols-outlined" id="music">check_box_outline_blank</span></p> info
<span class="tooltip"> Allow your server to use music (Temporarly does nothing as its a WIP[work in progress]).</span>
<p>Activate Strikes: </span>
<span class="material-symbols-outlined" id="strikes">check_box_outline_blank </span> <span class="material-symbols-outlined checkBox" id="music">check_box_outline_blank</span>
</p>
<p>Activate Strikes:<span class="material-symbols-outlined info">
info
<span class="tooltip"> Activate a 3 strike system before automatic ban. (Theese are to be validated before they are self-actionable)</span>
</span>
<span class="material-symbols-outlined checkBox" id="strikes">check_box_outline_blank </span>
</p>
<p>Activate Invites:<span class="material-symbols-outlined info">
info
<span class="tooltip"> Allow invites to other servers on your server.</span>
</span>
<span class="material-symbols-outlined checkBox" id="invites">check_box_outline_blank </span>
</p> </p>
<p id="RoleRules" onclick="handleToggleRules(this)">Role rules</p> <p id="RoleRules" onclick="handleToggleRules(this)">Role rules</p>
<p id="Feeds" onclick="handleToggleFeeds(this)">Feeds</p> <p id="Feeds" onclick="handleToggleFeeds(this)">Feeds</p>

Write Preview
Loading…
Cancel
Save