Merge pull request #217 from toeverything/fix/linkstyle

Fix/linkstyle
This commit is contained in:
xiaodong zuo 2022-08-12 17:32:01 +08:00 committed by GitHub
commit 21986b331c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 5 deletions

View File

@ -25,7 +25,6 @@ import { ReactEditor } from 'slate-react';
import OpenInNewIcon from '@mui/icons-material/OpenInNew'; import OpenInNewIcon from '@mui/icons-material/OpenInNew';
import EditIcon from '@mui/icons-material/Edit'; import EditIcon from '@mui/icons-material/Edit';
import LinkOffIcon from '@mui/icons-material/LinkOff'; import LinkOffIcon from '@mui/icons-material/LinkOff';
import AttachmentIcon from '@mui/icons-material/Attachment';
import { import {
MuiTooltip as Tooltip, MuiTooltip as Tooltip,
styled, styled,
@ -39,7 +38,7 @@ import {
import { getRandomString } from '../utils'; import { getRandomString } from '../utils';
import { colors } from '../../colors'; import { colors } from '../../colors';
import { LinkIcon } from '@toeverything/components/icons';
export type LinkElement = { export type LinkElement = {
type: 'link'; type: 'link';
url: string; url: string;
@ -124,7 +123,7 @@ const LinkStyledTooltip = styled(({ className, ...props }: MuiTooltipProps) => (
))(({ theme }) => ({ ))(({ theme }) => ({
[`& .${muiTooltipClasses.tooltip}`]: { [`& .${muiTooltipClasses.tooltip}`]: {
backgroundColor: '#fff', backgroundColor: '#fff',
color: '#4C6275', color: '#3E6FDB',
boxShadow: theme.affine.shadows.shadow1, boxShadow: theme.affine.shadows.shadow1,
fontSize: '14px', fontSize: '14px',
}, },
@ -419,8 +418,8 @@ export const LinkModal = memo((props: LinkModalProps) => {
}} }}
> >
<div className={styles('linkModalContainerIcon')}> <div className={styles('linkModalContainerIcon')}>
<AttachmentIcon <LinkIcon
style={{ color: colors.Gray04, fontSize: 16 }} style={{ fontSize: '16px', marginTop: '2px' }}
/> />
</div> </div>
<input <input
@ -505,8 +504,10 @@ const LinkModalContainer = styled('div')(({ theme }) => ({
const styles = style9.create({ const styles = style9.create({
linkModalContainerIcon: { linkModalContainerIcon: {
display: 'flex',
width: '16px', width: '16px',
margin: '0 16px 0 4px', margin: '0 16px 0 4px',
color: '#4C6275',
}, },
linkModalContainerInput: { linkModalContainerInput: {
flex: '1', flex: '1',
@ -517,6 +518,7 @@ const styles = style9.create({
'::-webkit-input-placeholder': { '::-webkit-input-placeholder': {
color: '#98acbd', color: '#98acbd',
}, },
color: '#4C6275',
}, },
linkMask: { linkMask: {
position: 'fixed', position: 'fixed',

View File

@ -42,6 +42,9 @@ const TextBlockContainer = styled(Text)(({ theme }) => ({
fontFamily: theme.affine.typography.body1.fontFamily, fontFamily: theme.affine.typography.body1.fontFamily,
color: theme.affine.typography.body1.color, color: theme.affine.typography.body1.color,
letterSpacing: '0.1px', letterSpacing: '0.1px',
a: {
color: '#3e6fdb',
},
})); }));
const findSlice = (arr: string[], p: string, q: string) => { const findSlice = (arr: string[], p: string, q: string) => {