You've already forked Tricky-Addon-Update-Target-List
mirror of
https://github.com/KOWX712/Tricky-Addon-Update-Target-List.git
synced 2025-09-06 06:37:09 +00:00
opt: simplify ripple effect class
This commit is contained in:
KOWX712
@@ -51,12 +51,12 @@
|
||||
|
||||
<!-- Floating Button Element -->
|
||||
<div class="floating-card">
|
||||
<button class="floating-btn" id="save" data-i18n="functional_button.save_and_update_button"></button>
|
||||
<button class="floating-btn ripple-element" id="save" data-i18n="functional_button.save_and_update_button"></button>
|
||||
</div>
|
||||
|
||||
<!-- Menu Options -->
|
||||
<div class="search-menu-container">
|
||||
<div class="search-card">
|
||||
<div class="search-card ripple-element">
|
||||
<span class="search-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="19px" viewBox="0 -960 960 960" width="24px" fill="#6E6E6E"><path d="M784-120 532-372q-30 24-69 38t-83 14q-109 0-184.5-75.5T120-580q0-109 75.5-184.5T380-840q109 0 184.5 75.5T640-580q0 44-14 83t-38 69l252 252-56 56ZM380-400q75 0 127.5-52.5T560-580q0-75-52.5-127.5T380-760q-75 0-127.5 52.5T200-580q0 75 52.5 127.5T380-400Z" /></svg>
|
||||
</span>
|
||||
@@ -65,24 +65,24 @@
|
||||
</div>
|
||||
<div class="menu">
|
||||
<input type="checkbox" id="menu-toggle" class="menu-toggle">
|
||||
<label for="menu-toggle" class="menu-button" id="menu-button">
|
||||
<label for="menu-toggle" class="menu-button ripple-element" id="menu-button">
|
||||
<i class="menu-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -1060 960 960" width="24px"><path d="M120-240v-80h720v80H120Zm0-200v-80h720v80H120Zm0-200v-80h720v80H120Z"/></svg>
|
||||
</i>
|
||||
</label>
|
||||
<div id="menu-options" class="menu-options">
|
||||
<ul>
|
||||
<li id="refresh" data-i18n="menu.refresh"></li>
|
||||
<li id="select-all" data-i18n="menu.select_all"></li>
|
||||
<li id="deselect-all" data-i18n="menu.deselect_all"></li>
|
||||
<li id="select-denylist" data-i18n="menu.select_denylist"></li>
|
||||
<li id="deselect-unnecessary" data-i18n="menu.deselect_unnecessary"></li>
|
||||
<li id="aospkb" data-i18n="menu.set_aosp_keybox"></li>
|
||||
<li id="validkb" data-i18n="menu.set_valid_keybox"></li>
|
||||
<li id="customkb" data-i18n="menu.set_custom_keybox"></li>
|
||||
<li id="boot-hash" data-i18n="menu.set_verified_boot_hash"></li>
|
||||
<li id="security-patch" data-i18n="menu.set_security_patch"></li>
|
||||
<li id="about" data-i18n="menu.about"></li>
|
||||
<li class="ripple-element" id="refresh" data-i18n="menu.refresh"></li>
|
||||
<li class="ripple-element" id="select-all" data-i18n="menu.select_all"></li>
|
||||
<li class="ripple-element" id="deselect-all" data-i18n="menu.deselect_all"></li>
|
||||
<li class="ripple-element" id="select-denylist" data-i18n="menu.select_denylist"></li>
|
||||
<li class="ripple-element" id="deselect-unnecessary" data-i18n="menu.deselect_unnecessary"></li>
|
||||
<li class="ripple-element" id="aospkb" data-i18n="menu.set_aosp_keybox"></li>
|
||||
<li class="ripple-element" id="validkb" data-i18n="menu.set_valid_keybox"></li>
|
||||
<li class="ripple-element" id="customkb" data-i18n="menu.set_custom_keybox"></li>
|
||||
<li class="ripple-element" id="boot-hash" data-i18n="menu.set_verified_boot_hash"></li>
|
||||
<li class="ripple-element" id="security-patch" data-i18n="menu.set_security_patch"></li>
|
||||
<li class="ripple-element" id="about" data-i18n="menu.about"></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
@@ -91,20 +91,20 @@
|
||||
|
||||
<!-- Applist Display -->
|
||||
<div id="apps-list"></div>
|
||||
<div class="update-card" id="update-card">
|
||||
<div class="update-card ripple-element" id="update-card">
|
||||
<p id="update-available" data-i18n="update.update_available"></p>
|
||||
<p id="redirect-to-release" data-i18n="update.redirect_to_release"></p>
|
||||
</div>
|
||||
<div class="mode-overlay"></div>
|
||||
<template id="app-template">
|
||||
<div class="card-box">
|
||||
<div class="card" id="card">
|
||||
<div class="card ripple-element" id="card">
|
||||
<div class="content" data-package="">
|
||||
<div class="mode">
|
||||
<label class="mode-switch" id="normal">
|
||||
<input type="radio" class="mode-input" id="normal-mode">
|
||||
<i class="mode-icon">
|
||||
<div class="status-indicator" id="normal-indicator">
|
||||
<div class="status-indicator ripple-element" id="normal-indicator">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="30px" viewBox="0 -960 960 960" width="30px" fill="#ffffff"><path d="M480-480Zm0 280q-116 0-198-82t-82-198q0-116 82-198t198-82q116 0 198 82t82 198q0 116-82 198t-198 82Zm0-80q83 0 141.5-58.5T680-480q0-83-58.5-141.5T480-680q-83 0-141.5 58.5T280-480q0 83 58.5 141.5T480-280Z"/></svg>
|
||||
</div>
|
||||
</i>
|
||||
@@ -112,7 +112,7 @@
|
||||
<label class="mode-switch" id="generate">
|
||||
<input type="radio" class="mode-input" id="generate-mode">
|
||||
<i class="mode-icon">
|
||||
<div class="status-indicator" id="generate-indicator">
|
||||
<div class="status-indicator ripple-element" id="generate-indicator">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="18px" viewBox="0 -960 960 960" width="18px" fill="#ffffff"><path d="M480-120q-33 0-56.5-23.5T400-200q0-33 23.5-56.5T480-280q33 0 56.5 23.5T560-200q0 33-23.5 56.5T480-120Zm-80-240v-480h160v480H400Z"/></svg>
|
||||
</div>
|
||||
</i>
|
||||
@@ -120,7 +120,7 @@
|
||||
<label class="mode-switch" id="hack">
|
||||
<input type="radio" class="mode-input" id="hack-mode">
|
||||
<i class="mode-icon">
|
||||
<div class="status-indicator" id="hack-indicator">
|
||||
<div class="status-indicator ripple-element" id="hack-indicator">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="19px" viewBox="0 -960 960 960" width="19px" fill="#ffffff"><path d="M424-320q0-81 14.5-116.5T500-514q41-36 62.5-62.5T584-637q0-41-27.5-68T480-732q-51 0-77.5 31T365-638l-103-44q21-64 77-111t141-47q105 0 161.5 58.5T698-641q0 50-21.5 85.5T609-475q-49 47-59.5 71.5T539-320H424Zm56 240q-33 0-56.5-23.5T400-160q0-33 23.5-56.5T480-240q33 0 56.5 23.5T560-160q0 33-23.5 56.5T480-80Z"/></svg>
|
||||
</div>
|
||||
</i>
|
||||
@@ -219,11 +219,11 @@
|
||||
<div id="boot-hash-overlay" class="boot-hash-overlay"></div>
|
||||
<div id="boot-hash-card" class="boot-hash-card">
|
||||
<div class="boot-hash-title" data-i18n="boot_hash.title"></div>
|
||||
<div class="boot-hash-value">
|
||||
<div class="boot-hash-value ripple-element">
|
||||
<textarea id="boot-hash-input" class="input-box" placeholder="Paste your verified Boot Hash here" data-i18n="boot_hash.input_placeholder"></textarea>
|
||||
</div>
|
||||
<div class="boot-hash-button-container">
|
||||
<button id="boot-hash-save-button" class="boot-hash-save-button" data-i18n="boot_hash.save_button"></button>
|
||||
<button id="boot-hash-save-button" class="boot-hash-save-button ripple-element" data-i18n="boot_hash.save_button"></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -240,11 +240,11 @@
|
||||
<br>
|
||||
<p>
|
||||
<div class="link">
|
||||
<i class="link-icon" id="telegram" aria-hidden="true">
|
||||
<i class="link-icon ripple-element" id="telegram" aria-hidden="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M248 8C111 8 0 119 0 256S111 504 248 504 496 393 496 256 385 8 248 8zM363 176.7c-3.7 39.2-19.9 134.4-28.1 178.3-3.5 18.6-10.3 24.8-16.9 25.4-14.4 1.3-25.3-9.5-39.3-18.7-21.8-14.3-34.2-23.2-55.3-37.2-24.5-16.1-8.6-25 5.3-39.5 3.7-3.8 67.1-61.5 68.3-66.7 .2-.7 .3-3.1-1.2-4.4s-3.6-.8-5.1-.5q-3.3 .7-104.6 69.1-14.8 10.2-26.9 9.9c-8.9-.2-25.9-5-38.6-9.1-15.5-5-27.9-7.7-26.8-16.3q.8-6.7 18.5-13.7 108.4-47.2 144.6-62.3c68.9-28.6 83.2-33.6 92.5-33.8 2.1 0 6.6 .5 9.6 2.9a10.5 10.5 0 0 1 3.5 6.7A43.8 43.8 0 0 1 363 176.7z"/></svg>
|
||||
<span id="link-text" data-i18n="about.telegram_channel"></span>
|
||||
</i>
|
||||
<i class="link-icon" id="github" aria-hidden="true">
|
||||
<i class="link-icon ripple-element" id="github" aria-hidden="true">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="20px" viewBox="0 0 496 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"/></svg>
|
||||
<span id="link-text" data-i18n="about.github"></span>
|
||||
</i>
|
||||
@@ -266,8 +266,8 @@
|
||||
<h1 data-i18n="update.changelog"></h1>
|
||||
<div class="changelog"></div>
|
||||
<div class="update-button-container">
|
||||
<button class="install" data-i18n="update.install"></button>
|
||||
<button class="reboot" data-i18n="update.reboot"></button>
|
||||
<button class="install ripple-element" data-i18n="update.install"></button>
|
||||
<button class="reboot ripple-element" data-i18n="update.reboot"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -327,10 +327,10 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button id="get-patch" class="get-button" data-i18n="security_patch.get_date"></button>
|
||||
<button id="get-patch" class="get-button ripple-element" data-i18n="security_patch.get_date"></button>
|
||||
<div class="button-container">
|
||||
<button id="auto-config" class="auto-button" data-i18n="security_patch.auto"></button>
|
||||
<button id="save-patch" class="save-button" data-i18n="security_patch.save"></button>
|
||||
<button id="auto-config" class="auto-button ripple-element" data-i18n="security_patch.auto"></button>
|
||||
<button id="save-patch" class="save-button ripple-element" data-i18n="security_patch.save"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -338,7 +338,7 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="footer">
|
||||
<div class="uninstall-container hidden-uninstall">
|
||||
<div class="uninstall-container ripple-element hidden-uninstall">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#FFFFFF"><path d="M280-120q-33 0-56.5-23.5T200-200v-520h-40v-80h200v-40h240v40h200v80h-40v520q0 33-23.5 56.5T680-120H280Zm400-600H280v520h400v-520ZM360-280h80v-360h-80v360Zm160 0h80v-360h-80v360ZM280-720v520-520Z" /></svg>
|
||||
<span data-i18n="functional_button.uninstall_webui"></span>
|
||||
</div>
|
||||
|
||||
@@ -128,7 +128,7 @@ async function generateLanguageMenu() {
|
||||
const sortedLanguages = languageData.sort((a, b) => a.name.localeCompare(b.name));
|
||||
sortedLanguages.forEach(({ lang, name }) => {
|
||||
const button = document.createElement('button');
|
||||
button.classList.add('language-option');
|
||||
button.classList.add('language-option', 'ripple-element');
|
||||
button.setAttribute('data-lang', lang);
|
||||
button.textContent = name;
|
||||
languageMenu.appendChild(button);
|
||||
|
||||
@@ -21,7 +21,6 @@ export const basePath = "set-path";
|
||||
export const appsWithExclamation = [];
|
||||
export const appsWithQuestion = [];
|
||||
const ADDITIONAL_APPS = [ "android", "com.android.vending", "com.google.android.gms", "io.github.vvb2060.keyattestation", "io.github.vvb2060.mahoshojo", "icu.nullptr.nativetest" ]; // Always keep default apps in target.txt
|
||||
const rippleClasses = ['.language-option', '.menu-button', '.menu-options li', '.search-card', '.card', '.update-card', '.link-icon', '.floating-btn', '.uninstall-container', '.boot-hash-save-button', '.boot-hash-value', '.reboot', '.install', '.file-item', '.save-button', '.auto-button', '.get-button'];
|
||||
|
||||
// Variables
|
||||
let e = 0;
|
||||
@@ -232,63 +231,59 @@ function hideFloatingBtn() {
|
||||
|
||||
// Function to apply ripple effect
|
||||
export function applyRippleEffect() {
|
||||
rippleClasses.forEach(selector => {
|
||||
document.querySelectorAll(selector).forEach(element => {
|
||||
if (element.dataset.rippleListener !== "true") {
|
||||
element.addEventListener("pointerdown", function (event) {
|
||||
if (isScrolling) return;
|
||||
if (modeActive) return;
|
||||
document.querySelectorAll('.ripple-element').forEach(element => {
|
||||
if (element.dataset.rippleListener !== "true") {
|
||||
element.addEventListener("pointerdown", function (event) {
|
||||
if (isScrolling) return;
|
||||
const ripple = document.createElement("span");
|
||||
ripple.classList.add("ripple");
|
||||
|
||||
const ripple = document.createElement("span");
|
||||
ripple.classList.add("ripple");
|
||||
// Calculate ripple size and position
|
||||
const rect = element.getBoundingClientRect();
|
||||
const width = rect.width;
|
||||
const size = Math.max(rect.width, rect.height);
|
||||
const x = event.clientX - rect.left - size / 2;
|
||||
const y = event.clientY - rect.top - size / 2;
|
||||
|
||||
// Calculate ripple size and position
|
||||
const rect = element.getBoundingClientRect();
|
||||
const width = rect.width;
|
||||
const size = Math.max(rect.width, rect.height);
|
||||
const x = event.clientX - rect.left - size / 2;
|
||||
const y = event.clientY - rect.top - size / 2;
|
||||
// Determine animation duration
|
||||
let duration = 0.2 + (width / 800) * 0.4;
|
||||
duration = Math.min(0.8, Math.max(0.2, duration));
|
||||
|
||||
// Determine animation duration
|
||||
let duration = 0.3 + (width / 800) * 0.3;
|
||||
duration = Math.min(0.8, Math.max(0.2, duration));
|
||||
// Set ripple styles
|
||||
ripple.style.width = ripple.style.height = `${size}px`;
|
||||
ripple.style.left = `${x}px`;
|
||||
ripple.style.top = `${y}px`;
|
||||
ripple.style.animationDuration = `${duration}s`;
|
||||
ripple.style.transition = `opacity ${duration}s ease`;
|
||||
|
||||
// Set ripple styles
|
||||
ripple.style.width = ripple.style.height = `${size}px`;
|
||||
ripple.style.left = `${x}px`;
|
||||
ripple.style.top = `${y}px`;
|
||||
ripple.style.animationDuration = `${duration}s`;
|
||||
ripple.style.transition = `opacity ${duration}s ease`;
|
||||
// Adaptive color
|
||||
const computedStyle = window.getComputedStyle(element);
|
||||
const bgColor = computedStyle.backgroundColor || "rgba(0, 0, 0, 0)";
|
||||
const textColor = computedStyle.color;
|
||||
const isDarkColor = (color) => {
|
||||
const rgb = color.match(/\d+/g);
|
||||
if (!rgb) return false;
|
||||
const [r, g, b] = rgb.map(Number);
|
||||
return (r * 0.299 + g * 0.587 + b * 0.114) < 96; // Luma formula
|
||||
};
|
||||
ripple.style.backgroundColor = isDarkColor(bgColor) ? "rgba(255, 255, 255, 0.2)" : "";
|
||||
|
||||
// Adaptive color
|
||||
const computedStyle = window.getComputedStyle(element);
|
||||
const bgColor = computedStyle.backgroundColor || "rgba(0, 0, 0, 0)";
|
||||
const textColor = computedStyle.color;
|
||||
const isDarkColor = (color) => {
|
||||
const rgb = color.match(/\d+/g);
|
||||
if (!rgb) return false;
|
||||
const [r, g, b] = rgb.map(Number);
|
||||
return (r * 0.299 + g * 0.587 + b * 0.114) < 96; // Luma formula
|
||||
};
|
||||
ripple.style.backgroundColor = isDarkColor(bgColor) ? "rgba(255, 255, 255, 0.2)" : "";
|
||||
|
||||
// Append ripple and handle cleanup
|
||||
element.appendChild(ripple);
|
||||
const handlePointerUp = () => {
|
||||
ripple.classList.add("end");
|
||||
setTimeout(() => {
|
||||
ripple.classList.remove("end");
|
||||
ripple.remove();
|
||||
}, duration * 1000);
|
||||
element.removeEventListener("pointerup", handlePointerUp);
|
||||
element.removeEventListener("pointercancel", handlePointerUp);
|
||||
};
|
||||
element.addEventListener("pointerup", handlePointerUp);
|
||||
element.addEventListener("pointercancel", handlePointerUp);
|
||||
});
|
||||
element.dataset.rippleListener = "true";
|
||||
}
|
||||
});
|
||||
// Append ripple and handle cleanup
|
||||
element.appendChild(ripple);
|
||||
const handlePointerUp = () => {
|
||||
ripple.classList.add("end");
|
||||
setTimeout(() => {
|
||||
ripple.classList.remove("end");
|
||||
ripple.remove();
|
||||
}, duration * 1000);
|
||||
element.removeEventListener("pointerup", handlePointerUp);
|
||||
element.removeEventListener("pointercancel", handlePointerUp);
|
||||
};
|
||||
element.addEventListener("pointerup", handlePointerUp);
|
||||
element.addEventListener("pointercancel", handlePointerUp);
|
||||
});
|
||||
element.dataset.rippleListener = "true";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -91,8 +91,6 @@
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 5px;
|
||||
transition: background-color 0.2s ease;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.link-icon svg {
|
||||
|
||||
@@ -23,8 +23,6 @@
|
||||
padding: 12px;
|
||||
width: calc(100% - 30px);
|
||||
max-width: 900px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#update-available {
|
||||
@@ -156,8 +154,6 @@
|
||||
width: calc(100% - 30px);
|
||||
max-width: 900px;
|
||||
transition: background-color 0.2s ease;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.content {
|
||||
@@ -225,8 +221,6 @@
|
||||
box-sizing: border-box;
|
||||
transition: all 0.2s ease;
|
||||
border: 3px solid transparent;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#normal-indicator {
|
||||
|
||||
@@ -57,8 +57,6 @@
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 10px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
|
||||
@@ -33,7 +33,6 @@ body {
|
||||
font-weight: bold;
|
||||
transition: transform 0.4s ease;
|
||||
border-radius: 50px 50px;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@@ -236,6 +235,11 @@ body {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.ripple-element {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ripple {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
|
||||
@@ -93,7 +93,6 @@
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
|
||||
@@ -24,7 +24,6 @@
|
||||
height: calc(100% - 2px);
|
||||
width: calc(100% - 60px);
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.search-icon {
|
||||
@@ -78,8 +77,6 @@
|
||||
justify-content: center;
|
||||
z-index: 200;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.menu-icon {
|
||||
@@ -135,8 +132,6 @@
|
||||
padding: 12px 15px;
|
||||
text-align: left;
|
||||
background-color: white;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.menu-options li::after {
|
||||
|
||||
@@ -137,8 +137,6 @@
|
||||
border-radius: 12px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: background-color 0.2s ease;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user