#cass.div { margin-bottom: 10px; } #cass.label { display: inline-block; width: 110px; } #cass.input { padding: 5px 10px; } .form-element { } label.form-element { display: inline-block; width: 150px; } .button-success, .button-error, .button-warning, .button-secondary { color: white; border-radius: 4px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2); } .button-success { background: rgb(28, 184, 65); /* this is a green */ } .button-error { background: rgb(202, 60, 60); /* this is a maroon */ } .button-warning { background: rgb(223, 117, 20); /* this is an orange */ } .button-secondary { background: rgb(66, 184, 221); /* this is a light blue */ } .div-center { display: flex; justify-content: center; align-items: center; } .form-container { display: flex; flex-direction: row; } .form-container form { margin-right: 10px; /* Ajustez la marge selon vos besoins */ margin-top: 5px; } /* CASS STYLE */ .cass-button { background-color:#088cff; border-radius:6px; display:inline-block; cursor:pointer; color:#ffffff; font-family:Arial; font-size:17px; padding:8px 25px; text-decoration:none; border-style: none; margin: 5px; } .cass-button:hover { background-color:#2ea1ff; } .cass-button:active { position:relative; top:1px; } .cass-box-center { display: flex; justify-content: center; align-items: center; } /* COMBO BOX STYLE */ .cass-combo-box { background-color: #088cff; border-radius: 6px; display: inline-block; cursor: pointer; color: #ffffff; font-family: Arial; font-size: 17px; padding: 8px 25px; text-decoration: none; border-style: none; margin: 5px; } .cass-combo-box:hover { background-color: #2ea1ff; } .cass-combo-box:active { position: relative; top: 1px; } .cass-combo-box-center { display: flex; justify-content: center; align-items: center; } .cass-table { border-collapse: collapse; border: 1px solid #ddd; } .cass-table th, #cass-table td { border: 1px solid #ddd; padding: 8px; } .cass-table th { background-color: #f2f2f2; } .cass-table th:not(:last-child), .cass-table td:not(:last-child) { border-right: 1px solid #ddd; /* Ajouter une bordure droite à toutes les cellules sauf la dernière colonne */ } /* MODAL */ .cass-modal { opacity: 0; pointer-events: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; display: flex; align-items: center; justify-content: center; z-index: 20; } .cass-modal-overlay { position: absolute; width: 100%; height: 100%; background-color: #333333; opacity: 0.5; } .cass-modal-container { background-color: #ffffff; width: 11/12; max-width:500px; margin: 0 auto; border-radius: 0.375rem; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); z-index: 50; overflow-y: auto; } .cass-modal-close { position: absolute; top: 0; right: 0; cursor: pointer; display: flex; flex-direction: column; align-items: center; margin-top: 1rem; margin-right: 1rem; color: #ffffff; } .cass-modal-content { padding: 1.5rem; text-align: left; } .cass-modal-content label { display: block; margin-bottom: 0.5rem; font-weight: bold; } .cass-modal-content input, .cass-modal-content textarea { width: 100%; padding: 0.5rem; margin-bottom: 1rem; border: 1px solid #cccccc; border-radius: 0.25rem; } .cass-modal-footer { display: flex; justify-content: flex-end; padding-top: 0.5rem; } .progress-bar { margin: 0 auto; height: 4px; background-color: rgba(5, 114, 206, 0.2); width: 200px; overflow: hidden; } .progress-bar-value { width: 100%; height: 100%; background-color: rgb(5, 114, 206); animation: indeterminateAnimation 1s infinite linear; transform-origin: 0% 50%; } @keyframes indeterminateAnimation { 0% { transform: translateX(0) scaleX(0); } 40% { transform: translateX(0) scaleX(0.4); } 100% { transform: translateX(100%) scaleX(0.5); } }