mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-10 23:36:14 -05:00
Fix user profile settings
References #3810, #3944 - Fixes several small visual bugs with the user settings page - Changes `.settings-subview-header` to use a clearfix instead of `overflow: hidden;` (fixing style issues in #3944)
This commit is contained in:
parent
5e0c890b4d
commit
ecf5d045f3
3 changed files with 31 additions and 11 deletions
|
@ -156,7 +156,7 @@
|
||||||
padding-right: 15px;
|
padding-right: 15px;
|
||||||
}
|
}
|
||||||
@media (max-width: 550px) {
|
@media (max-width: 550px) {
|
||||||
padding: 0 15px 40px;
|
padding-top: 15px;
|
||||||
}
|
}
|
||||||
} // .content
|
} // .content
|
||||||
|
|
||||||
|
@ -238,6 +238,7 @@
|
||||||
// This is the header for /ghost/settings/view/subview/
|
// This is the header for /ghost/settings/view/subview/
|
||||||
// It's black and fixed position at the top of the screen
|
// It's black and fixed position at the top of the screen
|
||||||
.settings-subview-header {
|
.settings-subview-header {
|
||||||
|
@include clearfix;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
|
@ -248,7 +249,6 @@
|
||||||
text-align: center;
|
text-align: center;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background: #242628;
|
background: #242628;
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.btn-back {
|
.btn-back {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
|
@ -4,6 +4,10 @@
|
||||||
// Slug: /ghost/settings/users/username/
|
// Slug: /ghost/settings/users/username/
|
||||||
// --------------------------------------------------
|
// --------------------------------------------------
|
||||||
|
|
||||||
|
.user-actions-cog {
|
||||||
|
padding: 9px 11px;
|
||||||
|
}
|
||||||
|
|
||||||
.user-cover {
|
.user-cover {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: auto;
|
width: auto;
|
||||||
|
@ -14,7 +18,7 @@
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
@media (max-width: 900px) {
|
@media (max-width: 900px) {
|
||||||
margin: 0 15px;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Gradient overlay
|
// Gradient overlay
|
||||||
|
@ -32,13 +36,13 @@
|
||||||
.user-cover-edit {
|
.user-cover-edit {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 35px;
|
right: 35px;
|
||||||
bottom: 34px;
|
bottom: 29px;
|
||||||
min-height: 34px;
|
min-height: 37px;
|
||||||
height: 34px;
|
height: 37px;
|
||||||
background: rgba(0,0,0,0.3);
|
background: rgba(0,0,0,0.3);
|
||||||
border-radius: 0;
|
|
||||||
color: rgba(255,255,255,0.8);
|
color: rgba(255,255,255,0.8);
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
border-width: 0;
|
||||||
border-radius: $rounded;
|
border-radius: $rounded;
|
||||||
transition: color 0.3s ease, background 0.3s ease;
|
transition: color 0.3s ease, background 0.3s ease;
|
||||||
@media (max-width: 1000px) {
|
@media (max-width: 1000px) {
|
||||||
|
@ -77,7 +81,13 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
fieldset {
|
fieldset {
|
||||||
padding: 0 0 0 40px;
|
padding: 0 15px 0 40px;
|
||||||
|
@media (max-width: 650px) {
|
||||||
|
padding: 0 40px;
|
||||||
|
}
|
||||||
|
@media (max-width: 550px) {
|
||||||
|
padding: 0 15px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
textarea {
|
textarea {
|
||||||
|
@ -89,6 +99,11 @@
|
||||||
|
|
||||||
@media (max-width: 650px) {
|
@media (max-width: 650px) {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
label[for='user-name'] { // Reverse the affects of .sr-only
|
||||||
|
position: static;
|
||||||
|
width: auto;
|
||||||
|
height: auto;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (min-width: 651px) {
|
@media (min-width: 651px) {
|
||||||
|
@ -97,10 +112,15 @@
|
||||||
p {
|
p {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
.user-name {
|
||||||
|
border-color: #fff;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-name {
|
@media (min-width: 901px) {
|
||||||
border-color: #fff;
|
.user-name {
|
||||||
|
width: calc(100% - 20px);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -21,7 +21,7 @@
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
<figure class="user-cover" {{bind-attr style=cover}}>
|
<figure class="user-cover" {{bind-attr style=cover}}>
|
||||||
<button class="user-cover-edit js-modal-cover" {{action "openModal" "upload" user "cover"}}>Change Cover</button>
|
<button class="btn btn-default user-cover-edit js-modal-cover" {{action "openModal" "upload" user "cover"}}>Change Cover</button>
|
||||||
</figure>
|
</figure>
|
||||||
|
|
||||||
<form class="user-profile" novalidate="novalidate" autocomplete="off">
|
<form class="user-profile" novalidate="novalidate" autocomplete="off">
|
||||||
|
|
Loading…
Add table
Reference in a new issue