chore: add spec-kit and standardize signatures
- Added GitHub spec-kit for development workflow - Standardized file signatures to Descomplicar® format - Updated development configuration 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Emanuel Almeida
@@ -0,0 +1,301 @@
|
||||
/**
|
||||
* Descomplicar® Crescimento Digital
|
||||
* https://descomplicar.pt
|
||||
*/
|
||||
|
||||
/**
|
||||
* Care Booking Block - Frontend CSS
|
||||
*
|
||||
* Base styles for enhanced KiviCare integration and graceful degradation
|
||||
*
|
||||
* @package CareBookingBlock
|
||||
*/
|
||||
|
||||
/* === LOADING STATES === */
|
||||
.care-booking-loading {
|
||||
position: relative;
|
||||
opacity: 0.7;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.care-booking-loading::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin: -10px 0 0 -10px;
|
||||
border: 2px solid #f3f3f3;
|
||||
border-top: 2px solid #3498db;
|
||||
border-radius: 50%;
|
||||
animation: care-booking-spin 1s linear infinite;
|
||||
z-index: 1000;
|
||||
}
|
||||
|
||||
.care-booking-loading::after {
|
||||
content: "Loading...";
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 20px);
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
z-index: 1001;
|
||||
}
|
||||
|
||||
@keyframes care-booking-spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
|
||||
/* === FALLBACK STATES === */
|
||||
.care-booking-fallback {
|
||||
opacity: 0.7;
|
||||
pointer-events: none;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.care-booking-fallback::after {
|
||||
content: "Service temporarily unavailable";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
border: 1px dashed #ccc;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
/* === ENHANCED KIVICARE SELECTORS === */
|
||||
.care-booking-enhanced {
|
||||
transition: opacity 0.3s ease, transform 0.3s ease;
|
||||
}
|
||||
|
||||
.care-booking-enhanced:hover {
|
||||
opacity: 0.9;
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
/* KiviCare 3.0+ compatibility */
|
||||
.kc-doctor-item,
|
||||
.kc-service-item,
|
||||
.kivicare-doctor,
|
||||
.kivicare-service {
|
||||
transition: all 0.2s ease;
|
||||
}
|
||||
|
||||
.kc-doctor-item[data-blocked="true"],
|
||||
.kc-service-item[data-blocked="true"],
|
||||
.kivicare-doctor[data-blocked="true"],
|
||||
.kivicare-service[data-blocked="true"] {
|
||||
opacity: 0;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* === FORM ENHANCEMENTS === */
|
||||
.care-booking-form-container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.care-booking-form-container .field-error {
|
||||
color: #dc3545;
|
||||
font-size: 12px;
|
||||
margin-top: 4px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.care-booking-form-container input.error,
|
||||
.care-booking-form-container select.error {
|
||||
border-color: #dc3545;
|
||||
box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
|
||||
}
|
||||
|
||||
.care-booking-form-container .success-message {
|
||||
color: #28a745;
|
||||
background-color: #d4edda;
|
||||
border: 1px solid #c3e6cb;
|
||||
padding: 8px 12px;
|
||||
border-radius: 4px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.care-booking-form-container .error-message {
|
||||
color: #721c24;
|
||||
background-color: #f8d7da;
|
||||
border: 1px solid #f5c6cb;
|
||||
padding: 8px 12px;
|
||||
border-radius: 4px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.care-booking-retry {
|
||||
background-color: #007cba;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 6px 12px;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.care-booking-retry:hover {
|
||||
background-color: #005a87;
|
||||
}
|
||||
|
||||
/* === OFFLINE STATES === */
|
||||
.care-booking-offline-message {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #ff6b6b;
|
||||
color: white;
|
||||
padding: 10px;
|
||||
text-align: center;
|
||||
z-index: 10000;
|
||||
animation: care-booking-slide-down 0.3s ease;
|
||||
}
|
||||
|
||||
@keyframes care-booking-slide-down {
|
||||
from { transform: translateY(-100%); }
|
||||
to { transform: translateY(0); }
|
||||
}
|
||||
|
||||
/* === ACCESSIBILITY === */
|
||||
.care-booking-sr-only {
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
margin: -1px;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* === RESPONSIVE DESIGN === */
|
||||
@media (max-width: 768px) {
|
||||
.care-booking-loading::after {
|
||||
font-size: 11px;
|
||||
transform: translate(-50%, 15px);
|
||||
}
|
||||
|
||||
.care-booking-fallback::after {
|
||||
font-size: 12px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.care-booking-offline-message {
|
||||
font-size: 14px;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.care-booking-loading::before {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
margin: -8px 0 0 -8px;
|
||||
}
|
||||
|
||||
.care-booking-loading::after {
|
||||
font-size: 10px;
|
||||
transform: translate(-50%, 12px);
|
||||
}
|
||||
}
|
||||
|
||||
/* === HIGH CONTRAST MODE === */
|
||||
@media (prefers-contrast: high) {
|
||||
.care-booking-fallback::after {
|
||||
background: #000;
|
||||
color: #fff;
|
||||
border: 2px solid #fff;
|
||||
}
|
||||
|
||||
.care-booking-offline-message {
|
||||
background-color: #000;
|
||||
border-bottom: 2px solid #fff;
|
||||
}
|
||||
}
|
||||
|
||||
/* === REDUCED MOTION === */
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.care-booking-enhanced,
|
||||
.kc-doctor-item,
|
||||
.kc-service-item,
|
||||
.kivicare-doctor,
|
||||
.kivicare-service {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
@keyframes care-booking-spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(0deg); }
|
||||
}
|
||||
|
||||
.care-booking-offline-message {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* === PRINT STYLES === */
|
||||
@media print {
|
||||
.care-booking-loading,
|
||||
.care-booking-loading::before,
|
||||
.care-booking-loading::after,
|
||||
.care-booking-offline-message,
|
||||
.care-booking-retry {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.care-booking-fallback::after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.care-booking-fallback {
|
||||
opacity: 1;
|
||||
pointer-events: all;
|
||||
}
|
||||
}
|
||||
|
||||
/* === DARK MODE SUPPORT === */
|
||||
@media (prefers-color-scheme: dark) {
|
||||
.care-booking-loading::after {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.care-booking-fallback::after {
|
||||
background: rgba(40, 40, 40, 0.95);
|
||||
color: #ccc;
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
.care-booking-form-container .field-error {
|
||||
color: #ff6b6b;
|
||||
}
|
||||
|
||||
.care-booking-form-container .success-message {
|
||||
background-color: #1e4d2b;
|
||||
border-color: #2d5a35;
|
||||
color: #86efac;
|
||||
}
|
||||
|
||||
.care-booking-form-container .error-message {
|
||||
background-color: #4d1e24;
|
||||
border-color: #5a2d35;
|
||||
color: #fca5a5;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user