mirror of
https://github.com/streetwriters/notesnook.git
synced 2026-09-01 19:49:54 +02:00
mobile: update svg logos in paywall
This commit is contained in:
File diff suppressed because one or more lines are too long
@@ -31,7 +31,17 @@ import {
|
||||
import Config from "react-native-config";
|
||||
import * as RNIap from "react-native-iap";
|
||||
import { SafeAreaView } from "react-native-safe-area-context";
|
||||
import { TRUST_BAR_SVG } from "../../assets/images/assets";
|
||||
import {
|
||||
ANDROID_POLICE_SVG,
|
||||
APPLE_INSIDER,
|
||||
FREEDOM_PRESS_SVG,
|
||||
NESS_LABS,
|
||||
PRIVACY_GUIDES_SVG,
|
||||
TECHLORE_SVG,
|
||||
THE_VERGE_SVG,
|
||||
TRUST_BAR_SVG,
|
||||
XDA_SVG
|
||||
} from "../../assets/images/assets";
|
||||
import { db } from "../../common/database";
|
||||
import { Radius, Spacing } from "../../common/design/spacing";
|
||||
import { useNavigationFocus } from "../../hooks/use-navigation-focus";
|
||||
@@ -56,6 +66,57 @@ import { FAQItem } from "./faq-item";
|
||||
import { PricingPlanCard } from "./plan-card";
|
||||
import { ReviewItem } from "./review-item";
|
||||
|
||||
const PRESS_LOGOS = [
|
||||
{
|
||||
id: "android-police",
|
||||
src: ANDROID_POLICE_SVG,
|
||||
width: 120,
|
||||
height: 14
|
||||
},
|
||||
{
|
||||
id: "the-verge",
|
||||
src: THE_VERGE_SVG,
|
||||
width: 67,
|
||||
height: 14
|
||||
},
|
||||
{
|
||||
id: "freedom-press",
|
||||
src: FREEDOM_PRESS_SVG,
|
||||
width: 80,
|
||||
height: 12
|
||||
},
|
||||
{
|
||||
id: "privacy-guides",
|
||||
src: PRIVACY_GUIDES_SVG,
|
||||
width: 110,
|
||||
height: 16
|
||||
},
|
||||
{
|
||||
id: "techlore",
|
||||
src: TECHLORE_SVG,
|
||||
width: 72,
|
||||
height: 14
|
||||
},
|
||||
{
|
||||
id: "apple-insider",
|
||||
src: APPLE_INSIDER,
|
||||
width: 76,
|
||||
height: 13
|
||||
},
|
||||
{
|
||||
id: "xda",
|
||||
src: XDA_SVG,
|
||||
width: 40,
|
||||
height: 12
|
||||
},
|
||||
{
|
||||
id: "ness-labs",
|
||||
src: NESS_LABS,
|
||||
width: 39,
|
||||
height: 23
|
||||
}
|
||||
];
|
||||
|
||||
const PayWall = (props: NavigationProps<"PayWall">) => {
|
||||
const isGithubRelease = Config.GITHUB_RELEASE === "true";
|
||||
const routeParams = props.route.params;
|
||||
@@ -150,45 +211,66 @@ const PayWall = (props: NavigationProps<"PayWall">) => {
|
||||
height: 50,
|
||||
justifyContent: "flex-end",
|
||||
alignItems: "flex-end",
|
||||
width: "100%",
|
||||
flexDirection: "row",
|
||||
paddingHorizontal: DefaultAppStyles.GAP
|
||||
}}
|
||||
>
|
||||
<IconButton
|
||||
name="close"
|
||||
iconFamily="notesnook"
|
||||
testID="paywall-close"
|
||||
color={colors.primary.icon}
|
||||
size={25}
|
||||
size={18}
|
||||
onPress={() => {
|
||||
Navigation.navigate("FluidPanelsView", {});
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
) : (
|
||||
<Header
|
||||
canGoBack={true}
|
||||
onLeftMenuButtonPress={() => {
|
||||
if (step === Steps.buy) {
|
||||
setStep(Steps.select);
|
||||
return;
|
||||
}
|
||||
if (routeParams.context === "signup") {
|
||||
Navigation.navigate("FluidPanelsView", {});
|
||||
} else {
|
||||
Navigation.goBack();
|
||||
}
|
||||
<View
|
||||
style={{
|
||||
height: 50,
|
||||
justifyContent: "flex-start",
|
||||
flexShrink: 1,
|
||||
flexGrow: 1,
|
||||
flexDirection: "row",
|
||||
paddingHorizontal: DefaultAppStyles.GAP
|
||||
}}
|
||||
title={
|
||||
step === Steps.buy || step === Steps.buyWeb
|
||||
? pricingPlans.userCanRequestTrial
|
||||
? strings.tryPlanForFree(
|
||||
pricingPlans.currentPlan?.name as string
|
||||
)
|
||||
: strings.plan(pricingPlans.currentPlan?.name as string)
|
||||
: ""
|
||||
}
|
||||
/>
|
||||
>
|
||||
<IconButton
|
||||
name="arrow-back"
|
||||
iconFamily="notesnook"
|
||||
testID="paywall-close"
|
||||
color={colors.primary.icon}
|
||||
size={18}
|
||||
onPress={() => {
|
||||
Navigation.navigate("FluidPanelsView", {});
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
// <Header
|
||||
// canGoBack={true}
|
||||
// onLeftMenuButtonPress={() => {
|
||||
// if (step === Steps.buy) {
|
||||
// setStep(Steps.select);
|
||||
// return;
|
||||
// }
|
||||
// if (routeParams.context === "signup") {
|
||||
// Navigation.navigate("FluidPanelsView", {});
|
||||
// } else {
|
||||
// Navigation.goBack();
|
||||
// }
|
||||
// }}
|
||||
// title={
|
||||
// step === Steps.buy || step === Steps.buyWeb
|
||||
// ? pricingPlans.userCanRequestTrial
|
||||
// ? strings.tryPlanForFree(
|
||||
// pricingPlans.currentPlan?.name as string
|
||||
// )
|
||||
// : strings.plan(pricingPlans.currentPlan?.name as string)
|
||||
// : ""
|
||||
// }
|
||||
// />
|
||||
)}
|
||||
|
||||
{step === Steps.select ? (
|
||||
@@ -304,7 +386,9 @@ const PayWall = (props: NavigationProps<"PayWall">) => {
|
||||
padding: Spacing.LEVEL_0
|
||||
}}
|
||||
>
|
||||
<Paragraph>-20%</Paragraph>
|
||||
<Paragraph color={colors.primary.accentForeground}>
|
||||
-20%
|
||||
</Paragraph>
|
||||
</View>
|
||||
</Pressable>
|
||||
</View>
|
||||
@@ -396,17 +480,35 @@ const PayWall = (props: NavigationProps<"PayWall">) => {
|
||||
|
||||
<View
|
||||
style={{
|
||||
width: "100%"
|
||||
width: "100%",
|
||||
flexDirection: "row",
|
||||
flexWrap: "wrap",
|
||||
justifyContent: "center",
|
||||
gap: Spacing.LEVEL_1,
|
||||
paddingVertical: Spacing.LEVEL_7
|
||||
}}
|
||||
>
|
||||
<SvgView
|
||||
src={TRUST_BAR_SVG}
|
||||
style={{
|
||||
height: 230,
|
||||
width: undefined,
|
||||
paddingVertical: Spacing.LEVEL_7
|
||||
}}
|
||||
/>
|
||||
{PRESS_LOGOS.map((item) => (
|
||||
<View
|
||||
key={item.id}
|
||||
style={{
|
||||
backgroundColor: colors.secondary.background,
|
||||
paddingVertical: Spacing.LEVEL_3,
|
||||
paddingHorizontal: Spacing.LEVEL_2,
|
||||
borderRadius: Radius.XS,
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
}}
|
||||
>
|
||||
<SvgView
|
||||
src={item.src}
|
||||
style={{
|
||||
width: item.width,
|
||||
height: item.height
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
|
||||
<View>
|
||||
|
||||
@@ -98,9 +98,9 @@ export const IconButton = ({
|
||||
style={{
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
borderRadius: 100,
|
||||
width: 40 * growFactor,
|
||||
height: 40 * growFactor,
|
||||
// borderRadius: 100,
|
||||
width: size,
|
||||
height: size,
|
||||
...style
|
||||
}}
|
||||
>
|
||||
|
||||
@@ -750,7 +750,10 @@ const usePricingPlans = (options?: PricingPlansOptions) => {
|
||||
},
|
||||
regionalDiscount: regionalDiscount.result,
|
||||
isGithubRelease: isGithubRelease,
|
||||
isSubscribed: () => user?.subscription?.plan !== SubscriptionPlan.FREE,
|
||||
isSubscribed: () =>
|
||||
user &&
|
||||
user.subscription &&
|
||||
user?.subscription?.plan !== SubscriptionPlan.FREE,
|
||||
finish: () => options?.onBuy?.()
|
||||
};
|
||||
};
|
||||
|
||||
@@ -1 +1 @@
|
||||
{"m":{"f":"notesnook-icons","u":1024,"z":1020,"s":59648,"h":"83a1ac81fdaaf076cb52c3ad793c668b4be2ce48e94af989b74c69660096843b"},"i":{"archive":[1024,[[59648,"#666666"]]],"bell":[1024,[[59649,"#666666"]]],"book-open":[1024,[[59650,"#666666"]]],"bookmark":[1024,[[59651,"#666666"]]],"box-empty":[1024,[[59652,"#B0B0B1"]]],"calendar":[1024,[[59653,"rgba(102,102,102,0.8)"]]],"chat":[1024,[[59654,"white"]]],"checkbox":[1024,[[59655,"#008836"],[59656,"white"]]],"checks":[1024,[[59657,"#181818"]]],"chevron-down":[1024,[[59658,"#181818"]]],"chevron-up":[1024,[[59659,"#181818"]]],"close":[1024,[[59660,"#666666"]]],"dark-mode-outline":[1024,[[59661,"currentColor"]]],"dots-three":[1024,[[59662,"#202020"]]],"drive-file-move":[1088,[[59663,"#666666"]]],"envelope-simple":[1024,[[59664,"white"]]],"funnel":[1024,[[59665,"#666666"]]],"home":[1024,[[59666,"#181818"]]],"link":[560,[[59667,"#666666"]]],"lock-simple":[1024,[[59668,"white"]]],"menu":[1024,[[59669,"#181818"]]],"note":[1024,[[59670,"#181818"]]],"pin":[939,[[59671,"#666666"]]],"plus":[1024,[[59672,"#666666"]]],"search":[1024,[[59673,"#181818"]]],"shield-check":[1024,[[59674,"#008836"]]],"shopping-mode":[1024,[[59675,"#666666"]]],"sliders":[1024,[[59676,"#181818"]]],"sort-ascending":[1024,[[59677,"#666666"]]],"sort-descending":[1024,[[59678,"currentColor"]]],"star-filled":[1024,[[59679,"#E5C131"]]],"star":[1024,[[59680,"#666666"]]],"sun":[1024,[[59681,"#666666"]]],"trash":[1024,[[59682,"#666666"]]],"view-list":[1024,[[59683,"#181818"]]],"warning-circle":[1024,[[59684,"#BB3431"]]]}}
|
||||
{"m":{"f":"notesnook-icons","u":1024,"z":1020,"s":59648,"h":"07a452234d5730a0542b3d4875bf7d4479d5a4ede12c782514ba8bb1a6d4619d"},"i":{"archive":[1024,[[59648,"#666666"]]],"arrow-back":[1024,[[59649,"rgba(255,255,255,0.7)"]]],"bell":[1024,[[59650,"#666666"]]],"book-open":[1024,[[59651,"#666666"]]],"bookmark":[1024,[[59652,"#666666"]]],"box-empty":[1024,[[59653,"#B0B0B1"]]],"calendar":[1024,[[59654,"rgba(102,102,102,0.8)"]]],"chat":[1024,[[59655,"white"]]],"checkbox":[1024,[[59656,"#008836"],[59657,"white"]]],"checks":[1024,[[59658,"#181818"]]],"chevron-down":[1024,[[59659,"#181818"]]],"chevron-up":[1024,[[59660,"#181818"]]],"close":[1024,[[59661,"#666666"]]],"dark-mode-outline":[1024,[[59662,"currentColor"]]],"dots-three":[1024,[[59663,"#202020"]]],"drive-file-move":[1088,[[59664,"#666666"]]],"edit-pencil":[1024,[[59665,"#181818"]]],"envelope-simple":[1024,[[59666,"white"]]],"funnel":[1024,[[59667,"#666666"]]],"home":[1024,[[59668,"#181818"]]],"link":[560,[[59669,"#666666"]]],"lock-simple":[1024,[[59670,"white"]]],"menu":[1024,[[59671,"#181818"]]],"note":[1024,[[59672,"#181818"]]],"pin":[939,[[59673,"#666666"]]],"plus":[1024,[[59674,"#666666"]]],"search":[1024,[[59675,"#181818"]]],"shield-check":[1024,[[59676,"#008836"]]],"shopping-mode":[1024,[[59677,"#666666"]]],"sliders":[1024,[[59678,"#181818"]]],"sort-ascending":[1024,[[59679,"#666666"]]],"sort-descending":[1024,[[59680,"currentColor"]]],"square-out":[1024,[[59681,"#181818"]]],"star-filled":[1024,[[59682,"#E5C131"]]],"star":[1024,[[59683,"#666666"]]],"sun":[1024,[[59684,"#666666"]]],"trash":[1024,[[59685,"#666666"]]],"view-list":[1024,[[59686,"#181818"]]],"warning-circle":[1024,[[59687,"#BB3431"]]]}}
|
||||
Binary file not shown.
Binary file not shown.
10
packages/icons/svgs/arrow-back.svg
Normal file
10
packages/icons/svgs/arrow-back.svg
Normal file
@@ -0,0 +1,10 @@
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_1133_12157)">
|
||||
<path d="M9 3L10.0575 4.0575L5.8725 8.25H15V9.75H5.8725L10.0575 13.9425L9 15L3 9L9 3Z" fill="white" fill-opacity="0.7"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_1133_12157">
|
||||
<rect width="18" height="18" fill="white" transform="matrix(-1 0 0 1 18 0)"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 406 B |
Reference in New Issue
Block a user