91e220fb47
- Composant dashboard migré vers fichiers HTML/CSS externes avec carte de navigation vers /dashboard/planning - html, body, app-root et main fixés à 100vw/100vh sans overflow pour remplir la fenêtre navigateur Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
165 lines
4.6 KiB
CSS
165 lines
4.6 KiB
CSS
@import 'ng-zorro-antd/ng-zorro-antd.min.css';
|
|
|
|
/* You can add global styles to this file, and also import other style files */
|
|
:root {
|
|
--mauve: #8b7b8b;
|
|
--ugly-yellow: #d4a574;
|
|
}
|
|
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
html, body {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
overflow: hidden;
|
|
font-family: 'Be Vietnam Pro', sans-serif;
|
|
}
|
|
:root {
|
|
--primary-color: #605DC8;
|
|
--secondary-color: #8B89E6;
|
|
--accent-color: #e8e7fa;
|
|
--shadow-color: #E8E8E8;
|
|
}
|
|
|
|
button.primary {
|
|
padding: 10px;
|
|
border: solid 1px var(--primary-color);
|
|
background: var(--primary-color);
|
|
color: white;
|
|
border-radius: 8px;
|
|
}
|
|
|
|
/* ─── Date picker dropdown (Pyrofetes theme) ──────────────── */
|
|
.pyro-datepicker-dropdown .ant-picker-panel-container {
|
|
border-radius: 14px !important;
|
|
overflow: hidden !important;
|
|
border: 2px solid var(--ugly-yellow) !important;
|
|
box-shadow: 0 8px 30px rgba(212, 165, 116, 0.25) !important;
|
|
min-width: 320px !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-date-panel {
|
|
min-width: 250px !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell {
|
|
min-width: 32px !important;
|
|
padding: 2px !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-header {
|
|
border-bottom: 2px solid #f5ede3 !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-header-view button {
|
|
color: var(--ugly-yellow) !important;
|
|
font-weight: 700 !important;
|
|
font-family: 'Be Vietnam Pro', sans-serif !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-header button {
|
|
color: var(--ugly-yellow) !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-content th {
|
|
color: #a08060 !important;
|
|
font-size: 11px !important;
|
|
font-weight: 700 !important;
|
|
text-transform: uppercase !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell {
|
|
padding: 2px 1px !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell-inner {
|
|
width: 100% !important;
|
|
height: 28px !important;
|
|
line-height: 28px !important;
|
|
border-radius: 6px !important;
|
|
font-size: 12px !important;
|
|
font-weight: 600 !important;
|
|
color: #ccc !important;
|
|
transition: all 0.15s ease !important;
|
|
display: block !important;
|
|
text-align: center !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell-in-view .ant-picker-cell-inner {
|
|
color: var(--ugly-yellow) !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell:hover .ant-picker-cell-inner {
|
|
background: rgba(212, 165, 116, 0.12) !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell-in-view.ant-picker-cell-selected .ant-picker-cell-inner {
|
|
background: linear-gradient(135deg, var(--ugly-yellow) 0%, #c49563 100%) !important;
|
|
color: white !important;
|
|
box-shadow: 0 2px 8px rgba(212, 165, 116, 0.35) !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-cell-in-view.ant-picker-cell-today .ant-picker-cell-inner::before {
|
|
border: 2px solid var(--ugly-yellow) !important;
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-now-btn {
|
|
color: var(--ugly-yellow) !important;
|
|
font-family: 'Be Vietnam Pro', sans-serif !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-ok button:not(:disabled) {
|
|
background: linear-gradient(135deg, var(--ugly-yellow) 0%, #c49563 100%) !important;
|
|
border-color: var(--ugly-yellow) !important;
|
|
color: white !important;
|
|
border-radius: 8px !important;
|
|
font-family: 'Be Vietnam Pro', sans-serif !important;
|
|
}
|
|
|
|
.pyro-datepicker-dropdown .ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected .ant-picker-time-panel-cell-inner {
|
|
background: rgba(212, 165, 116, 0.15) !important;
|
|
color: var(--ugly-yellow) !important;
|
|
font-weight: 700 !important;
|
|
}
|
|
|
|
/* ─── Modale création spectacle ──────────────────────────── */
|
|
.create-show-modal .ant-modal-content {
|
|
border-radius: 16px !important;
|
|
overflow: hidden !important;
|
|
border: 1.5px solid #ede8e0 !important;
|
|
box-shadow: 0 24px 64px rgba(0, 0, 0, 0.14) !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.create-show-modal .ant-modal-body {
|
|
padding: 28px !important;
|
|
}
|
|
|
|
.create-show-modal .ant-modal-close {
|
|
top: 14px !important;
|
|
right: 14px !important;
|
|
}
|
|
|
|
.create-show-modal .ant-modal-close-x {
|
|
width: 32px !important;
|
|
height: 32px !important;
|
|
line-height: 32px !important;
|
|
border-radius: 8px !important;
|
|
color: #bbb !important;
|
|
transition: all 0.15s !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
justify-content: center !important;
|
|
}
|
|
|
|
.create-show-modal .ant-modal-close-x:hover {
|
|
background: #f5f4f0 !important;
|
|
color: #666 !important;
|
|
}
|
|
|