starting daily mirror
This commit is contained in:
Quality System Admin
241
py_app/app/static/css/daily_mirror_tune.css
Normal file
241
py_app/app/static/css/daily_mirror_tune.css
Normal file
@@ -0,0 +1,241 @@
|
||||
/* Daily Mirror Tune Pages - Modal Styles */
|
||||
/* Fixes for editable modals across tune/production, tune/orders, and tune/delivery pages */
|
||||
|
||||
/* Force Bootstrap modal to have proper z-index */
|
||||
#editModal.modal {
|
||||
z-index: 9999 !important;
|
||||
}
|
||||
|
||||
#editModal .modal-backdrop {
|
||||
z-index: 9998 !important;
|
||||
}
|
||||
|
||||
/* Ensure modal dialog is interactive */
|
||||
#editModal .modal-dialog {
|
||||
pointer-events: auto !important;
|
||||
z-index: 10000 !important;
|
||||
}
|
||||
|
||||
#editModal .modal-content {
|
||||
pointer-events: auto !important;
|
||||
}
|
||||
|
||||
/* Make all inputs in the modal fully interactive */
|
||||
#editModal .form-control:not([readonly]),
|
||||
#editModal .form-select:not([readonly]),
|
||||
#editModal input:not([readonly]):not([type="hidden"]),
|
||||
#editModal select:not([readonly]),
|
||||
#editModal textarea:not([readonly]) {
|
||||
pointer-events: auto !important;
|
||||
user-select: text !important;
|
||||
cursor: text !important;
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
opacity: 1 !important;
|
||||
-webkit-user-select: text !important;
|
||||
-moz-user-select: text !important;
|
||||
-ms-user-select: text !important;
|
||||
}
|
||||
|
||||
#editModal .form-control:focus:not([readonly]),
|
||||
#editModal input:focus:not([readonly]),
|
||||
#editModal select:focus:not([readonly]),
|
||||
#editModal textarea:focus:not([readonly]) {
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
border-color: #007bff !important;
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25) !important;
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
/* Dark mode specific overrides for modal inputs */
|
||||
body.dark-mode #editModal .form-control:not([readonly]),
|
||||
body.dark-mode #editModal input:not([readonly]):not([type="hidden"]),
|
||||
body.dark-mode #editModal select:not([readonly]),
|
||||
body.dark-mode #editModal textarea:not([readonly]) {
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
opacity: 1 !important;
|
||||
}
|
||||
|
||||
body.dark-mode #editModal .form-control:focus:not([readonly]),
|
||||
body.dark-mode #editModal input:focus:not([readonly]),
|
||||
body.dark-mode #editModal select:focus:not([readonly]),
|
||||
body.dark-mode #editModal textarea:focus:not([readonly]) {
|
||||
background-color: #ffffff !important;
|
||||
color: #000000 !important;
|
||||
border-color: #007bff !important;
|
||||
}
|
||||
|
||||
/* Readonly fields should still look readonly */
|
||||
#editModal .form-control[readonly],
|
||||
#editModal input[readonly] {
|
||||
background-color: #e9ecef !important;
|
||||
cursor: not-allowed !important;
|
||||
}
|
||||
|
||||
body.dark-mode #editModal .form-control[readonly],
|
||||
body.dark-mode #editModal input[readonly] {
|
||||
background-color: #6c757d !important;
|
||||
color: #e2e8f0 !important;
|
||||
}
|
||||
|
||||
/* Dark mode styles for cards and tables */
|
||||
body.dark-mode .card {
|
||||
background-color: #2d3748;
|
||||
color: #e2e8f0;
|
||||
border: 1px solid #4a5568;
|
||||
}
|
||||
|
||||
body.dark-mode .card-header {
|
||||
background-color: #4a5568;
|
||||
border-bottom: 1px solid #6b7280;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .form-control {
|
||||
background-color: #4a5568;
|
||||
border-color: #6b7280;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .form-control:focus {
|
||||
background-color: #4a5568;
|
||||
border-color: #007bff;
|
||||
color: #e2e8f0;
|
||||
box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
|
||||
}
|
||||
|
||||
body.dark-mode .table {
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
|
||||
background-color: rgba(255, 255, 255, 0.05);
|
||||
}
|
||||
|
||||
body.dark-mode .table-hover tbody tr:hover {
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
body.dark-mode .modal-content {
|
||||
background-color: #2d3748;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .modal-header {
|
||||
border-bottom: 1px solid #4a5568;
|
||||
}
|
||||
|
||||
body.dark-mode .modal-footer {
|
||||
border-top: 1px solid #4a5568;
|
||||
}
|
||||
|
||||
body.dark-mode .btn-secondary {
|
||||
background-color: #4a5568;
|
||||
border-color: #6b7280;
|
||||
}
|
||||
|
||||
body.dark-mode .btn-secondary:hover {
|
||||
background-color: #6b7280;
|
||||
}
|
||||
|
||||
body.dark-mode .btn-close {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
/* Table and button styling */
|
||||
.table td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.btn-action {
|
||||
padding: 0.25rem 0.5rem;
|
||||
margin: 0.1rem;
|
||||
}
|
||||
|
||||
/* Editable field highlighting */
|
||||
.editable {
|
||||
background-color: #fff3cd;
|
||||
border: 1px dashed #ffc107;
|
||||
}
|
||||
|
||||
body.dark-mode .editable {
|
||||
background-color: #2d2d00;
|
||||
border: 1px dashed #ffc107;
|
||||
}
|
||||
|
||||
/* Compact table styling */
|
||||
.table-sm th,
|
||||
.table-sm td {
|
||||
padding: 0.5rem;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
/* Action button styling */
|
||||
.btn-sm {
|
||||
padding: 0.25rem 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
/* Pagination styling */
|
||||
.pagination {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.page-link {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
body.dark-mode .pagination .page-link {
|
||||
background-color: #4a5568;
|
||||
border: 1px solid #6b7280;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .pagination .page-link:hover {
|
||||
background-color: #374151;
|
||||
border-color: #6b7280;
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .pagination .page-item.active .page-link {
|
||||
background-color: #3b82f6;
|
||||
border-color: #3b82f6;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
/* Additional dark mode styles */
|
||||
body.dark-mode .container-fluid {
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
body.dark-mode .text-muted {
|
||||
color: #a0aec0 !important;
|
||||
}
|
||||
|
||||
body.dark-mode .table-dark th {
|
||||
background-color: #1a202c;
|
||||
color: #e2e8f0;
|
||||
border-color: #4a5568;
|
||||
}
|
||||
|
||||
body.dark-mode .table-striped > tbody > tr:nth-of-type(odd) > td {
|
||||
background-color: #374151;
|
||||
}
|
||||
|
||||
body.dark-mode .table-hover > tbody > tr:hover > td {
|
||||
background-color: #4a5568;
|
||||
}
|
||||
|
||||
/* Responsive adjustments */
|
||||
@media (max-width: 768px) {
|
||||
.table-responsive {
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.btn-sm {
|
||||
font-size: 0.75rem;
|
||||
padding: 0.375rem 0.5rem;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user