leumas-universal-crud-react/src/styles/CardContainers.css

Leumas Universal CRUD to a dynamic Endpoint, Setup your own Dynamic Endpoint and Use Leumas API to send to your MONGO clusters

/* Basic card container style */
.card-container {
    display: flex;
    flex-direction: column;
    width: 250px;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
    margin: 20px;
    transition: box-shadow 0.3s ease;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding: 2px;
}

.card-container:hover {
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

/* Card header style */
.card-container h3 {

    padding: 10px 20px;
    margin: 0;
    border-bottom: 1px solid #e0e0e0;
    font-size: 18px;
}

/* Card content style */
.card-container p {
    padding: 10px 20px;
    margin: 0;
    font-size: 14px;

}

.card-container ul {
    list-style-type: none;
    padding: 0 20px;
}

.card-container li {
    padding: 5px 0;
    font-size: 12px;
    color: #555;
}

/* Status indicator for active/inactive */
.card-container .status-active {
    color: green;
}

.card-container .status-inactive {
    color: red;
}