diff --git a/Modules/Helpdesk/Resources/assets/css/app.css b/Modules/Helpdesk/Resources/assets/css/app.css index 0760092e..24e4ce3c 100644 --- a/Modules/Helpdesk/Resources/assets/css/app.css +++ b/Modules/Helpdesk/Resources/assets/css/app.css @@ -1,3 +1,138 @@ +.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; + 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 { + width: 100%; + min-height: 3.35rem; + border-radius: 1rem; + border: 1px solid #3f3f46 !important; + background: #09090b !important; + color: #f4f4f5 !important; + padding: .78rem 3rem .78rem 1rem; + font-weight: 800; + outline: none; + box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 12px 26px rgba(0,0,0,.24); +} +.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,.05); +} + +.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; +} + .hd-helpdesk-surface .hd-btn, .hd-btn { display: inline-flex; diff --git a/Modules/Helpdesk/Resources/views/livewire/ticket-edit.blade.php b/Modules/Helpdesk/Resources/views/livewire/ticket-edit.blade.php index 743b1f90..abce5fe3 100644 --- a/Modules/Helpdesk/Resources/views/livewire/ticket-edit.blade.php +++ b/Modules/Helpdesk/Resources/views/livewire/ticket-edit.blade.php @@ -1,28 +1,8 @@