mirror of
https://github.com/chinchang/web-maker.git
synced 2025-03-24 20:49:47 +01:00
add pro badge to header
This commit is contained in:
parent
17575313aa
commit
abb8967e9a
@ -3,7 +3,7 @@ import { Button } from './common';
|
||||
import { Trans, NumberFormat, t } from '@lingui/macro';
|
||||
import { I18n } from '@lingui/react';
|
||||
import { ProBadge } from './ProBadge';
|
||||
import { Stack } from './Stack';
|
||||
import { HStack, Stack } from './Stack';
|
||||
|
||||
const DEFAULT_PROFILE_IMG =
|
||||
"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23ccc' d='M12,19.2C9.5,19.2 7.29,17.92 6,16C6.03,14 10,12.9 12,12.9C14,12.9 17.97,14 18,16C16.71,17.92 14.5,19.2 12,19.2M12,5A3,3 0 0,1 15,8A3,3 0 0,1 12,11A3,3 0 0,1 9,8A3,3 0 0,1 12,5M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12C22,6.47 17.5,2 12,2Z'/%3E%3C/svg%3E";
|
||||
@ -136,14 +136,19 @@ export function MainHeader(props) {
|
||||
aria-label={i18n._(t`See profile or Logout`)}
|
||||
class="btn--dark hint--rounded hint--bottom-left"
|
||||
>
|
||||
<img
|
||||
id="headerAvatarImg"
|
||||
width="20"
|
||||
src={
|
||||
props.user ? props.user.photoURL || DEFAULT_PROFILE_IMG : ''
|
||||
}
|
||||
class="main-header__avatar-img"
|
||||
/>
|
||||
<HStack gap={1}>
|
||||
<img
|
||||
id="headerAvatarImg"
|
||||
width="20"
|
||||
src={
|
||||
props.user
|
||||
? props.user.photoURL || DEFAULT_PROFILE_IMG
|
||||
: ''
|
||||
}
|
||||
class="main-header__avatar-img"
|
||||
/>
|
||||
{props.user && props.user.isPro ? <ProBadge /> : null}
|
||||
</HStack>
|
||||
</Button>
|
||||
)}
|
||||
</div>
|
||||
|
@ -194,7 +194,9 @@ export default class App extends Component {
|
||||
if (customUser) {
|
||||
const prefs = { ...this.state.prefs };
|
||||
Object.assign(prefs, user.settings);
|
||||
this.setState({ prefs }, this.updateSetting);
|
||||
const newUser = { ...user, isPro: false, ...customUser };
|
||||
window.localStorage.setItem('user', newUser);
|
||||
this.setState({ user: newUser, prefs }, this.updateSetting);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
|
@ -574,7 +574,9 @@ body:not(.light-version).overlay-visible .main-container {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
background: var(--color-bg);
|
||||
transition: height 0.3s ease, width 0.3s ease;
|
||||
transition:
|
||||
height 0.3s ease,
|
||||
width 0.3s ease;
|
||||
will-change: height;
|
||||
}
|
||||
|
||||
@ -993,7 +995,9 @@ body > #demo-frame {
|
||||
|
||||
/* fix me */
|
||||
background: linear-gradient(45deg, #2d063c, #3a2b63);
|
||||
box-shadow: inset 1px -1px 0 0 #ffffff17, 0 20px 31px 0 #0000008a;
|
||||
box-shadow:
|
||||
inset 1px -1px 0 0 #ffffff17,
|
||||
0 20px 31px 0 #0000008a;
|
||||
|
||||
color: var(--color-text);
|
||||
position: relative;
|
||||
@ -2122,10 +2126,10 @@ while the theme CSS file is loading */
|
||||
padding: 0.1rem 0.3rem;
|
||||
background-color: #fff91f;
|
||||
border-radius: 1rem;
|
||||
font-size: 0.8em;
|
||||
font-size: 0.7em;
|
||||
color: #222;
|
||||
box-shadow: inset 2px 2px 3px rgba(0, 0, 0, 0.3);
|
||||
font-weight: 700;
|
||||
font-weight: 800;
|
||||
line-height: 1;
|
||||
}
|
||||
@media screen and (max-width: 600px) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user