fix logo preview cross browser
This commit is contained in:
parent
4557979d6f
commit
a737b2454a
3 changed files with 17 additions and 16 deletions
|
@ -13,7 +13,8 @@
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label><%- @T('Logo') %></label>
|
<label><%- @T('Logo') %></label>
|
||||||
<div class="alert alert--danger hide" role="alert"></div>
|
<div class="alert alert--danger hide" role="alert"></div>
|
||||||
<img class="logo-preview" src="" data-placeholder="<%- @T('Your Logo') %>">
|
<img class="logo-preview" src="">
|
||||||
|
<div class="logo-preview-placeholder"><%- @T('Your Logo') %></div>
|
||||||
<div class="btn btn--success fileUpload"><%- @T('Upload') %><input type="file" class="js-upload" name="logo" accept="image/*"></div>
|
<div class="btn btn--success fileUpload"><%- @T('Upload') %><input type="file" class="js-upload" name="logo" accept="image/*"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
|
|
|
@ -55,7 +55,8 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
<label>Logo</label>
|
<label>Logo</label>
|
||||||
<img class="logo-preview" src="" data-placeholder="Your Logo">
|
<img class="logo-preview" src="">
|
||||||
|
<div class="logo-preview-placeholder"><%- @T('Your Logo') %></div>
|
||||||
<div class="btn btn--success fileUpload">Upload<input type="file" class="js-upload" accept="image/*"></div>
|
<div class="btn btn--success fileUpload">Upload<input type="file" class="js-upload" accept="image/*"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-group">
|
<div class="form-group">
|
||||||
|
|
|
@ -4241,27 +4241,26 @@ label + .wizard-buttonList {
|
||||||
|
|
||||||
.setup.wizard .logo-preview {
|
.setup.wizard .logo-preview {
|
||||||
display: block;
|
display: block;
|
||||||
background: hsl(0,0%,95%);
|
height: 0;
|
||||||
width: 100%;
|
max-width: 200px;
|
||||||
height: 60px;
|
max-height: 100px;
|
||||||
margin-bottom: 10px;
|
|
||||||
content: "";
|
|
||||||
color: hsl(0,0%,60%);
|
|
||||||
@extend .centered;
|
|
||||||
|
|
||||||
&:after {
|
+ .logo-preview-placeholder {
|
||||||
content: attr(data-placeholder);
|
height: 100px;
|
||||||
|
color: hsl(0,0%,60%);
|
||||||
|
background: hsl(0,0%,95%);
|
||||||
|
margin-bottom: 10px;
|
||||||
|
@extend .centered;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.setup.wizard .logo-preview:not([src=""]) {
|
.setup.wizard .logo-preview:not([src=""]) {
|
||||||
content: initial;
|
|
||||||
max-width: 240px;
|
|
||||||
max-height: 60px;
|
|
||||||
margin: 0 auto 15px;
|
margin: 0 auto 15px;
|
||||||
background: none;
|
|
||||||
width: auto;
|
|
||||||
height: auto;
|
height: auto;
|
||||||
|
|
||||||
|
+ .logo-preview-placeholder {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.import.wizard .wizard-slide {
|
.import.wizard .wizard-slide {
|
||||||
|
|
Loading…
Reference in a new issue