From 135739f856a559600d3e6f8ca2750d4bb33e4ec7 Mon Sep 17 00:00:00 2001 From: Corban-Lee Jones Date: Fri, 13 Sep 2024 19:56:54 +0100 Subject: [PATCH] wider sidebar support doesnt support small screen yet --- apps/static/css/home/index.css | 17 ++++++++++++++++- apps/static/js/home/servers.js | 12 ++++++------ apps/static/js/home/subscriptions.js | 9 +++++++++ apps/templates/home/index.html | 26 +++++++++++++++++++------- 4 files changed, 50 insertions(+), 14 deletions(-) diff --git a/apps/static/css/home/index.css b/apps/static/css/home/index.css index 7484cce..2b195ec 100644 --- a/apps/static/css/home/index.css +++ b/apps/static/css/home/index.css @@ -13,7 +13,7 @@ .bump { animation: bump .2s ease-out; } - +/* .server-item.active img { border-radius: .75rem !important; } @@ -28,6 +28,21 @@ .server-item-selector img { transition: border-radius .15s ease-in; +} */ + +.server-item { + max-width: calc(16rem - 1rem); +} + +.server-item-selector { + display: flex; + justify-content: flex-start; + align-items: center; + flex-wrap: nowrap; +} + +.server-item-selector:hover { + background-color: var(--bs-secondary-bg); } /* widths */ diff --git a/apps/static/js/home/servers.js b/apps/static/js/home/servers.js index 2312e4d..23b35f3 100644 --- a/apps/static/js/home/servers.js +++ b/apps/static/js/home/servers.js @@ -132,14 +132,14 @@ async function loadSavedGuilds() { // Create an element for the added server and show it function addServerTemplate(serverPrimaryKey, serverGuildId, serverName, serverIconHash, serverPermissions, serverIsOwner) { - template = $($("#serverItemTemplate").html()); + let template = $($("#serverItemTemplate").html()); + let imageUrl = `https://cdn.discordapp.com/icons/${serverGuildId}/${serverIconHash}.webp?size=80`; - template.find("img").attr("src", `https://cdn.discordapp.com/icons/${serverGuildId}/${serverIconHash}.webp?size=80`); + template.find("img").attr("src", imageUrl); + template.find(".js-guildId").text(serverGuildId); + template.find(".js-guildName").text(serverName); template.attr("data-id", serverPrimaryKey); - - // Tooltips - template.attr("data-bs-title", serverName); - template.tooltip(); + template.attr("data-guild-id", serverGuildId); // Bind the button for selecting this server template.find(".server-item-selector").off("click").on("click", function() { diff --git a/apps/static/js/home/subscriptions.js b/apps/static/js/home/subscriptions.js index b4be770..72a0aa4 100644 --- a/apps/static/js/home/subscriptions.js +++ b/apps/static/js/home/subscriptions.js @@ -519,12 +519,21 @@ async function loadChannelOptions(guildId) { // If we can't fetch channels due to error if (channels.code === 50001) { + let server = getServerFromSnowflake(guildId); // Also check that the user hasn't changed the currently active guild, otherwise // the alert will show under the wrong server. if (getCurrentlyActiveServer().guild_id === guildId) $("#serverJoinAlert").show(); + // Warning icon on sidebar server select + let sidebarItem = $(`#serverList .server-item[data-guild-id="${guildId}"]`); + if (!sidebarItem.find(".badge.text-warning").length) { + let alertTemplate = $($("#serverItemIconTemplate").html()); + alertTemplate.attr("data-bs-title", `The Bot isn't a member of ${sanitise(server.name)}`).tooltip(); + sidebarItem.find(".server-item-selector").append(alertTemplate); + } + const guildName = sanitise(getServerFromSnowflake(guildId).name); throw new Error( diff --git a/apps/templates/home/index.html b/apps/templates/home/index.html index ef52569..cc17c2d 100644 --- a/apps/templates/home/index.html +++ b/apps/templates/home/index.html @@ -12,11 +12,12 @@ {% block content %}
-
-
    +
    +
    • -
    @@ -112,12 +113,23 @@ {% block javascript %} +