mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-02-10 23:36:14 -05:00
Fixed various mobile bugs
- Fixed titles not breaking on small size screens - Fixed bottom margin of powered by badge on mobile - Updated word-wrap of detail values in lists
This commit is contained in:
parent
bd25c0cc6e
commit
4af2a89f13
3 changed files with 39 additions and 13 deletions
|
@ -557,8 +557,9 @@ const FrameStyles = `
|
|||
letter-spacing: 0.3px;
|
||||
line-height: 1.3em;
|
||||
padding: 0;
|
||||
margin: 5px 0 0;
|
||||
margin: 5px 8px 0 0;
|
||||
color: var(--grey6);
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.gh-portal-list-detail .old-price {
|
||||
|
@ -709,7 +710,8 @@ const MobileStyles = `
|
|||
|
||||
button[class="gh-portal-btn"],
|
||||
.gh-portal-btn-main,
|
||||
.gh-portal-btn-primary {
|
||||
.gh-portal-btn-primary,
|
||||
.gh-portal-btn-branded {
|
||||
height: 42px;
|
||||
}
|
||||
}
|
||||
|
@ -750,6 +752,10 @@ const MobileStyles = `
|
|||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.gh-portal-detail-header {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.gh-portal-popup-wrapper {
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
|
@ -816,28 +822,30 @@ const MobileStyles = `
|
|||
margin-bottom: 32px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.gh-portal-powered {
|
||||
padding-top: 12px;
|
||||
padding-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 390px) {
|
||||
.gh-portal-popup-container:not(.account-plan) .gh-portal-detail-header .gh-portal-main-title {
|
||||
font-size: 2.1rem;
|
||||
margin-top: 1px;
|
||||
padding: 0 74px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.gh-portal-input {
|
||||
font-size: 1.4rem;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.gh-portal-popup-container footer {
|
||||
padding-right: 24px;
|
||||
padding-bottom: 24px;
|
||||
padding-left: 24px;
|
||||
}
|
||||
|
||||
.gh-portal-signup-header,
|
||||
.gh-portal-signin-header {
|
||||
padding-bottom: 16px;
|
||||
}
|
||||
|
||||
.gh-portal-powered {
|
||||
padding-top: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 480px) and (max-height: 880px) {
|
||||
|
|
|
@ -110,6 +110,24 @@ export const AccountHomePageStyles = `
|
|||
margin-right: 5px;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
@media (max-width: 390px) {
|
||||
.gh-portal-account-footer {
|
||||
padding: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 340px) {
|
||||
.gh-portal-account-footer {
|
||||
padding: 0 !important;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.gh-portal-account-footer .gh-portal-account-footerright {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
const UserAvatar = ({avatar, brandColor}) => {
|
||||
|
|
|
@ -10,7 +10,7 @@ import {formatNumber, getAvailablePrices, getFilteredPrices, getMemberActivePric
|
|||
export const AccountPlanPageStyles = `
|
||||
.account-plan.full-size .gh-portal-main-title {
|
||||
font-size: 3.2rem;
|
||||
margin-top: 32px;
|
||||
margin-top: 44px;
|
||||
}
|
||||
|
||||
.gh-portal-accountplans-main {
|
||||
|
|
Loading…
Add table
Reference in a new issue