kotovalexarian-likes-github/twbs--bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00
Code Releases Activity

Fix form file height (#30699)

Browse source
This commit is contained in:
Gaël Poupard 2020-05-05 19:43:16 +02:00 committed by GitHub
parent 6f7c8d3caf
commit fb0ad7a93c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
scss/forms/_form-file.scss
View file

@ -1,13 +1,13 @@
.form-file { .form-file {
--bs-form-file-height: #{$form-file-height};
position: relative; position: relative;
height: $form-file-height;
} }
.form-file-input { .form-file-input {
position: relative; position: relative;
z-index: 2; z-index: 2;
width: 100%; width: 100%;
height: 100%; height: var(--bs-form-file-height);
margin: 0; margin: 0;
opacity: 0; opacity: 0;
@ -32,7 +32,7 @@
left: 0; left: 0;
z-index: 1; z-index: 1;
display: flex; display: flex;
height: 100%; height: var(--bs-form-file-height);
border-color: $form-file-border-color; border-color: $form-file-border-color;
@include border-radius($form-file-border-radius); @include border-radius($form-file-border-radius);
@include box-shadow($form-file-box-shadow); @include box-shadow($form-file-box-shadow);
@ -71,7 +71,7 @@
} }
.form-file-sm { .form-file-sm {
height: $form-file-height-sm; --bs-form-file-height: #{$form-file-height-sm};
@include font-size($form-file-font-size-sm); @include font-size($form-file-font-size-sm);
.form-file-text, .form-file-text,
@ -81,7 +81,7 @@
} }
.form-file-lg { .form-file-lg {
height: $form-file-height-lg; --bs-form-file-height: #{$form-file-height-lg};
@include font-size($form-file-font-size-lg); @include font-size($form-file-font-size-lg);
.form-file-text, .form-file-text,

2
site/content/docs/4.3/forms/validation.md
View file

@ -289,7 +289,7 @@ Validation styles are available for the following form controls and components:
<div class="invalid-feedback">Example invalid select feedback</div> <div class="invalid-feedback">Example invalid select feedback</div>
</div> </div>
<div class="form-file"> <div class="form-file mb-3">
<input type="file" class="form-file-input" id="validationFormFile" required> <input type="file" class="form-file-input" id="validationFormFile" required>
<label class="form-file-label" for="validationFormFile"> <label class="form-file-label" for="validationFormFile">
<span class="form-file-text">Choose file...</span> <span class="form-file-text">Choose file...</span>