Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-25 16:09:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix colored notes ui

Browse Source
This commit is contained in:
ammarahm-ed
2021-09-13 13:42:01 +05:00
parent 1828f6f81a
commit e01a994e21
5 changed files with 47 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
apps/mobile/src/components/SimpleList/announcement.js
View File

@@ -7,6 +7,7 @@ import {
useSelectionStore
} from '../../provider/stores';
import {eSendEvent} from '../../services/EventManager';
import {hexToRGBA, RGB_Linear_Shade} from '../../utils/ColorUtils';
import {eOpenPremiumDialog, eOpenProgressDialog} from '../../utils/Events';
import {openLinkInBrowser} from '../../utils/functions';
import {SIZE} from '../../utils/SizeUtils';
@@ -16,7 +17,7 @@ import Seperator from '../Seperator';
import Heading from '../Typography/Heading';
import Paragraph from '../Typography/Paragraph';
export const Announcement = () => {
export const Announcement = ({color}) => {
const [state] = useTracked();
const colors = state.colors;
const announcements = useMessageStore(state => state.announcements);
@@ -64,9 +65,17 @@ export const Announcement = () => {
<Button
title={'Announcement'}
fontSize={12}
type="shade"
height={null}
icon="bullhorn"
style={{
backgroundColor: color
? RGB_Linear_Shade(
colors.night ? 0.04 : -0.04,
hexToRGBA(color, 0.12)
)
: colors.shade
}}
buttonType={{text: color || colors.accent}}
style={{
paddingVertical: 4
}}
@@ -126,6 +135,30 @@ export const Announcement = () => {
type={index === 0 ? 'accent' : 'shade'}
title={item.title}
fontSize={SIZE.md}
buttonType={{
color: color
? index === 0
? RGB_Linear_Shade(
colors.night ? 0.04 : -0.04,
hexToRGBA(color, 0.12)
)
: color
: index === 0
? colors.accent
: colors.shade,
text:
index !== 0
? color
? color
: colors.accent
: colors.light,
selected: color
? color
: index === 0
? colors.accent
: colors.shade,
opacity: 0.12
}}
onPress={async () => {
if (item.type === 'link') {
try {

10
apps/mobile/src/components/SimpleList/empty.js
View File

@@ -42,7 +42,7 @@ export const Empty = ({
}}>
<Placeholder
color={
COLORS_NOTE[headerProps.heading.toLowerCase()] || colors.accent
COLORS_NOTE[headerProps.color] || colors.accent
}
w={normalize(150)}
h={normalize(150)}
@@ -68,17 +68,15 @@ export const Empty = ({
fontSize={SIZE.md}
accentColor="bg"
accentText={
COLORS_NOTE[headerProps?.heading?.toLowerCase()]
? headerProps.heading?.toLowerCase()
COLORS_NOTE[headerProps.color]
? headerProps.color
: 'accent'
}
/>
) : loading ? (
<ActivityIndicator
color={
COLORS_NOTE[headerProps?.heading?.toLowerCase()]
? COLORS_NOTE[headerProps?.heading?.toLowerCase()]
: colors.accent
COLORS_NOTE[headerProps.color] || colors.accent
}
/>
) : null}

8
apps/mobile/src/components/SimpleList/header.js
View File

@@ -41,7 +41,7 @@ export const Header = React.memo(
alignItems: 'center'
}}>
{messageCard && (
<Card color={COLORS_NOTE[title.toLowerCase()] || colors.accent} />
<Card color={COLORS_NOTE[color] || colors.accent} />
)}
</View>
@@ -57,8 +57,8 @@ export const Header = React.memo(
width: '100%',
zIndex: 10,
justifyContent: 'flex-end',
backgroundColor: COLORS_NOTE[title.toLowerCase()]
? hexToRGBA(COLORS_NOTE[title.toLowerCase()], 0.15)
backgroundColor: COLORS_NOTE[color]
? hexToRGBA(COLORS_NOTE[color], 0.15)
: color || colors.shade
}}>
<View
@@ -69,7 +69,7 @@ export const Header = React.memo(
position: 'absolute'
}}>
<Placeholder
color={COLORS_NOTE[title.toLowerCase()] || colors.accent}
color={COLORS_NOTE[color] || colors.accent}
w={normalize(150)}
h={normalize(150)}
type={screen === 'Favorites' ? 'favorites' : type}

2
apps/mobile/src/components/SimpleList/index.js
View File

@@ -68,6 +68,7 @@ const SimpleList = ({
<SectionHeader
item={item}
index={index}
color={headerProps.color}
title={headerProps.heading}
type={screen === 'Notes' ? 'home' : type}
/>
@@ -149,6 +150,7 @@ const SimpleList = ({
paragraph={headerProps.paragraph}
onPress={headerProps.onPress}
icon={headerProps.icon}
color={headerProps.color}
type={type}
screen={screen}
/>

5
apps/mobile/src/components/SimpleList/sectionheader.js
View File

@@ -17,7 +17,7 @@ import {ActionIcon} from '../ActionIcon';
import {Button} from '../Button';
import Heading from '../Typography/Heading';
export const SectionHeader = ({item, index, type, title}) => {
export const SectionHeader = ({item, index, type, title,color}) => {
const [state] = useTracked();
const {colors} = state;
const {fontScale} = useWindowDimensions();
@@ -28,7 +28,6 @@ export const SectionHeader = ({item, index, type, title}) => {
key => SORT[key] === groupOptions.groupBy
);
const color = COLORS_NOTE[title.toLowerCase()] || colors.accent;
const settings = useSettingStore(state => state.settings);
const listMode =
type === 'notebooks' ? settings.notebooksListMode : settings.notesListMode;
@@ -73,7 +72,7 @@ export const SectionHeader = ({item, index, type, title}) => {
justifyContent: 'center'
}}>
<Heading
color={color}
color={COLORS_NOTE[color] || colors.accent }
size={SIZE.sm}
style={{
minWidth: 60,