TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-20 17:32:15 +03:00
Code Issues Projects Releases Wiki Activity

Changed style namespace

Browse Source 
no refs.
- changed style namespace from `ghp` to `gh-portal`
This commit is contained in:
Peter Zimon 2020-07-20 16:05:27 +02:00
parent eb8ad7b493
commit cfe6829538
5 changed files with 35 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
ghost/portal/src/components/Frame.styles.js
View File

@ -98,13 +98,13 @@ export const GlobalStyles = `
letter-spacing: 0.2px;
}
.ghp-main-title {
.gh-portal-main-title {
color: #333;
}
/* Global layout styles
/* ----------------------------------------------------- */
.ghp-popup-container {
.gh-portal-popup-container {
width: 100%;
letter-spacing: 0;
text-rendering: optimizeLegibility;
@ -124,13 +124,13 @@ export const GlobalStyles = `
position: relative;
}
.ghp-closeicon-container {
.gh-portal-closeicon-container {
position: absolute;
top: 8px;
right: 8px;
}
.ghp-closeicon {
.gh-portal-closeicon {
width: 16px;
height: 16px;
color: #999;
@ -138,7 +138,7 @@ export const GlobalStyles = `
padding: 12px;
}
.ghp-section {
.gh-portal-section {
margin-bottom: 32px;
}
`;

12
ghost/portal/src/components/PopupModal.js
View File

@ -146,8 +146,8 @@ class PopupContent extends React.Component {
renderPopupClose() {
return (
<div className='ghp-closeicon-container'>
<CloseIcon className='ghp-closeicon' onClick = {() => this.context.onAction('closePopup')} />
<div className='gh-portal-closeicon-container'>
<CloseIcon className='gh-portal-closeicon' onClick = {() => this.context.onAction('closePopup')} />
</div>
);
}
@ -155,7 +155,7 @@ class PopupContent extends React.Component {
render() {
const page = this.getCurrentPage();
return (
<div className='ghp-popup-container' ref={this.container}>
<div className='gh-portal-popup-container' ref={this.container}>
{this.renderPopupClose()}
{this.renderCurrentPage(page)}
</div>
@ -187,8 +187,8 @@ export default class PopupModal extends React.Component {
renderPopupClose() {
return (
<div className='ghp-closeicon-container'>
<CloseIcon className='ghp-closeicon' onClick = {() => this.context.onAction('closePopup')} />
<div className='gh-portal-closeicon-container'>
<CloseIcon className='gh-portal-closeicon' onClick = {() => this.context.onAction('closePopup')} />
</div>
);
}
@ -196,7 +196,7 @@ export default class PopupModal extends React.Component {
renderPopupContent() {
const page = this.getCurrentPage();
return (
<div className='ghp-popup-container'>
<div className='gh-portal-popup-container'>
{this.renderPopupClose()}
{this.renderCurrentPage(page)}
</div>

6
ghost/portal/src/components/common/ActionButton.js
View File

@ -2,7 +2,7 @@ import React from 'react';
import getContrastColor from '../../utils/contrast-color';
export const ActionButtonStyles = `
.ghp-btn {
.gh-portal-btn {
position: relative;
display: inline-block;
padding: 0 1.8rem;
@ -23,7 +23,7 @@ export const ActionButtonStyles = `
width: 100%;
}
.ghp-btn:hover::before {
.gh-portal-btn:hover::before {
position: absolute;
content: "";
top: 0;
@ -57,7 +57,7 @@ const Styles = ({brandColor, retry, disabled, style = {}}) => {
function ActionButton({label, onClick, disabled, retry, brandColor, style}) {
let Style = Styles({disabled, retry, brandColor, style});
return (
<button onClick={e => onClick(e)} style={Style.button} className="ghp-btn ghp-btn-primary" disabled={disabled}>
<button onClick={e => onClick(e)} style={Style.button} className="gh-portal-btn gh-portal-btn-primary" disabled={disabled}>
{label}
</button>
);

32
ghost/portal/src/components/common/Switch.js
View File

@ -1,8 +1,8 @@
import React from 'react';
export const SwitchStyles = `
.ghp-for-switch label,
.ghp-for-switch .container {
.gh-portal-for-switch label,
.gh-portal-for-switch .container {
cursor: pointer;
position: relative;
display: inline-block;
@ -10,20 +10,20 @@ export const SwitchStyles = `
height: 28px !important;
}
.ghp-for-switch label p,
.ghp-for-switch .container p {
.gh-portal-for-switch label p,
.gh-portal-for-switch .container p {
overflow: auto;
color: #15171A;
font-weight: normal;
}
.ghp-for-switch input {
.gh-portal-for-switch input {
opacity: 0;
width: 0;
height: 0;
}
.ghp-for-switch .input-toggle-component {
.gh-portal-for-switch .input-toggle-component {
position: absolute;
cursor: pointer;
top: 0;
@ -39,12 +39,12 @@ export const SwitchStyles = `
transition: background 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.ghp-for-switch label:hover input:not(:checked) + .input-toggle-component,
.ghp-for-switch .container:hover input:not(:checked) + .input-toggle-component {
.gh-portal-for-switch label:hover input:not(:checked) + .input-toggle-component,
.gh-portal-for-switch .container:hover input:not(:checked) + .input-toggle-component {
border-color: #c5d7e2;
}
.ghp-for-switch .input-toggle-component:before {
.gh-portal-for-switch .input-toggle-component:before {
position: absolute;
content: "";
height: 22px !important;
@ -57,39 +57,39 @@ export const SwitchStyles = `
border-radius: 999px;
}
.ghp-for-switch input:checked + .input-toggle-component {
.gh-portal-for-switch input:checked + .input-toggle-component {
background: #a4d037;
border-color: transparent;
}
.ghp-for-switch input:checked + .input-toggle-component:before {
.gh-portal-for-switch input:checked + .input-toggle-component:before {
transform: translateX(22px);
}
.ghp-for-switch .container {
.gh-portal-for-switch .container {
width: 38px !important;
height: 22px !important;
}
.ghp-for-switch.small .input-toggle-component {
.gh-portal-for-switch.small .input-toggle-component {
width: 38px !important;
height: 22px !important;
}
.ghp-for-switch.small .input-toggle-component:before {
.gh-portal-for-switch.small .input-toggle-component:before {
height: 16px !important;
width: 16px !important;
box-shadow: 0 0 1px rgba(0,0,0,.45), 0 1px 2px rgba(0,0,0,.1);
}
.ghp-for-switch.small input:checked + .input-toggle-component:before {
.gh-portal-for-switch.small input:checked + .input-toggle-component:before {
transform: translateX(16px);
}
`;
function Switch({id, label, onToggle, checked = false}) {
return (
<div className="ghp-for-switch">
<div className="gh-portal-for-switch">
<label className="switch" htmlFor={id}>
<input
type="checkbox"

10
ghost/portal/src/components/pages/AccountHomePage.js
View File

@ -7,7 +7,7 @@ import isPreviewMode from '../../utils/is-preview-mode';
const React = require('react');
export const AccountHomePageStyles = `
.ghp-account-header {
.gh-portal-account-header {
display: flex;
flex-direction: column;
align-items: center;
@ -61,9 +61,9 @@ const AccountFooter = ({onLogout, onSettings, brandColor}) => {
const UserHeader = ({member}) => {
const avatar = member.avatar_image;
return (
<div className='ghp-account-header'>
<div className='gh-portal-account-header'>
<UserAvatar avatar={avatar} />
<h2 className="ghp-main-title">Your Account</h2>
<h2 className="gh-portal-main-title">Your Account</h2>
</div>
);
};
@ -107,7 +107,7 @@ class FreeAccountHomePage extends React.Component {
const {title: siteTitle} = this.context.site;
return (
<div className='ghp-section'>
<div className='gh-portal-section'>
<div style={{textAlign: 'center', marginBottom: '24px', fontSize: '15px', lineHeight: '1.6em'}}>
Hey <span style={{fontWeight: '600'}}>{firstname || name || email}! </span>
You are subscribed to free updates from <span style={{fontWeight: '600'}}>{siteTitle}</span>, but you don't have a paid subscription to unlock full access
@ -142,7 +142,7 @@ class PaidAccountHomePage extends React.Component {
const siteTitle = this.context.site.title;
return (
<div className='ghp-section'>
<div className='gh-portal-section'>
<div style={{textAlign: 'center', marginBottom: '24px', fontSize: '15px'}}>
Hey <span style={{fontWeight: '600'}}>{firstname || name || email}! </span>
You have an active <span style={{fontWeight: '600'}}>{siteTitle}</span> account with access to all areas. Get in touch if you have any problems or need some help getting things updated, and thanks for subscribing.