DocIndexer-v2 / static /style.css
om4r932's picture
Split HTML/CSS/JS + SSE for TDocs only
cf82bf3
body {
font-family: "Montserrat", sans-serif;
background: #fafafa;
margin: 24px;
color: #1f2937;
}
h1 {
font-size: 1.8rem;
margin-bottom: 24px;
}
.row {
display: flex;
gap: 24px;
margin-bottom: 24px;
}
.column {
flex: 1;
display: flex;
flex-direction: column;
gap: 12px;
}
button {
background-color: #6c63ff;
color: white;
font-weight: 600;
font-size: 1rem;
padding: 10px 14px;
border: none;
border-radius: 0.6em;
cursor: pointer;
box-shadow: 0 2px 8px rgb(31 41 55 / 8%);
transition: background-color 0.2s ease;
}
button:hover {
background-color: #5753d6;
}
button:disabled {
cursor: default;
background-color: #778191;
}
select {
padding: 10px 14px;
border-radius: 0.6em;
border: none;
box-shadow: 0 2px 8px rgb(31 41 55 / 8%);
font-size: 1rem;
color: #374151;
background: #f3f4f6;
appearance: none;
cursor: pointer;
}
select:focus {
outline: none;
box-shadow: 0 0 0 2px #6c63ff;
background: white;
}
select:hover {
background: #e5e7eb;
}
select:disabled {
cursor: default;
}
.dropdown-content {
position: absolute;
/* ou fixed si tu veux */
z-index: 9999;
/* un nombre élevé pour être sûr que c'est au dessus */
background-color: white;
/* pour que ce soit bien visible */
border: 1px solid #ccc;
/* autres styles que tu avais déjà */
border-radius: 0.6em;
box-shadow: 0 2px 8px rgb(31 41 55 / 8%);
padding: 10px;
max-height: 55vh;
overflow-y: auto;
}
#dropbtn {
background: #f3f4f6;
color: #374151;
font-size: 1rem;
font-family: "Montserrat", sans-serif;
/* même font que body */
padding: 10px 14px;
border-radius: 0.6em;
font-weight: normal;
border: none;
box-shadow: 0 2px 8px rgb(31 41 55 / 8%);
cursor: pointer;
width: 100%;
text-align: left;
appearance: none;
/* supprime les styles natives du bouton */
user-select: none;
transition: background-color 0.2s ease;
display: inline-block;
}
#dropbtn:hover {
background: #e5e7eb;
}
#dropbtn:disabled {
cursor: default;
}
#dropbtn:focus {
outline: none;
box-shadow: 0 0 0 2px #6c63ff;
background: white;
}
option {
background: white;
}
progress {
width: 300px;
height: 30px;
}