server/apps/theming/css/settings-admin.css
Daniel Calviño Sánchez 2398e845c9 Fix loading icon inside upload button in Theming app
Pull request #5969 fixed the vertical alignment of loading icon and
status message in Theming app, but in doing so it broke the loading icon
inside the upload button.

When an image is being uploaded the upload icon is replaced by a loading
icon, so the loading icon and the upload icon have to share their CSS
rules, but only in that specific case.

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
2017-08-07 15:04:43 +02:00

102 lines
1.8 KiB
CSS

#theming input {
width: 230px;
}
#theming input:focus,
#theming input:active {
padding-right: 30px;
}
#theming .upload-logo-field {
display: none;
}
#theming div > label {
position: relative;
}
#theming .theme-undo {
position: absolute;
top: -7px;
right: 7px;
cursor: pointer;
opacity: .3;
padding: 7px;
vertical-align: top;
display: inline-block;
visibility: hidden;
}
form.uploadButton {
width: 356px;
}
#theming form .theme-undo,
#theming .theme-remove-bg {
cursor: pointer;
opacity: .3;
padding: 7px;
vertical-align: top;
display: inline-block;
float: right;
position: relative;
top: 4px;
right: 0px;
visibility: visible;
}
#theming input[type='text']:hover + .theme-undo,
#theming input[type='text'] + .theme-undo:hover,
#theming input[type='text']:focus + .theme-undo,
#theming input[type='text']:active + .theme-undo {
visibility: visible;
}
#theming label span {
display: inline-block;
min-width: 120px;
padding: 8px 0px;
vertical-align: top;
}
#theming .icon-upload,
#theming .uploadButton .icon-loading-small {
padding: 8px 20px;
width: 20px;
margin: 2px 0px;
min-height: 32px;
display: inline-block;
}
#theming_settings_status {
height: 26px;
margin: 10px;
}
#theming_settings_loading {
display: inline-block;
vertical-align: middle;
margin-right: 10px;
}
#theming_settings_msg {
vertical-align: middle;
}
#theming-preview-logo {
cursor: pointer;
}
#theming-preview {
width: 230px;
height: 140px;
background-size: cover;
background-position: center center;
text-align: center;
margin-left: 123px;
margin-top: 10px;
cursor: pointer;
}
#theming-preview img {
max-width: 20%;
max-height: 20%;
margin-top: 20px;
}