fix(qb-core): add global CreateUsableItem alias for qs-inventory compatibility

qs-inventory apelează CreateUsableItem ca funcție globală, dar qb-core definea doar QBCore.Functions.CreateUseableItem (cu 'e'). Adăugat alias global + fix 16 stringuri sparte în items.lua care blocau parsarea.
This commit is contained in:
2026-04-02 00:08:19 +03:00
parent 096ccb6399
commit 978c9bc759
827 changed files with 3570 additions and 1015 deletions

View File

@@ -0,0 +1,601 @@
@import "https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;500;600;700;800;900&display=swap";
@import "https://fonts.googleapis.com/css2?family=Rajdhani:wght@500&display=swap";
:root {
--d: 5000ms;
--angle: 90deg;
--gradX: 100%;
--gradY: 50%;
--c1: rgba(0, 163, 255, 1);
--c2: transparent;
--primary-color: #00a3ff;
--secondary-gradient: linear-gradient(180deg, #34445200 0%, #2d2d2d 100%);
--border-color: #0190e1;
--panel-bg: radial-gradient(
120.05% 120.05% at 50.14% -58.24%,
rgba(69, 100, 129, 0) 0%,
#0e151b 100%
);
}
*,
*::before,
*::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html,
body {
font-family: "Poppins", sans-serif;
background: transparent;
color: #fff;
}
.admin-giveitem-container {
position: fixed;
inset: 0;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
}
.admin-giveitem-modal {
position: relative;
width: 90%;
max-width: 1400px;
max-height: 100vh;
background: var(--panel-bg);
border-radius: 20px;
border: 1px solid rgba(1, 144, 225, 0.35);
box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
overflow: hidden;
transform: scale(0.9) translateY(50px);
opacity: 0;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
animation: modalSlideIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}
.admin-giveitem-modal.open {
transform: scale(1) translateY(0);
opacity: 1;
}
.admin-giveitem-header {
background: linear-gradient(135deg, var(--primary-color) 0%, #0e151b 100%);
padding: 20px 30px;
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 2px solid rgba(255, 255, 255, 0.08);
}
.admin-giveitem-title {
display: flex;
align-items: center;
gap: 15px;
color: #fff;
}
.admin-giveitem-title i {
font-size: 24px;
}
.admin-giveitem-title h2 {
margin: 0;
font-size: 24px;
font-weight: 700;
text-shadow: 0 0 5px rgba(255, 255, 255, 0.35);
letter-spacing: 0.3px;
}
.admin-giveitem-close {
background: rgba(255, 255, 255, 0.08);
border: 1px solid rgba(255, 255, 255, 0.18);
color: #fff;
width: 40px;
height: 40px;
border-radius: 10px;
cursor: pointer;
display: grid;
place-items: center;
transition: all 0.2s ease;
}
.admin-giveitem-close:hover {
background: var(--primary-color);
border-color: var(--primary-color);
box-shadow: 0 0 20px rgba(0, 163, 255, 0.35);
transform: translateY(-1px);
}
.admin-giveitem-content {
padding: 30px;
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
gap: 30px;
max-height: calc(130vh - 100px);
overflow-y: auto;
}
.admin-giveitem-section {
background: radial-gradient(
49.48% 49.48% at 50.52% 50.52%,
#28343c 0%,
rgba(14, 21, 27, 0.8) 100%
);
border-radius: 15px;
padding: 20px;
border: 1px solid rgba(255, 255, 255, 0.12);
backdrop-filter: blur(10px);
}
.admin-giveitem-section:last-child {
grid-column: 1 / -1;
}
.section-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 2px solid rgba(255, 255, 255, 0.08);
}
.section-header h3 {
color: #fff;
margin: 0;
font-size: 18px;
font-weight: 700;
display: flex;
align-items: center;
gap: 10px;
text-shadow: 0 0 5px rgba(255, 255, 255, 0.3);
}
.search-container {
position: relative;
width: 300px;
}
.search-container input {
width: 100%;
padding: 12px 40px 12px 15px;
background: rgba(255, 255, 255, 0.06);
border: 2px solid rgba(255, 255, 255, 0.18);
border-radius: 12px;
color: #fff;
font-size: 14px;
transition: all 0.2s ease;
}
.search-container input::placeholder {
color: rgba(255, 255, 255, 0.6);
}
.search-container input:focus {
outline: none;
border-color: var(--primary-color);
box-shadow: 0 0 20px rgba(0, 163, 255, 0.25);
}
.search-container i {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
color: rgba(255, 255, 255, 0.6);
}
.player-list-container,
.item-list-container {
max-height: 280px;
overflow-y: auto;
border-radius: 10px;
}
.player-list,
.item-list {
padding: 10px;
display: flex;
flex-direction: column;
}
.player-card,
.item-card {
background: rgba(255, 255, 255, 0.06);
border: 1px solid rgba(255, 255, 255, 0.12);
border-radius: 12px;
padding: 15px;
margin-bottom: 10px;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
align-items: center;
gap: 15px;
animation: fadeIn 0.3s ease forwards;
}
.player-card:hover,
.item-card:hover {
background: rgba(255, 255, 255, 0.1);
border-color: var(--primary-color);
transform: translateY(-2px);
box-shadow: 0 0 20px rgba(0, 163, 255, 0.25);
}
.player-avatar,
.item-image {
width: 50px;
height: 50px;
border-radius: 10px;
background: radial-gradient(
49.48% 49.48% at 50.52% 50.52%,
#28343c 0%,
rgba(14, 21, 27, 0.8) 100%
);
display: grid;
place-items: center;
color: #fff;
font-size: 20px;
flex-shrink: 0;
border: 1px solid rgba(255, 255, 255, 0.12);
overflow: hidden;
}
.item-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.player-info,
.item-info {
flex: 1;
color: #fff;
}
.player-info h4,
.item-info h4 {
margin: 0 0 5px 0;
font-size: 16px;
font-weight: 700;
}
.player-info p,
.item-info p {
margin: 2px 0;
font-size: 12px;
color: rgba(255, 255, 255, 0.7);
}
.select-player-btn,
.select-item-btn {
background: var(--primary-color);
border: none;
color: #fff;
width: 35px;
height: 35px;
border-radius: 10px;
cursor: pointer;
display: grid;
place-items: center;
transition: all 0.2s ease;
opacity: 0;
box-shadow: 0 0 14px rgba(0, 163, 255, 0.3);
}
.player-card:hover .select-player-btn,
.item-card:hover .select-item-btn {
opacity: 1;
}
.select-player-btn:hover,
.select-item-btn:hover {
transform: scale(1.05);
}
.selected-player-info,
.selected-item-info {
position: absolute;
left: 25px;
right: 25px;
bottom: 25px;
height: 84px;
opacity: 0;
transform: translateY(8px);
transition: opacity 0.18s ease, transform 0.18s ease;
pointer-events: none;
}
.selected-item-info {
height: 120px;
}
.selected-player-info.is-visible,
.selected-item-info.is-visible {
opacity: 1;
transform: translateY(0);
pointer-events: auto;
}
.selected-item-card {
height: 130px !important;
}
.player-details p,
.item-details p {
font-size: 1.2vh;
}
.selected-player-card,
.selected-item-card {
height: 94px;
background: radial-gradient(
49.48% 49.48% at 50.52% 50.52%,
rgba(0, 163, 255, 0.15) 0%,
rgba(14, 21, 27, 1) 100%
);
border: 2px solid var(--primary-color);
border-radius: 12px;
padding: 15px;
display: grid;
grid-template-columns: 50px 1fr 25px;
align-items: center;
gap: 15px;
position: relative;
box-shadow: 0 0 18px rgba(0, 163, 255, 0.35);
overflow: hidden;
color: white;
}
.clear-selection {
position: absolute;
top: 10px;
right: 10px;
background: rgba(0, 163, 255, 0.18);
border: none;
color: #fff;
width: 25px;
height: 25px;
border-radius: 8px;
cursor: pointer;
display: grid;
place-items: center;
transition: all 0.2s ease;
}
.clear-selection:hover {
background: rgba(0, 163, 255, 0.28);
transform: scale(1.05);
}
.give-item-form {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}
.form-group {
display: flex;
flex-direction: column;
gap: 8px;
}
.form-group label {
color: #fff;
font-weight: 700;
font-size: 14px;
}
.form-group input,
.form-group textarea {
padding: 12px 15px;
background: rgba(255, 255, 255, 0.06);
border: 2px solid rgba(255, 255, 255, 0.18);
border-radius: 10px;
color: #fff;
font-size: 14px;
font-weight: 400;
transition: all 0.2s ease;
}
.form-group input::placeholder,
.form-group textarea::placeholder {
color: rgba(255, 255, 255, 0.6);
}
.form-group input:focus,
.form-group textarea:focus {
outline: none;
border-color: var(--primary-color);
box-shadow: 0 0 16px rgba(0, 163, 255, 0.25);
}
.form-group textarea {
resize: vertical;
min-height: 80px;
font-family: "Poppins", sans-serif;
}
.give-item-summary {
grid-column: 1 / -1;
background: rgba(0, 163, 255, 0.08);
border: 1px solid var(--primary-color);
border-radius: 10px;
padding: 15px;
margin-top: 10px;
}
.give-item-summary h4 {
color: var(--primary-color);
margin: 0 0 10px 0;
font-size: 16px;
color: white;
}
.give-item-summary p {
color: #fff;
margin: 0;
font-size: 14px;
line-height: 1.5;
overflow: hidden;
text-overflow: ellipsis;
}
.form-actions {
grid-column: 1 / -1;
display: flex;
gap: 15px;
justify-content: flex-end;
margin-top: 20px;
}
.button-admin-secondary,
.button-admin-primary {
padding: 12px 25px;
border: 2px solid rgba(0, 163, 255, 0.18); /* Borde sutil */
border-radius: 10px;
cursor: pointer;
font-size: 14px;
font-weight: 800;
display: inline-flex;
align-items: center;
gap: 8px;
transition: all 0.2s ease;
text-transform: uppercase;
letter-spacing: 0.5px;
background: rgba(0, 163, 255, 0.18);
color: white;
}
.button-admin-primary:hover,
.button-admin-secondary:hover {
background: rgba(0, 163, 255, 0.28);
border-color: rgba(
0,
163,
255,
0.5
); /* Borde más pronunciado al hacer hover */
transform: scale(1.05);
box-shadow: 0 0 8px rgba(0, 163, 255, 0.5); /* Sombra al pasar el mouse */
}
.loading-spinner,
.no-results {
display: grid;
place-items: center;
padding: 40px;
color: rgba(255, 255, 255, 0.6);
gap: 15px;
}
.loading-spinner i,
.no-results i {
font-size: 24px;
}
.unique-badge {
background: linear-gradient(135deg, #1d67bb, #0fbeca);
color: #000;
padding: 2px 8px;
border-radius: 12px;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
margin-top: 5px;
display: inline-block;
}
.player-list-container::-webkit-scrollbar,
.item-list-container::-webkit-scrollbar {
width: 0.3vh;
}
.player-list-container::-webkit-scrollbar-track,
.item-list-container::-webkit-scrollbar-track {
background: linear-gradient(
270deg,
rgba(69, 100, 129, 0) -26.87%,
#0e151b 100%
);
border-radius: 0.2vh;
}
.player-list-container::-webkit-scrollbar-thumb,
.item-list-container::-webkit-scrollbar-thumb {
background: var(--primary-color);
box-shadow: 0 0.1vh 20px var(--primary-color);
border-radius: 1.2vh;
}
@media (max-width: 1200px) {
.admin-giveitem-content {
grid-template-columns: 1fr;
}
.admin-giveitem-section:last-child {
grid-column: 1;
}
.give-item-form {
grid-template-columns: 1fr;
}
}
@media (max-width: 768px) {
.admin-giveitem-modal {
width: 95%;
margin: 20px;
}
.admin-giveitem-content {
padding: 20px;
gap: 20px;
}
.admin-giveitem-header {
padding: 15px 20px;
}
.admin-giveitem-title h2 {
font-size: 20px;
}
.search-container {
width: 200px;
}
.form-actions {
flex-direction: column;
}
}
.hidden {
display: none !important;
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes modalSlideIn {
from {
opacity: 0;
transform: scale(0.8) translateY(-50px);
}
to {
opacity: 1;
transform: scale(1) translateY(0);
}
}
.summary {
max-height: 50vh;
}

View File

@@ -0,0 +1,204 @@
:root {
font-size: min(.83333333vw, 1.8009478673vh) !important;
}
.compact {
width: 100% !important;
max-width: 100% !important;
}
.compact #inventory-container:before {
background-color: transparent;
}
.compact .inv-container {
display: flex !important;
flex-direction: column;
align-items: end;
justify-content: space-between;
top: 0;
height: 100%;
width: 50% !important;
padding-right: .25rem;
}
.compact .inventory-playerstats {
position: relative;
top: 1rem;
right: 1rem;
display: none;
}
.compact .inventory-playerdata {
position: absolute;
top: 57vh;
right: 1.2vh;
display: none;
}
.compact .ply-inv-container {
height: 50%;
}
.compact .player-inventory {
height: 90%;
}
.compact .oth-inv-container {
height: 40%; padding-right: 0 !important;
}
.compact .other-inventory {
position: relative;
height: 20rem;
}
.compact .inv-options {
position: relative !important;
display: flex;
max-height: 5rem !important;
margin-top: 2vh !important;
min-width: unset !important;
width: 564px;
padding-right: 13px;
align-items: center; justify-content: center;
}
@media (min-width: 2501px) {
.compact .inv-options {
width: 850px !important;
}
}
/* .compact .inv-options-list {
width: 100%;
box-sizing: border-box;
height: unset !important;
margin-top: 0 !important;
} */
.compact .inv-options .inv-options-list {
display: flex !important;
justify-content: center; align-items: center;
gap: .25rem;
width: 100% !important;
height: 100% !important;
margin-top: 0 !important;
margin-bottom: 0 !important;
}
.compact .inv-option-item {
position: relative;
min-height: 3.25rem !important;
max-width: 100% !important;
width: 100% !important;
font-size: 1.35vh !important;
margin-top: 0 !important;
}
.compact #clothmenu {
position: relative;
min-height: 3.25rem !important;
max-width: 100% !important;
width: 100% !important;
font-size: 1.735vh !important;
}
.inv-option-item > p {
font-size: 1.35vh !important;
}
/* .compact #inventory-custom {
bottom: 5vh;
height: 4vh;
} */
.compact .custom-inventory {
margin-top: 2.5vh;
height: 36vh;
margin-left: 1.7vh;
padding-right: .6vh;
}
.compact #weapon-attachments {
padding: 1vh;
}
.compact .iconBigger {
position: relative;
}
.iconBigger > i {
font-size: 1.35vh !important;
}
.compact .clothes-inventory {
position: relative;
right: 95vh;
top: -50vh !important;
}
.compact .returnButton {
width: 1vh !important;
}
.compact .logo-container {
top: 3vh;
left: 8vh !important;
}
.compact .sixth-slot {
left: 5vh;
}
.compact .ply-iteminfo-container {
position: absolute;
z-index: 9999;
font-family: "CabinetGrotesk-Bold";
display: flex;
align-items: center;
justify-content: baseline;
left: 0;
top: 0;
width: 15vw;
min-height: 16vh;
display: none;
min-width: auto;
margin: auto;
padding: 1.5vh;
border-radius: 0.5vh;
border: 0.1vh solid rgba(15, 130, 230, 0);
background: radial-gradient(
120.05% 120.05% at 50.14% -58.24%,
rgba(69, 100, 129, 0) 0%,
#0e151b 100%
)
padding-box,
linear-gradient(
180deg,
rgba(52, 68, 82, 0) 30%,
var(--primary-color) 70%
)
border-box;
border-image-source: linear-gradient(
180deg,
rgba(52, 68, 82, 0) 0%,
#ffffff 100%
);
}
.compact #weapon-attachments p {
font-size: 0.8vh !important;
}
.compact #player-inv-label {
font-size: 2rem !important;
line-height: 4rem;
max-width: 22.5rem !important;
}
.compact .player-inv-info {
padding-left: 1rem !important;
}

View File

@@ -0,0 +1,259 @@
/* ============================================================================================ */
/* ==================================== DEFAULT THEME ========================================= */
/* ============================================================================================ */
.context-menu-default {
position: absolute;
width: 170px;
padding: .7rem 0;
color: white;
margin: 0;
border-radius: 5px;
background-color: #191e25;
z-index: 100;
outline: none;
opacity: 0;
-webkit-transform: translate(0, 15px) scale(0.95);
transform: translate(0, 15px) scale(0.95);
-webkit-transition: opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
transition: opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
transition: transform 0.1s ease-out, opacity 0.1s ease-out;
transition: transform 0.1s ease-out, opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
pointer-events: none;
}
.context-menu-default-item {
display: block;
position: relative;
margin: 0;
color: white;
padding: 0;
white-space: nowrap;
}
.context-menu-default-btn:focus{
border: 0;
outline: none;
}
.context-menu-default-icon{
color: white;
}
.context-menu-default-btn {
background: none;
line-height: normal;
overflow: visible;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
display: block;
outline: none;
width: 100%;
color: white;
font-family: 'Roboto', sans-serif;
font-size: 13px;
text-align: left;
cursor: pointer;
border: 1px solid transparent;
white-space: nowrap;
padding: 8px 16px;
}
.context-menu-default-btn::-moz-focus-inner,
.context-menu-default-btn::-moz-focus-inner {
border: 0;
outline: none;
}
.context-menu-default-icon {
font-size: 16px;
}
.context-menu-default-text {
font-size: 14px;
color: white;
margin-left: 15px;
}
.context-menu-default-item:hover > .context-menu-default-btn {
outline: none;
}
.context-menu-default-item.disabled {
opacity: 0.5;
pointer-events: none;
}
.context-menu-default-item.disabled .context-menu-default-btn {
cursor: default;
}
.context-menu-default-separator {
display: block;
margin: 7px 5px;
height: 1px;
border-bottom: 1px solid #fff;
background-color: rgb(255, 255, 255);
}
.context-menu-default-item.subcontext-menu-default::after {
content: '';
position: absolute;
right: 6px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border: 5px solid transparent;
border-left-color: #808080;
}
.context-menu-default-item.subcontext-menu-default:hover::after {
border-left-color: #fff;
}
.context-menu-default .context-menu-default {
top: 4px;
left: 99%;
}
.show-context-menu-default,
.context-menu-default-item:hover > .context-menu-default {
opacity: 1;
-webkit-transform: translate(0, 0) scale(1);
transform: translate(0, 0) scale(1);
pointer-events: auto;
}
.context-menu-default-item:hover > .context-menu-default {
-webkit-transition-delay: 100ms;
transition-delay: 300ms;
}
/* ============================================================================================ */
/* ======================================= BLUE THEME ========================================= */
/* ============================================================================================ */
.context-menu-blue {
position: absolute;
width: 250px;
padding: 0;
margin: 0;
background: #23AFF7;
background: linear-gradient(to bottom, #23AFF7 0%, #007BFF 100px, #007BFF 100%);
z-index: 100;
border-radius: 2px;
-webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
opacity: 0;
-webkit-transform: translate(0, 15px) scale(0.95);
transform: translate(0, 15px) scale(0.95);
-webkit-transition: opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
transition: opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
transition: transform 0.1s ease-out, opacity 0.1s ease-out;
transition: transform 0.1s ease-out, opacity 0.1s ease-out, -webkit-transform 0.1s ease-out;
pointer-events: none;
}
.context-menu-blue-item {
display: block;
position: relative;
margin: 0;
padding: 0;
white-space: nowrap;
}
.context-menu-blue-btn {
background: none;
line-height: normal;
overflow: visible;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
display: block;
width: 100%;
font-family: 'Roboto', sans-serif;
text-align: left;
cursor: pointer;
border: 1px solid transparent;
white-space: nowrap;
padding: 1rem 2rem;
}
.context-menu-blue-btn::-moz-focus-inner,
.context-menu-blue-btn::-moz-focus-inner {
border: 0;
padding: 0;
}
.context-menu-blue-icon {
color: white;
font-size: 1.1rem;
}
.context-menu-blue-text {
color: white;
font-family: 'Barlow', sans-serif;
font-size: 1rem;
margin-left: 20px;
}
.context-menu-blue-item:hover > .context-menu-blue-btn {
color: #23AFF7;
outline: none;
background-color: #73D0FF;
background: -webkit-gradient(linear, left top, left bottom, from(#73D0FF), to(#73D0FF));
background: linear-gradient(to bottom, #73D0FF, #73D0FF);
}
.context-menu-blue-item.disabled {
opacity: 0.5;
pointer-events: none;
}
.context-menu-blue-item.disabled .context-menu-blue-btn {
cursor: blue;
}
.context-menu-blue-separator {
display: block;
margin: 7px 5px;
height: 1px;
border-bottom: 1px solid #23AFF7;
background-color: #aaa;
}
.context-menu-blue-item.subcontext-menu-blue::after {
content: '';
position: absolute;
right: 6px;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
border: 5px solid transparent;
border-left-color: #808080;
}
.context-menu-blue-item.subcontext-menu-blue:hover::after {
border-left-color: #23AFF7;
}
.context-menu-blue .context-menu-blue {
top: 4px;
left: 99%;
}
.show-context-menu-blue,
.context-menu-blue-item:hover > .context-menu-blue {
opacity: 1;
-webkit-transform: translate(0, 0) scale(1);
transform: translate(0, 0) scale(1);
pointer-events: auto;
}
.context-menu-blue-item:hover > .context-menu-blue {
-webkit-transition-delay: 100ms;
transition-delay: 300ms;
}

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,263 @@
@import url("https://fonts.googleapis.com/css2?family=Alegreya+Sans:wght@100;300;400&display=swap");
* {
font-weight: 900;
font-family: 'CabinetGrotesk-Bold';
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.trade-container {
position: absolute;
left: 50%;
top: 50%;
z-index: 99999999;
margin: 20px auto;
width: 1340px;
display: flex;
justify-content: center;
transform: translate(-50%,-50%);
}
.buttons-group {
display: flex;
justify-content: center;
}
.buttons {
margin: 0 0;
width: 100%;
text-align: center;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
color: white;
}
.gray-text {
color: white;
font-size: 14px;
background-color: rgba(255,255,255,0.125);
width: 100%;
padding: 5px;
background: radial-gradient(120.05% 120.05% at 50.14% -58.24%, rgba(18,121,211,0.2) 0%, rgb(14,21,27) 100%) padding-box padding-box, linear-gradient(rgba(18,121,211,0.2) 30%, rgba(0,163,255,0.6) 70%) border-box border-box;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.btn {
padding: 5px 120px;
border-radius: 5px;
margin: 10px 5px;
transition: opacity 0.1s linear;
border-width: 1px;
border-style: solid;
border-color: rgba(18,121,211,0.2);
border-image-source: linear-gradient(rgb(14,21,27) 0%, rgb(255,255,255) 100%);
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
background: radial-gradient(120.05% 120.05% at 50.14% -58.24%, rgba(18,121,211,0.2) 0%, rgb(14,21,27) 100%) padding-box padding-box, linear-gradient(rgba(18,121,211,0.2) 30%, rgba(0,163,255,0.6) 70%) border-box border-box;
}
.btn:hover {
opacity: 0.8;
}
.btn-red {
background-color: #191e25;
}
.btn-green {
background-color: #191e25;
}
.btn i {
color: #6c757d;
}
.wrapper {
width: 51vh;
display: flex;
align-items: center;
background: radial-gradient(120.05% 120.05% at 50.14% -58.24%, rgba(18,121,211,0.2) 0%, rgb(14,21,27) 100%) padding-box padding-box, linear-gradient(rgba(18,121,211,0.2) 30%, rgba(0,163,255,0.6) 70%) border-box border-box;
border-width: 1px;
border-style: solid;
border-color: rgba(18,121,211,0.2);
border-image-source: linear-gradient(rgb(14,21,27) 0%, rgb(255,255,255) 100%);
border-radius: 8px;
color: #fff;
flex-direction: column;
overflow: hidden
}
.border {
width: 100%;
height: 2px;
margin: 10px 0;
border-bottom: 2px solid #222;
}
.offer-container {
width: 100%;
min-height: 430px;
max-height: 43px;
}
.offer-container.receiver {
border-bottom-right-radius: 5px;
border-bottom-left-radius: 5px;
}
.items {
min-height: 127px;
text-transform: capitalize;
max-height: 127px;
overflow: auto;
display: flex;
width: 100%;
padding: 0 10px;
margin: 0 auto;
justify-content: flex-start;
flex-wrap: wrap;
}
.items-header {
font-size: 18px;
color: #6c757d;
margin: 10px 20px;
}
.trade-item-slot {
position: relative;
height: 10.2vh;
margin: 5px;
width: 8.3vh;
transition: 0.1s opacity linear;
border-width: 1px;
border-style: solid;
border-color: rgba(18,121,211,0.2);
border-image-source: linear-gradient(rgb(14,21,27) 0%, rgb(255,255,255) 100%);
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
background: radial-gradient(120.05% 120.05% at 50.14% -58.24%, rgba(18,121,211,0.2) 0%, rgb(14,21,27) 100%) padding-box padding-box, linear-gradient(rgba(18,121,211,0.2) 30%, rgba(0,163,255,0.6) 70%) border-box border-box;
border-radius: 5px;
}
.item-slot:hover {
opacity: 0.7;
}
.item-infos {
color: white;
position: absolute;
display: flex;
width: 100%;
bottom: 0;
padding: 3px;
font-size: 14px;
justify-content: space-between;
}
.item-img {
position: absolute;
top: 45%;
left: 50%;
transform: translate(-50%,-50%);
width: 4.5vh;
}
.item-img img {
width: 100%;
height: auto;
}
.offer-items {
min-height: 127px;
max-height: 127px;
overflow: auto;
display: flex;
width: 100%;
padding: 0 10px;
margin: 0 auto;
justify-content: flex-start;
flex-wrap: wrap;
}
.header-wrapper {
padding: 10px;
margin-bottom: 10px;
color: white;
display: flex;
justify-content: space-evenly;
}
.header-wrapper h2 {
position: relative;
top: .1vh;
}
.header-wrapper input {
width: 13%;
text-align: right;
padding: 10px;
}
.item-trade-cut {
width: 38vh;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.amount {
background-color: #191e25;
outline: none;
border: none;
padding-left: 10px;
border-radius: 4px;
height: 4vh;
color: white;
border-width: 1px;
border-style: solid;
border-color: rgba(18,121,211,0.2);
border-image-source: linear-gradient(rgb(14,21,27) 0%, rgb(255,255,255) 100%);
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
background: radial-gradient(120.05% 120.05% at 50.14% -58.24%, rgba(18,121,211,0.2) 0%, rgb(14,21,27) 100%) padding-box padding-box, linear-gradient(rgba(18,121,211,0.2) 30%, rgba(0,163,255,0.6) 70%) border-box border-box;
}
.items, .offer-items {
width: 49vh;
}
.item-amount {
padding-right: 5px;
padding-top: 2px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: right;
font-size: 11px;
}
.item-label {
width: 100%;
text-align: center;
font-size: 11.8764px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
font-family: 'CabinetGrotesk-Extrabold';
text-transform: uppercase;
}