scss: introduce a compact style for file upload widgets (#66463)
This commit is contained in:
parent
b0cc167f8e
commit
865b012c6f
|
@ -94,6 +94,11 @@ de classes CSS réutilisables.
|
|||
d'informations budgétaires (libellés alignés à gauche, utilisation de toute
|
||||
la largeur, colonne de saisie des nombres poussée sur la droite).</p></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><p><code>pk-compact-file</code></p></td>
|
||||
<td><p>Dispose les champs de type « Fichier » dans une version compacte,
|
||||
moins haute.</p></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><p><code>pk-hidden</code></p></td>
|
||||
<td><p>Cache le champ (applicable uniquement aux champs de type « Liste »).</p></td>
|
||||
|
|
|
@ -652,22 +652,59 @@ div.file-upload-widget {
|
|||
}
|
||||
}
|
||||
}
|
||||
&.pk-compact-file,
|
||||
&.short {
|
||||
div.file-button {
|
||||
min-height: 110px;
|
||||
min-height: 50px;
|
||||
}
|
||||
&.widget-readonly div.file-button {
|
||||
height: 110px;
|
||||
div.widget-message.click-to-upload {
|
||||
display: flex;
|
||||
}
|
||||
div.file-button div.widget-message {
|
||||
padding-top: 0px;
|
||||
div.widget-message.upload-done,
|
||||
div.widget-message.click-to-upload {
|
||||
align-items: center;
|
||||
padding: 5px 10px;
|
||||
text-align: left;
|
||||
&::before {
|
||||
padding-top: 10px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
&::after {
|
||||
top: 5px;
|
||||
top: 2px;
|
||||
left: 38px;
|
||||
}
|
||||
}
|
||||
&.widget-readonly div.file-button {
|
||||
height: 70px;
|
||||
div.widget-message.upload-done {
|
||||
display: none;
|
||||
}
|
||||
span.filename {
|
||||
padding: 5px 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&::before {
|
||||
display: block;
|
||||
padding-top: 18px;
|
||||
padding-bottom: 15px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
||||
div.fileinfo {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
&.has-file {
|
||||
div.widget-message.upload-done {
|
||||
display: flex;
|
||||
}
|
||||
}
|
||||
div.fileinfo {
|
||||
text-align: left;
|
||||
padding-left: 55px;
|
||||
min-height: 1.5em;
|
||||
margin-top: -1.5em;
|
||||
}
|
||||
}
|
||||
div.fileprogress {
|
||||
position: absolute;
|
||||
|
|
Loading…
Reference in New Issue