Add Teleport/Effects options to player list

This commit is contained in:
MCHost
2025-06-23 19:15:00 -04:00
parent 53678a76ae
commit f1964e9ef1
4 changed files with 379 additions and 32 deletions

View File

@ -21,6 +21,10 @@
--color-yellow-700: oklch(55.4% 0.135 66.442);
--color-green-600: oklch(62.7% 0.194 149.214);
--color-green-700: oklch(52.7% 0.154 150.069);
--color-teal-600: oklch(60% 0.118 184.704);
--color-teal-700: oklch(51.1% 0.096 186.391);
--color-cyan-600: oklch(60.9% 0.126 221.723);
--color-cyan-700: oklch(52% 0.105 223.128);
--color-blue-400: oklch(70.7% 0.165 254.624);
--color-blue-500: oklch(62.3% 0.214 259.815);
--color-blue-600: oklch(54.6% 0.245 262.881);
@ -401,6 +405,9 @@
.bg-blue-600 {
background-color: var(--color-blue-600);
}
.bg-cyan-600 {
background-color: var(--color-cyan-600);
}
.bg-gray-600 {
background-color: var(--color-gray-600);
}
@ -422,6 +429,9 @@
.bg-red-600 {
background-color: var(--color-red-600);
}
.bg-teal-600 {
background-color: var(--color-teal-600);
}
.bg-yellow-600 {
background-color: var(--color-yellow-600);
}
@ -511,6 +521,9 @@
.text-white {
color: var(--color-white);
}
.opacity-50 {
opacity: 50%;
}
.shadow-lg {
--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@ -522,6 +535,13 @@
}
}
}
.hover\:bg-cyan-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-cyan-700);
}
}
}
.hover\:bg-gray-700 {
&:hover {
@media (hover: hover) {
@ -550,6 +570,13 @@
}
}
}
.hover\:bg-teal-700 {
&:hover {
@media (hover: hover) {
background-color: var(--color-teal-700);
}
}
}
.hover\:bg-yellow-700 {
&:hover {
@media (hover: hover) {
@ -699,6 +726,7 @@
min-width: 80px;
text-align: center;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
font-family: 'Minecraft', sans-serif;
}
.control-btn:hover:not(.disabled-btn) {
transform: translateY(-1px);
@ -706,6 +734,108 @@
.control-btn:active:not(.disabled-btn) {
transform: translateY(0);
}
.tell-player {
border-radius: 0.25rem;
background-color: var(--color-blue-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-blue-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.give-player {
border-radius: 0.25rem;
background-color: var(--color-green-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-green-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.op-player, .deop-player {
border-radius: 0.25rem;
background-color: var(--color-purple-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-purple-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.kick-player, .ban-player {
border-radius: 0.25rem;
background-color: var(--color-red-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-red-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.teleport-player {
border-radius: 0.25rem;
background-color: var(--color-cyan-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-cyan-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.teleport-player:hover:not(.disabled-btn) {
transform: translateY(-1px);
}
.teleport-player:active:not(.disabled-btn) {
transform: translateY(0);
}
.effect-player {
border-radius: 0.25rem;
background-color: var(--color-teal-600);
padding-inline: calc(var(--spacing) * 2);
padding-block: calc(var(--spacing) * 1);
font-size: var(--text-sm);
line-height: var(--tw-leading, var(--text-sm--line-height));
&:hover {
@media (hover: hover) {
background-color: var(--color-teal-700);
}
}
font-family: 'Minecraft', sans-serif;
transition: all 0.2s ease;
}
.effect-player:hover:not(.disabled-btn) {
transform: translateY(-1px);
}
.effect-player:active:not(.disabled-btn) {
transform: translateY(0);
}
.modal {
position: fixed;
inset: 0;
@ -779,6 +909,11 @@
width: 100%;
margin-top: 0.5rem;
}
.tell-player, .give-player, .teleport-player, .effect-player, .op-player, .deop-player, .kick-player, .ban-player {
width: 100%;
text-align: center;
margin-top: 0.25rem;
}
}
.bg-gray-800.p-6.rounded-lg.shadow-lg .grid {
overflow-x: hidden;