------------------------------------------------------------
commit 6d89bdd3cf32632b7696c9e62d7fb5073200b66a
Author: root <root@hub.scroll.pub>
Date: Sat Nov 9 05:09:35 2024 +0000
Deleted cfx.html
diff --git a/cfx.html b/cfx.html
deleted file mode 100644
index fc4a329..0000000
--- a/cfx.html
+++ /dev/null
@@ -1,86 +0,0 @@
-<!doctype html>
-<html lang="en">
- <head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
- <title>CFX LOOKUP</title>
- <link
- href="https://fonts.googleapis.com/css2?family=Orbitron&display=swap"
- rel="stylesheet"
- />
- <link
- href="https://fonts.googleapis.com/icon?family=Material+Icons"
- rel="stylesheet"
- />
- <link
- href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400&display=swap"
- rel="stylesheet"
- />
- <link rel="stylesheet" href="styles.css" />
- </head>
- <body>
- <div class="container">
- <h1>CFX LOOKUP</h1>
-
- <div class="tabs">
- <button id="fivemTab" class="tab-button active">FiveM Server</button>
- <button id="discordTab" class="tab-button">Discord ID</button>
- </div>
-
- <div id="fivemContent" class="tab-content">
- <div class="search-container">
- <input type="text" id="serverIp" placeholder="Enter server IP" />
- <button id="fivemSearchButton">Search</button>
- </div>
-
- <div id="fivemErrorMessage" class="error-message"></div>
-
- <div id="serverInfo" class="hidden">
- <h2 id="serverName"></h2>
- <div id="playerSearch" class="search-container hidden">
- <input
- type="text"
- id="playerSearchInput"
- placeholder="Search players"
- />
- <select id="searchField">
- <option value="name">Search by Name</option>
- <option value="id">Search by ID</option>
- </select>
- </div>
- <div id="playerList" class="player-grid"></div>
- </div>
- </div>
-
- <div id="discordContent" class="tab-content hidden">
- <div class="search-container">
- <input type="text" id="discordId" placeholder="Enter Discord ID" />
- <button id="discordSearchButton">Search</button>
- </div>
-
- <div id="discordErrorMessage" class="error-message"></div>
-
- <div id="userInfo" class="hidden">
- <div class="profile-card">
- <div class="profile-header">
- <div class="profile-picture">
- <img id="avatar" src="" alt="User Avatar" />
- </div>
- <div class="profile-name">
- <h2 id="username"></h2>
- <span id="globalName"></span>
- </div>
- </div>
- <div class="profile-details">
- <p>User ID: <span id="userId"></span></p>
- <p>Created At: <span id="createdAt"></span></p>
- <p>Badges: <span id="badges"></span></p>
- </div>
- </div>
- </div>
- </div>
- </div>
-
- <script src="main.js"></script>
- </body>
-</html>
------------------------------------------------------------
commit 2521689ff2b3788e1c42164b1b257dcc85694689
Author: root <root@hub.scroll.pub>
Date: Sat Nov 9 05:09:24 2024 +0000
Deleted main.js
diff --git a/main.js b/main.js
deleted file mode 100644
index 3d7dd06..0000000
--- a/main.js
+++ /dev/null
@@ -1,217 +0,0 @@
-document.addEventListener("DOMContentLoaded", () => {
- const fivemTab = document.getElementById("fivemTab");
- const discordTab = document.getElementById("discordTab");
- const fivemContent = document.getElementById("fivemContent");
- const discordContent = document.getElementById("discordContent");
-
- const serverIpInput = document.getElementById("serverIp");
- const fivemSearchButton = document.getElementById("fivemSearchButton");
- const fivemErrorMessage = document.getElementById("fivemErrorMessage");
- const serverInfo = document.getElementById("serverInfo");
- const serverName = document.getElementById("serverName");
- const playerList = document.getElementById("playerList");
- const playerSearch = document.getElementById("playerSearch");
- const playerSearchInput = document.getElementById("playerSearchInput");
- const searchField = document.getElementById("searchField");
-
- const discordIdInput = document.getElementById("discordId");
- const discordSearchButton = document.getElementById("discordSearchButton");
- const discordErrorMessage = document.getElementById("discordErrorMessage");
- const userInfo = document.getElementById("userInfo");
- const avatar = document.getElementById("avatar");
- const username = document.getElementById("username");
- const globalName = document.getElementById("globalName");
- const userId = document.getElementById("userId");
- const createdAt = document.getElementById("createdAt");
- const badges = document.getElementById("badges");
-
- let serverData = null;
-
- fivemTab.addEventListener("click", () => switchTab("fivem"));
- discordTab.addEventListener("click", () => switchTab("discord"));
- fivemSearchButton.addEventListener("click", fetchServerInfo);
- discordSearchButton.addEventListener("click", fetchDiscordUserInfo);
- playerSearchInput.addEventListener("input", filterPlayers);
- searchField.addEventListener("change", filterPlayers);
-
- function switchTab(tab) {
- if (tab === "fivem") {
- fivemTab.classList.add("active");
- discordTab.classList.remove("active");
- fivemContent.classList.add("active");
- fivemContent.classList.remove("hidden");
- discordContent.classList.remove("active");
- discordContent.classList.add("hidden");
- } else {
- discordTab.classList.add("active");
- fivemTab.classList.remove("active");
- discordContent.classList.add("active");
- discordContent.classList.remove("hidden");
- fivemContent.classList.remove("active");
- fivemContent.classList.add("hidden");
- }
- }
-
- async function fetchServerInfo() {
- const serverIp = serverIpInput.value.trim();
- if (!serverIp) return;
-
- try {
- fivemErrorMessage.textContent = "";
- fivemSearchButton.textContent = "Searching...";
- fivemSearchButton.disabled = true;
- serverInfo.classList.add("hidden");
-
- const response = await fetch(
- `https://servers-frontend.fivem.net/api/servers/single/${serverIp}`,
- );
- if (!response.ok) {
- throw new Error("Server not found or API error");
- }
-
- serverData = await response.json();
- displayServerInfo();
- } catch (error) {
- fivemErrorMessage.textContent =
- "Failed to fetch server information. Please check the IP and try again.";
- } finally {
- fivemSearchButton.textContent = "Search";
- fivemSearchButton.disabled = false;
- }
- }
-
- function displayServerInfo() {
- serverName.textContent = `${stripColorCodes(serverData.Data.hostname)} - ${serverData.Data.clients}/${serverData.Data.sv_maxclients} Players`;
- serverInfo.classList.remove("hidden");
- playerSearch.classList.remove("hidden");
- filterPlayers();
- }
-
- function filterPlayers() {
- const searchTerm = playerSearchInput.value.toLowerCase();
- const field = searchField.value;
-
- const filteredPlayers = serverData.Data.players.filter((player) => {
- if (field === "id") {
- return player.id.toString().includes(searchTerm);
- }
- return player.name.toLowerCase().includes(searchTerm);
- });
-
- displayPlayers(filteredPlayers);
- }
-
- function displayPlayers(players) {
- playerList.innerHTML = "";
- players.forEach((player) => {
- const playerCard = createPlayerCard(player);
- playerList.appendChild(playerCard);
- });
- }
-
- function createPlayerCard(player) {
- const card = document.createElement("div");
- card.className = "player-card";
-
- const header = document.createElement("div");
- header.className = "player-header";
- header.innerHTML = `
- <div class="player-name">${player.name}</div>
- <div class="player-ping">Ping: ${player.ping}ms</div>
- <div class="player-id">ID: ${player.id}</div>
- `;
-
- const identifiers = document.createElement("div");
- identifiers.className = "player-identifiers";
- identifiers.innerHTML = "<p><strong>Identifiers:</strong></p>";
-
- player.identifiers.forEach((identifier) => {
- const item = document.createElement("div");
- item.className = "identifier-item";
- item.innerHTML = `
- <span class="identifier-text">${identifier}</span>
- <button class="copy-button" data-clipboard="${identifier}">
- <span class="material-icons">content_copy</span>
- </button>
- `;
- identifiers.appendChild(item);
- });
-
- card.appendChild(header);
- card.appendChild(identifiers);
-
- return card;
- }
-
- function stripColorCodes(text) {
- return text.replace(/\^[0-9]/g, "");
- }
-
- async function fetchDiscordUserInfo() {
- const discordId = discordIdInput.value.trim();
- if (!discordId) return;
-
- try {
- discordErrorMessage.textContent = "";
- discordSearchButton.textContent = "Searching...";
- discordSearchButton.disabled = true;
- userInfo.classList.add("hidden");
-
- const response = await fetch(
- `https://discordlookup.mesalytic.moe/v1/user/${discordId}`,
- );
- if (!response.ok) {
- throw new Error("User not found or API error");
- }
-
- const userData = await response.json();
- displayDiscordUserInfo(userData);
- } catch (error) {
- discordErrorMessage.textContent =
- "Failed to fetch user information. Please check the ID and try again.";
- } finally {
- discordSearchButton.textContent = "Search";
- discordSearchButton.disabled = false;
- }
- }
-
- function displayDiscordUserInfo(user) {
- avatar.src =
- user.avatar.link || "https://cdn.discordapp.com/embed/avatars/0.png";
- username.textContent = user.username;
- globalName.textContent = user.global_name || "";
- userId.textContent = user.id;
- createdAt.textContent = new Date(user.created_at).toLocaleString();
-
- badges.innerHTML = "";
- user.badges.forEach((badge) => {
- const badgeElement = document.createElement("span");
- badgeElement.className = "badge";
- badgeElement.textContent = badge.replace(/_/g, " ");
- badges.appendChild(badgeElement);
- });
-
- userInfo.classList.remove("hidden");
- }
-
- document.addEventListener("click", (e) => {
- if (e.target.closest(".copy-button")) {
- const button = e.target.closest(".copy-button");
- let text = button.getAttribute("data-clipboard");
- text = text.split(":")[1];
-
- navigator.clipboard
- .writeText(text)
- .then(() => {
- const icon = button.querySelector(".material-icons");
- icon.textContent = "check";
- setTimeout(() => {
- icon.textContent = "content_copy";
- }, 1000);
- })
- .catch((err) => {
- console.error("Failed to copy text: ", err);
- });
- }
- });
-});
------------------------------------------------------------
commit 98ca34edbf97b1250946f5841b195d1e76dd30be
Author: root <root@hub.scroll.pub>
Date: Sat Nov 9 05:08:35 2024 +0000
Deleted styles.css
diff --git a/styles.css b/styles.css
deleted file mode 100644
index b806b03..0000000
--- a/styles.css
+++ /dev/null
@@ -1,193 +0,0 @@
-body {
- font-family: "Orbitron", monospace;
- background-color: black;
- color: #4ade80;
- min-height: 100vh;
- margin: 0;
- padding: 0;
-}
-
-.container {
- max-width: 1200px;
- margin: 0 auto;
- padding: 2rem;
-}
-
-h1,
-h2 {
- text-align: center;
- color: #4ade80;
-}
-
-.tabs {
- display: flex;
- justify-content: center;
- margin-bottom: 1rem;
-}
-
-.tab-button {
- font-family: "Orbitron", monospace;
- background-color: #111;
- color: #4ade80;
- border: 1px solid #4ade80;
- padding: 0.5rem 1rem;
- cursor: pointer;
- transition: background-color 0.3s;
-}
-
-.tab-button:hover,
-.tab-button.active {
- background-color: #15803d;
- color: black;
-}
-
-.tab-content {
- display: none;
-}
-
-.tab-content.active {
- display: block;
-}
-
-.search-container {
- display: flex;
- gap: 0.5rem;
- margin-bottom: 1rem;
-}
-
-input,
-select,
-button {
- font-family: "Orbitron", monospace;
- padding: 0.5rem;
- border: 1px solid #4ade80;
- background-color: black;
- color: #4ade80;
-}
-
-input,
-select {
- flex-grow: 1;
-}
-
-button {
- background-color: #15803d;
- color: black;
- cursor: pointer;
- transition: background-color 0.3s;
-}
-
-.error-message {
- color: #ef4444;
- margin-bottom: 1rem;
-}
-
-.hidden {
- display: none;
-}
-
-.player-grid {
- display: grid;
- grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
- gap: 1rem;
-}
-
-.player-card,
-.profile-card {
- background-color: #111;
- border: 1px solid #4ade80;
- border-radius: 8px;
- padding: 1rem;
- box-shadow: 0 2px 10px 0 rgba(74, 222, 128, 0.2);
- overflow: hidden;
-}
-
-.player-header,
-.profile-header {
- margin-bottom: 1rem;
-}
-
-.player-name,
-.profile-name h2 {
- font-weight: bold;
- color: #4ade80;
- margin: 0;
- display: table;
-}
-
-.player-ping,
-.profile-name span {
- font-size: 0.875rem;
- color: #22c55e;
-}
-
-.player-id,
-.profile-details {
- font-size: 0.875rem;
-}
-
-.player-identifiers,
-.profile-details p {
- margin-top: 0.5rem;
- font-family: "Source Code Pro", monospace;
-}
-
-.identifier-item,
-.badge {
- display: flex;
- justify-content: space-between;
- align-items: center;
- margin-bottom: 0.25rem;
- word-break: break-all;
-}
-
-.copy-button {
- background: none;
- border: none;
- color: #22c55e;
- cursor: pointer;
- padding: 0;
- display: flex;
- align-items: center;
- justify-content: center;
- font-size: 1rem;
-}
-
-.profile-picture {
- width: 80px;
- height: 80px;
- margin-right: 1rem;
-}
-
-.profile-picture img {
- width: 100%;
- height: 100%;
- border-radius: 50%;
- object-fit: cover;
- border: 2px solid #4ade80;
-}
-
-.badge {
- display: inline-block;
- margin-right: 0.5rem;
- padding: 0.2rem 0.5rem;
- background-color: #15803d;
- color: #4ade80;
- border-radius: 4px;
- font-size: 0.8rem;
-}
-
-.identifier-text {
- flex-grow: 1;
- margin-right: 0.5rem;
- overflow: hidden;
- text-overflow: ellipsis;
-}
-
-.material-icons {
- font-size: 18px;
-}
-
-.material-icons:hover {
- font-size: 20px;
-}
------------------------------------------------------------
commit 1c664908653faa66026df462e190f71686dfda3f
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:05:49 2024 +0000
Updated index.scroll
diff --git a/index.scroll b/index.scroll
index 6b06f2f..5dc4a2d 100644
--- a/index.scroll
+++ b/index.scroll
@@ -1,5 +1,3 @@
buildHtml
-theme roboto
-
-Hello World my name is
+cfx.html
------------------------------------------------------------
commit 3bdfae4885222cee7ec15ec45b5187427481f049
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:05:09 2024 +0000
Updated main.js
diff --git a/main.js b/main.js
index e69de29..3d7dd06 100644
--- a/main.js
+++ b/main.js
@@ -0,0 +1,217 @@
+document.addEventListener("DOMContentLoaded", () => {
+ const fivemTab = document.getElementById("fivemTab");
+ const discordTab = document.getElementById("discordTab");
+ const fivemContent = document.getElementById("fivemContent");
+ const discordContent = document.getElementById("discordContent");
+
+ const serverIpInput = document.getElementById("serverIp");
+ const fivemSearchButton = document.getElementById("fivemSearchButton");
+ const fivemErrorMessage = document.getElementById("fivemErrorMessage");
+ const serverInfo = document.getElementById("serverInfo");
+ const serverName = document.getElementById("serverName");
+ const playerList = document.getElementById("playerList");
+ const playerSearch = document.getElementById("playerSearch");
+ const playerSearchInput = document.getElementById("playerSearchInput");
+ const searchField = document.getElementById("searchField");
+
+ const discordIdInput = document.getElementById("discordId");
+ const discordSearchButton = document.getElementById("discordSearchButton");
+ const discordErrorMessage = document.getElementById("discordErrorMessage");
+ const userInfo = document.getElementById("userInfo");
+ const avatar = document.getElementById("avatar");
+ const username = document.getElementById("username");
+ const globalName = document.getElementById("globalName");
+ const userId = document.getElementById("userId");
+ const createdAt = document.getElementById("createdAt");
+ const badges = document.getElementById("badges");
+
+ let serverData = null;
+
+ fivemTab.addEventListener("click", () => switchTab("fivem"));
+ discordTab.addEventListener("click", () => switchTab("discord"));
+ fivemSearchButton.addEventListener("click", fetchServerInfo);
+ discordSearchButton.addEventListener("click", fetchDiscordUserInfo);
+ playerSearchInput.addEventListener("input", filterPlayers);
+ searchField.addEventListener("change", filterPlayers);
+
+ function switchTab(tab) {
+ if (tab === "fivem") {
+ fivemTab.classList.add("active");
+ discordTab.classList.remove("active");
+ fivemContent.classList.add("active");
+ fivemContent.classList.remove("hidden");
+ discordContent.classList.remove("active");
+ discordContent.classList.add("hidden");
+ } else {
+ discordTab.classList.add("active");
+ fivemTab.classList.remove("active");
+ discordContent.classList.add("active");
+ discordContent.classList.remove("hidden");
+ fivemContent.classList.remove("active");
+ fivemContent.classList.add("hidden");
+ }
+ }
+
+ async function fetchServerInfo() {
+ const serverIp = serverIpInput.value.trim();
+ if (!serverIp) return;
+
+ try {
+ fivemErrorMessage.textContent = "";
+ fivemSearchButton.textContent = "Searching...";
+ fivemSearchButton.disabled = true;
+ serverInfo.classList.add("hidden");
+
+ const response = await fetch(
+ `https://servers-frontend.fivem.net/api/servers/single/${serverIp}`,
+ );
+ if (!response.ok) {
+ throw new Error("Server not found or API error");
+ }
+
+ serverData = await response.json();
+ displayServerInfo();
+ } catch (error) {
+ fivemErrorMessage.textContent =
+ "Failed to fetch server information. Please check the IP and try again.";
+ } finally {
+ fivemSearchButton.textContent = "Search";
+ fivemSearchButton.disabled = false;
+ }
+ }
+
+ function displayServerInfo() {
+ serverName.textContent = `${stripColorCodes(serverData.Data.hostname)} - ${serverData.Data.clients}/${serverData.Data.sv_maxclients} Players`;
+ serverInfo.classList.remove("hidden");
+ playerSearch.classList.remove("hidden");
+ filterPlayers();
+ }
+
+ function filterPlayers() {
+ const searchTerm = playerSearchInput.value.toLowerCase();
+ const field = searchField.value;
+
+ const filteredPlayers = serverData.Data.players.filter((player) => {
+ if (field === "id") {
+ return player.id.toString().includes(searchTerm);
+ }
+ return player.name.toLowerCase().includes(searchTerm);
+ });
+
+ displayPlayers(filteredPlayers);
+ }
+
+ function displayPlayers(players) {
+ playerList.innerHTML = "";
+ players.forEach((player) => {
+ const playerCard = createPlayerCard(player);
+ playerList.appendChild(playerCard);
+ });
+ }
+
+ function createPlayerCard(player) {
+ const card = document.createElement("div");
+ card.className = "player-card";
+
+ const header = document.createElement("div");
+ header.className = "player-header";
+ header.innerHTML = `
+ <div class="player-name">${player.name}</div>
+ <div class="player-ping">Ping: ${player.ping}ms</div>
+ <div class="player-id">ID: ${player.id}</div>
+ `;
+
+ const identifiers = document.createElement("div");
+ identifiers.className = "player-identifiers";
+ identifiers.innerHTML = "<p><strong>Identifiers:</strong></p>";
+
+ player.identifiers.forEach((identifier) => {
+ const item = document.createElement("div");
+ item.className = "identifier-item";
+ item.innerHTML = `
+ <span class="identifier-text">${identifier}</span>
+ <button class="copy-button" data-clipboard="${identifier}">
+ <span class="material-icons">content_copy</span>
+ </button>
+ `;
+ identifiers.appendChild(item);
+ });
+
+ card.appendChild(header);
+ card.appendChild(identifiers);
+
+ return card;
+ }
+
+ function stripColorCodes(text) {
+ return text.replace(/\^[0-9]/g, "");
+ }
+
+ async function fetchDiscordUserInfo() {
+ const discordId = discordIdInput.value.trim();
+ if (!discordId) return;
+
+ try {
+ discordErrorMessage.textContent = "";
+ discordSearchButton.textContent = "Searching...";
+ discordSearchButton.disabled = true;
+ userInfo.classList.add("hidden");
+
+ const response = await fetch(
+ `https://discordlookup.mesalytic.moe/v1/user/${discordId}`,
+ );
+ if (!response.ok) {
+ throw new Error("User not found or API error");
+ }
+
+ const userData = await response.json();
+ displayDiscordUserInfo(userData);
+ } catch (error) {
+ discordErrorMessage.textContent =
+ "Failed to fetch user information. Please check the ID and try again.";
+ } finally {
+ discordSearchButton.textContent = "Search";
+ discordSearchButton.disabled = false;
+ }
+ }
+
+ function displayDiscordUserInfo(user) {
+ avatar.src =
+ user.avatar.link || "https://cdn.discordapp.com/embed/avatars/0.png";
+ username.textContent = user.username;
+ globalName.textContent = user.global_name || "";
+ userId.textContent = user.id;
+ createdAt.textContent = new Date(user.created_at).toLocaleString();
+
+ badges.innerHTML = "";
+ user.badges.forEach((badge) => {
+ const badgeElement = document.createElement("span");
+ badgeElement.className = "badge";
+ badgeElement.textContent = badge.replace(/_/g, " ");
+ badges.appendChild(badgeElement);
+ });
+
+ userInfo.classList.remove("hidden");
+ }
+
+ document.addEventListener("click", (e) => {
+ if (e.target.closest(".copy-button")) {
+ const button = e.target.closest(".copy-button");
+ let text = button.getAttribute("data-clipboard");
+ text = text.split(":")[1];
+
+ navigator.clipboard
+ .writeText(text)
+ .then(() => {
+ const icon = button.querySelector(".material-icons");
+ icon.textContent = "check";
+ setTimeout(() => {
+ icon.textContent = "content_copy";
+ }, 1000);
+ })
+ .catch((err) => {
+ console.error("Failed to copy text: ", err);
+ });
+ }
+ });
+});
------------------------------------------------------------
commit 3b9b2df5bca7f0227279ac00cdf988d85b368b31
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:05:05 2024 +0000
Updated main.js
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..e69de29
------------------------------------------------------------
commit 8c8e0a5bddc16270345a9e4208af8754a9476053
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:04:47 2024 +0000
Updated cfx.html
diff --git a/cfx.html b/cfx.html
index e69de29..fc4a329 100644
--- a/cfx.html
+++ b/cfx.html
@@ -0,0 +1,86 @@
+<!doctype html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>CFX LOOKUP</title>
+ <link
+ href="https://fonts.googleapis.com/css2?family=Orbitron&display=swap"
+ rel="stylesheet"
+ />
+ <link
+ href="https://fonts.googleapis.com/icon?family=Material+Icons"
+ rel="stylesheet"
+ />
+ <link
+ href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400&display=swap"
+ rel="stylesheet"
+ />
+ <link rel="stylesheet" href="styles.css" />
+ </head>
+ <body>
+ <div class="container">
+ <h1>CFX LOOKUP</h1>
+
+ <div class="tabs">
+ <button id="fivemTab" class="tab-button active">FiveM Server</button>
+ <button id="discordTab" class="tab-button">Discord ID</button>
+ </div>
+
+ <div id="fivemContent" class="tab-content">
+ <div class="search-container">
+ <input type="text" id="serverIp" placeholder="Enter server IP" />
+ <button id="fivemSearchButton">Search</button>
+ </div>
+
+ <div id="fivemErrorMessage" class="error-message"></div>
+
+ <div id="serverInfo" class="hidden">
+ <h2 id="serverName"></h2>
+ <div id="playerSearch" class="search-container hidden">
+ <input
+ type="text"
+ id="playerSearchInput"
+ placeholder="Search players"
+ />
+ <select id="searchField">
+ <option value="name">Search by Name</option>
+ <option value="id">Search by ID</option>
+ </select>
+ </div>
+ <div id="playerList" class="player-grid"></div>
+ </div>
+ </div>
+
+ <div id="discordContent" class="tab-content hidden">
+ <div class="search-container">
+ <input type="text" id="discordId" placeholder="Enter Discord ID" />
+ <button id="discordSearchButton">Search</button>
+ </div>
+
+ <div id="discordErrorMessage" class="error-message"></div>
+
+ <div id="userInfo" class="hidden">
+ <div class="profile-card">
+ <div class="profile-header">
+ <div class="profile-picture">
+ <img id="avatar" src="" alt="User Avatar" />
+ </div>
+ <div class="profile-name">
+ <h2 id="username"></h2>
+ <span id="globalName"></span>
+ </div>
+ </div>
+ <div class="profile-details">
+ <p>User ID: <span id="userId"></span></p>
+ <p>Created At: <span id="createdAt"></span></p>
+ <p>Badges: <span id="badges"></span></p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script src="main.js"></script>
+ </body>
+</html>
------------------------------------------------------------
commit 0da94fe3b63ac4b275cfe46af1e4a7b3bc6d7f72
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:04:32 2024 +0000
Updated cfx.html
diff --git a/cfx.html b/cfx.html
new file mode 100644
index 0000000..e69de29
------------------------------------------------------------
commit 2f50999568acc25df4d5d21e372dd3bb68fa1e82
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:03:25 2024 +0000
Updated styles.css
diff --git a/styles.css b/styles.css
index e69de29..b806b03 100644
--- a/styles.css
+++ b/styles.css
@@ -0,0 +1,193 @@
+body {
+ font-family: "Orbitron", monospace;
+ background-color: black;
+ color: #4ade80;
+ min-height: 100vh;
+ margin: 0;
+ padding: 0;
+}
+
+.container {
+ max-width: 1200px;
+ margin: 0 auto;
+ padding: 2rem;
+}
+
+h1,
+h2 {
+ text-align: center;
+ color: #4ade80;
+}
+
+.tabs {
+ display: flex;
+ justify-content: center;
+ margin-bottom: 1rem;
+}
+
+.tab-button {
+ font-family: "Orbitron", monospace;
+ background-color: #111;
+ color: #4ade80;
+ border: 1px solid #4ade80;
+ padding: 0.5rem 1rem;
+ cursor: pointer;
+ transition: background-color 0.3s;
+}
+
+.tab-button:hover,
+.tab-button.active {
+ background-color: #15803d;
+ color: black;
+}
+
+.tab-content {
+ display: none;
+}
+
+.tab-content.active {
+ display: block;
+}
+
+.search-container {
+ display: flex;
+ gap: 0.5rem;
+ margin-bottom: 1rem;
+}
+
+input,
+select,
+button {
+ font-family: "Orbitron", monospace;
+ padding: 0.5rem;
+ border: 1px solid #4ade80;
+ background-color: black;
+ color: #4ade80;
+}
+
+input,
+select {
+ flex-grow: 1;
+}
+
+button {
+ background-color: #15803d;
+ color: black;
+ cursor: pointer;
+ transition: background-color 0.3s;
+}
+
+.error-message {
+ color: #ef4444;
+ margin-bottom: 1rem;
+}
+
+.hidden {
+ display: none;
+}
+
+.player-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+ gap: 1rem;
+}
+
+.player-card,
+.profile-card {
+ background-color: #111;
+ border: 1px solid #4ade80;
+ border-radius: 8px;
+ padding: 1rem;
+ box-shadow: 0 2px 10px 0 rgba(74, 222, 128, 0.2);
+ overflow: hidden;
+}
+
+.player-header,
+.profile-header {
+ margin-bottom: 1rem;
+}
+
+.player-name,
+.profile-name h2 {
+ font-weight: bold;
+ color: #4ade80;
+ margin: 0;
+ display: table;
+}
+
+.player-ping,
+.profile-name span {
+ font-size: 0.875rem;
+ color: #22c55e;
+}
+
+.player-id,
+.profile-details {
+ font-size: 0.875rem;
+}
+
+.player-identifiers,
+.profile-details p {
+ margin-top: 0.5rem;
+ font-family: "Source Code Pro", monospace;
+}
+
+.identifier-item,
+.badge {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 0.25rem;
+ word-break: break-all;
+}
+
+.copy-button {
+ background: none;
+ border: none;
+ color: #22c55e;
+ cursor: pointer;
+ padding: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 1rem;
+}
+
+.profile-picture {
+ width: 80px;
+ height: 80px;
+ margin-right: 1rem;
+}
+
+.profile-picture img {
+ width: 100%;
+ height: 100%;
+ border-radius: 50%;
+ object-fit: cover;
+ border: 2px solid #4ade80;
+}
+
+.badge {
+ display: inline-block;
+ margin-right: 0.5rem;
+ padding: 0.2rem 0.5rem;
+ background-color: #15803d;
+ color: #4ade80;
+ border-radius: 4px;
+ font-size: 0.8rem;
+}
+
+.identifier-text {
+ flex-grow: 1;
+ margin-right: 0.5rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.material-icons {
+ font-size: 18px;
+}
+
+.material-icons:hover {
+ font-size: 20px;
+}
------------------------------------------------------------
commit f156c8896b945f05288e4cc38781cb04d6ccb67b
Author: ffff:87.92.17.250 <ffff:87.92.17.250@hub.scroll.pub>
Date: Sat Nov 9 05:02:41 2024 +0000
Updated index.html
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..fc4a329
--- /dev/null
+++ b/index.html
@@ -0,0 +1,86 @@
+<!doctype html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>CFX LOOKUP</title>
+ <link
+ href="https://fonts.googleapis.com/css2?family=Orbitron&display=swap"
+ rel="stylesheet"
+ />
+ <link
+ href="https://fonts.googleapis.com/icon?family=Material+Icons"
+ rel="stylesheet"
+ />
+ <link
+ href="https://fonts.googleapis.com/css2?family=Inter+Tight:wght@400&display=swap"
+ rel="stylesheet"
+ />
+ <link rel="stylesheet" href="styles.css" />
+ </head>
+ <body>
+ <div class="container">
+ <h1>CFX LOOKUP</h1>
+
+ <div class="tabs">
+ <button id="fivemTab" class="tab-button active">FiveM Server</button>
+ <button id="discordTab" class="tab-button">Discord ID</button>
+ </div>
+
+ <div id="fivemContent" class="tab-content">
+ <div class="search-container">
+ <input type="text" id="serverIp" placeholder="Enter server IP" />
+ <button id="fivemSearchButton">Search</button>
+ </div>
+
+ <div id="fivemErrorMessage" class="error-message"></div>
+
+ <div id="serverInfo" class="hidden">
+ <h2 id="serverName"></h2>
+ <div id="playerSearch" class="search-container hidden">
+ <input
+ type="text"
+ id="playerSearchInput"
+ placeholder="Search players"
+ />
+ <select id="searchField">
+ <option value="name">Search by Name</option>
+ <option value="id">Search by ID</option>
+ </select>
+ </div>
+ <div id="playerList" class="player-grid"></div>
+ </div>
+ </div>
+
+ <div id="discordContent" class="tab-content hidden">
+ <div class="search-container">
+ <input type="text" id="discordId" placeholder="Enter Discord ID" />
+ <button id="discordSearchButton">Search</button>
+ </div>
+
+ <div id="discordErrorMessage" class="error-message"></div>
+
+ <div id="userInfo" class="hidden">
+ <div class="profile-card">
+ <div class="profile-header">
+ <div class="profile-picture">
+ <img id="avatar" src="" alt="User Avatar" />
+ </div>
+ <div class="profile-name">
+ <h2 id="username"></h2>
+ <span id="globalName"></span>
+ </div>
+ </div>
+ <div class="profile-details">
+ <p>User ID: <span id="userId"></span></p>
+ <p>Created At: <span id="createdAt"></span></p>
+ <p>Badges: <span id="badges"></span></p>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ <script src="main.js"></script>
+ </body>
+</html>