settings: Improve layout and appearance of Organization logo area.

This commit is contained in:
Karl Stolley 2024-10-09 13:08:31 -05:00 committed by Tim Abbott
parent 8c90c9d68d
commit 2c78efc3c5
2 changed files with 17 additions and 13 deletions

View File

@ -139,11 +139,14 @@
} }
.user-avatar-section, .user-avatar-section,
.realm-logo-section,
.realm-icon-section { .realm-icon-section {
margin: 20px 0; margin: 20px 0;
} }
.realm-logo-section {
margin: 0 0 20px;
}
/* CSS related to settings page user avatar upload widget only */ /* CSS related to settings page user avatar upload widget only */
#user-avatar-upload-widget { #user-avatar-upload-widget {
.image-block { .image-block {
@ -184,25 +187,26 @@
} }
#realm-day-logo-upload-widget { #realm-day-logo-upload-widget {
background-color: hsl(0deg 100% 100%); /* Match to light-theme --color-background-navbar. */
background-color: hsl(0deg 0% 97%);
padding: 5px;
} }
#realm-night-logo-upload-widget { #realm-night-logo-upload-widget {
background-color: hsl(212deg 28% 18%); /* Match to dark-theme --color-background-navbar. */
} background-color: hsl(0deg 0% 13%);
padding: 5px;
.realm-logo-block {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 0 20px;
} }
.realm-logo-group { .realm-logo-group {
display: flex; display: flex;
justify-content: space-around;
flex-wrap: wrap; flex-wrap: wrap;
gap: 20px;
.image_upload_button {
top: 0;
left: 0;
}
} }
/* CSS related to upload widget's preview image */ /* CSS related to upload widget's preview image */

View File

@ -1274,7 +1274,7 @@ $option_title_width: 180px;
} }
& h5 { & h5 {
font-size: 1.2em; font-size: 1em;
font-weight: normal; font-weight: normal;
line-height: 1.2; line-height: 1.2;
margin: 10px 0; margin: 10px 0;