diff --git a/Modules/Helpdesk/Resources/assets/css/app.css b/Modules/Helpdesk/Resources/assets/css/app.css index 11ef032b..19acacaf 100644 --- a/Modules/Helpdesk/Resources/assets/css/app.css +++ b/Modules/Helpdesk/Resources/assets/css/app.css @@ -640,3 +640,200 @@ span.flatpickr-weekday { .flatpickr-day.nextMonthDay { color: rgb(113 113 122); } +.hd-helpdesk-surface .hd-btn, +.hd-btn { + display: inline-flex; + align-items: center; + justify-content: center; + gap: .5rem; + border-radius: .85rem; + padding: .62rem 1.05rem; + font-size: .875rem; + line-height: 1.25rem; + font-weight: 800; + font-size: .95rem; + color: #ffffff !important; + text-decoration: none !important; + border: 1px solid rgba(255,255,255,.14); + box-shadow: 0 12px 28px rgba(0,0,0,.22); + transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease; +} +.hd-helpdesk-surface .hd-btn:hover, +.hd-btn:hover { + transform: translateY(-1px); + box-shadow: 0 16px 34px rgba(0,0,0,.30); +} +.hd-helpdesk-surface .hd-btn-sm, +.hd-btn-sm { + border-radius: .65rem; + padding: .42rem .78rem; + font-size: .8125rem; +} +.hd-helpdesk-surface .hd-btn-blue, +.hd-btn-blue { background: #2563eb !important; } +.hd-helpdesk-surface .hd-btn-blue:hover, +.hd-btn-blue:hover { background: #1d4ed8 !important; } +.hd-helpdesk-surface .hd-btn-green, +.hd-btn-green { background: #16a34a !important; } +.hd-helpdesk-surface .hd-btn-green:hover, +.hd-btn-green:hover { background: #15803d !important; } +.hd-helpdesk-surface .hd-btn-amber, +.hd-btn-amber { background: #f59e0b !important; } +.hd-helpdesk-surface .hd-btn-amber:hover, +.hd-btn-amber:hover { background: #d97706 !important; } +.hd-helpdesk-surface .hd-btn-red, +.hd-btn-red { background: #dc2626 !important; } +.hd-helpdesk-surface .hd-btn-red:hover, +.hd-btn-red:hover { background: #b91c1c !important; } +.hd-helpdesk-surface .hd-btn-violet, +.hd-btn-violet { background: #7c3aed !important; } +.hd-helpdesk-surface .hd-btn-violet:hover, +.hd-btn-violet:hover { background: #6d28d9 !important; } + +.hd-helpdesk-surface button[type="submit"], +.hd-helpdesk-surface button[data-flux-button][type="submit"] { + background: #16a34a !important; + color: #ffffff !important; + border-color: rgba(255,255,255,.14) !important; +} +.hd-helpdesk-surface button[wire\:click^="reset"], +.hd-helpdesk-surface button[wire\:target^="reset"] { + background: #f59e0b !important; + color: #ffffff !important; + border-color: rgba(255,255,255,.14) !important; +} +.hd-helpdesk-surface button[wire\:click^="edit"], +.hd-helpdesk-surface button[wire\:target^="edit"] { + background: #2563eb !important; + color: #ffffff !important; + border-color: rgba(255,255,255,.14) !important; +} +.hd-helpdesk-surface button[wire\:click^="delete"], +.hd-helpdesk-surface button[wire\:target^="delete"] { + background: #dc2626 !important; + color: #ffffff !important; + border-color: rgba(255,255,255,.14) !important; +} + +.hd-select-wrap { + position: relative; + width: 100%; + max-width: 18rem; +} +.hd-select-wrap::after { + position: absolute; + top: 50%; + right: 1rem; + width: .55rem; + height: .55rem; + content: ""; + pointer-events: none; + border-right: 2px solid #93c5fd; + border-bottom: 2px solid #93c5fd; + transform: translateY(-65%) rotate(45deg); +} +.hd-select { + width: 100%; + min-height: 2.75rem; + appearance: none; + -webkit-appearance: none; + border-radius: .9rem; + border: 1px solid rgba(96, 165, 250, .38) !important; + background: linear-gradient(135deg, #030712 0%, #111827 54%, #0f172a 100%) !important; + color: #f8fafc !important; + padding: .62rem 2.45rem .62rem .9rem; + font-weight: 800; + outline: none; + box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 30px rgba(2,6,23,.38); +} +.hd-select option { + background: #020617 !important; + color: #f8fafc !important; +} +.hd-select:focus { + border-color: #60a5fa !important; + box-shadow: 0 0 0 3px rgba(96,165,250,.38), inset 0 1px 0 rgba(255,255,255,.08), 0 14px 30px rgba(2,6,23,.38); +} +.hd-ticket-board-select-wrap { + position: relative; + max-width: 12.5rem; +} +.hd-ticket-board-select-wrap::after { + position: absolute; + top: 50%; + right: .7rem; + width: .45rem; + height: .45rem; + content: ""; + pointer-events: none; + border-right: 2px solid #86efac; + border-bottom: 2px solid #86efac; + transform: translateY(-65%) rotate(45deg); +} +.hd-ticket-board-select { + width: 100%; + min-height: 2.35rem; + appearance: none; + -webkit-appearance: none; + border-radius: .85rem; + border: 1px solid rgba(34,197,94,.35) !important; + background: linear-gradient(135deg, #052e16 0%, #064e3b 100%) !important; + color: #ecfdf5 !important; + padding: .48rem 2rem .48rem .75rem; + font-size: .75rem; + font-weight: 800; + outline: none; + box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 22px rgba(0,0,0,.26); +} +.hd-ticket-board-select option { + background: #052e16 !important; + color: #ecfdf5 !important; +} +.hd-ticket-board-select:focus { + border-color: #86efac !important; + box-shadow: 0 0 0 3px rgba(34,197,94,.28), inset 0 1px 0 rgba(255,255,255,.08); +} + +.helpdesk-ticket-form, +.helpdesk-ticket-form * { + -webkit-tap-highlight-color: transparent; +} +.helpdesk-ticket-form input, +.helpdesk-ticket-form textarea, +.helpdesk-ticket-form select, +.helpdesk-ticket-form .select2-container--default .select2-selection--single, +.helpdesk-ticket-form .select2-container--default .select2-selection--multiple, +.helpdesk-ticket-form .select2-container--default .select2-selection__rendered, +.helpdesk-ticket-form .select2-container--default .select2-selection__choice { + background: #09090b !important; + background-color: #09090b !important; + color: #f4f4f5 !important; + border-color: #3f3f46 !important; + caret-color: #f4f4f5 !important; + opacity: 1 !important; +} +.helpdesk-ticket-form input:disabled, +.helpdesk-ticket-form textarea:disabled, +.helpdesk-ticket-form select:disabled, +.helpdesk-ticket-form .select2-container--disabled .select2-selection--single, +.helpdesk-ticket-form .select2-container--disabled .select2-selection--multiple, +.helpdesk-ticket-form [disabled], +.helpdesk-ticket-form [aria-disabled="true"] { + background: #09090b !important; + background-color: #09090b !important; + color: #a1a1aa !important; + opacity: 1 !important; +} +.helpdesk-ticket-form input:-webkit-autofill, +.helpdesk-ticket-form input:-webkit-autofill:hover, +.helpdesk-ticket-form input:-webkit-autofill:focus, +.helpdesk-ticket-form textarea:-webkit-autofill, +.helpdesk-ticket-form textarea:-webkit-autofill:hover, +.helpdesk-ticket-form textarea:-webkit-autofill:focus, +.helpdesk-ticket-form select:-webkit-autofill, +.helpdesk-ticket-form select:-webkit-autofill:hover, +.helpdesk-ticket-form select:-webkit-autofill:focus { + -webkit-text-fill-color: #f4f4f5 !important; + box-shadow: 0 0 0 1000px #09090b inset !important; + transition: background-color 9999s ease-in-out 0s; +} diff --git a/Modules/Helpdesk/Resources/views/index.blade.php b/Modules/Helpdesk/Resources/views/index.blade.php index c4d7263a..85d49a16 100644 --- a/Modules/Helpdesk/Resources/views/index.blade.php +++ b/Modules/Helpdesk/Resources/views/index.blade.php @@ -147,7 +147,7 @@