Skip to content

Commit

Permalink
Merge pull request #186 from calibreapp/realign-provider-defaults
Browse files Browse the repository at this point in the history 
💅 Realign RLCL defaults with provider's latest defaults
  • Loading branch information
@robmorieson
robmorieson committed Oct 13, 2022
2 parents 72f4aae + 06c5acb commit cc48f9c
Show file tree
Hide file tree
Showing 7 changed files with 47 additions and 49 deletions.
19 changes: 8 additions & 11 deletions src/components/Drift/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ const styles: {
fontSize: 16,
display: 'flex',
alignItems: 'flex-end',
padding: '.75rem',
padding: '12px',
flexDirection: 'column'
},
button: {
Expand All @@ -24,8 +24,8 @@ const styles: {
alignItems: 'center',
fill: '#fff',
cursor: 'pointer',
height: 52,
width: 52,
height: '56px',
width: '56px',
borderRadius: '.3125rem',
boxShadow: '0 2px 6px 0 rgba(0,0,0,.4)',
overflow: 'hidden',
Expand Down Expand Up @@ -56,9 +56,7 @@ const Drift = ({
const [positionStyles, setPositionStyles] = useState<CSSProperties>({
zIndex: 2147483648,
position: 'fixed',
display: 'block',
height: '60px !important',
width: '76px !important'
display: 'block'
})

useEffect(() => {
Expand Down Expand Up @@ -96,8 +94,8 @@ const Drift = ({
>
{icon === 'A' ? (
<svg
width="20"
height="20"
width="24"
height="24"
viewBox="0 0 20 20"
focusable="false"
aria-hidden="true"
Expand All @@ -106,10 +104,9 @@ const Drift = ({
}}
>
<path
fill="#FFFFFF"
d="M4.583 14.894l-3.256 3.78c-.7.813-1.26.598-1.25-.46a10689.413 10689.413 0 0 1 .035-4.775V4.816a3.89 3.89 0 0 1 3.88-3.89h12.064a3.885 3.885 0 0 1 3.882 3.89v6.185a3.89 3.89 0 0 1-3.882 3.89H4.583z"
fill="rgb(255, 255, 255)"
fillRule="evenodd"
/>
></path>
</svg>
) : icon === 'B' ? (
<svg
Expand Down
12 changes: 6 additions & 6 deletions src/components/HelpScout/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -166,10 +166,10 @@ interface Props extends ProviderProps {
}

const HelpScout = ({
color = '#976ad4',
icon = 'beacon',
color = '#527ceb',
icon = 'message',
zIndex = '1050',
horizontalPosition = 'left',
horizontalPosition = 'right',
containerClass = ClassNames.container
}: Props): JSX.Element | null => {
const [state, loadChat] = useChat({ loadWhenIdle: true })
Expand All @@ -181,17 +181,17 @@ const HelpScout = ({

useEffect(() => {
setPositionStyles({
bottom: windowHeight < 740 ? '10px' : '40px',
bottom: windowHeight <= 740 ? '10px' : '40px',
right:
horizontalPosition === 'left'
? 'auto'
: windowHeight < 740
: windowHeight <= 740
? '20px'
: '40px',
left:
horizontalPosition === 'right'
? 'auto'
: windowHeight < 740
: windowHeight <= 740
? '20px'
: '40px'
})
Expand Down
15 changes: 8 additions & 7 deletions src/components/Intercom/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -149,17 +149,18 @@ const Intercom = ({
>
<svg
focusable="false"
viewBox="0 0 16 14"
width="28"
height="25"
style={{ width: '16px' }}
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill="rgb(255, 255, 255)"
fillRule="evenodd"
clipRule="evenodd"
d="M.116 4.884l1.768-1.768L8 9.232l6.116-6.116 1.768 1.768L8 12.768.116 4.884z"
/>
d="M18.601 8.39897C18.269 8.06702 17.7309 8.06702 17.3989 8.39897L12 13.7979L6.60099 8.39897C6.26904 8.06702 5.73086 8.06702 5.39891 8.39897C5.06696 8.73091 5.06696 9.2691 5.39891 9.60105L11.3989 15.601C11.7309 15.933 12.269 15.933 12.601 15.601L18.601 9.60105C18.9329 9.2691 18.9329 8.73091 18.601 8.39897Z"
fill="white"
></path>
</svg>
</div>
</div>
Expand Down
32 changes: 17 additions & 15 deletions src/components/Messenger/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -92,22 +92,24 @@ const Widget = ({
onClick={() => loadChat({ open: true })}
onMouseEnter={() => loadChat({ open: false })}
>
<svg width="60px" height="60px" viewBox="0 0 60 60">
<svg x="0" y="0" width="60px" height="60px">
<g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
<g>
<circle fill={color ? color : '#0084FF'} cx="30" cy="30" r="30" />
<svg x="10" y="10">
<g transform="translate(0.000000, -10.000000)" fill="#FFFFFF">
<g id="logo" transform="translate(0.000000, 10.000000)">
<path d="M20,0 C31.2666,0 40,8.2528 40,19.4 C40,30.5472 31.2666,38.8 20,38.8 C17.9763,38.8 16.0348,38.5327 14.2106,38.0311 C13.856,37.9335 13.4789,37.9612 13.1424,38.1098 L9.1727,39.8621 C8.1343,40.3205 6.9621,39.5819 6.9273,38.4474 L6.8184,34.8894 C6.805,34.4513 6.6078,34.0414 6.2811,33.7492 C2.3896,30.2691 0,25.2307 0,19.4 C0,8.2528 8.7334,0 20,0 Z M7.99009,25.07344 C7.42629,25.96794 8.52579,26.97594 9.36809,26.33674 L15.67879,21.54734 C16.10569,21.22334 16.69559,21.22164 17.12429,21.54314 L21.79709,25.04774 C23.19919,26.09944 25.20039,25.73014 26.13499,24.24744 L32.00999,14.92654 C32.57369,14.03204 31.47419,13.02404 30.63189,13.66324 L24.32119,18.45264 C23.89429,18.77664 23.30439,18.77834 22.87569,18.45674 L18.20299,14.95224 C16.80079,13.90064 14.79959,14.26984 13.86509,15.75264 L7.99009,25.07344 Z" />
</g>
</g>
</svg>
</g>
</g>
<div
style={{
width: '60px',
height: '60px',
backgroundColor: color ? color : '#0A7CFF',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
borderRadius: '60px'
}}
>
<svg width="36" height="36" viewBox="0 0 36 36">
<path
fill="white"
d="M1 17.99C1 8.51488 8.42339 1.5 18 1.5C27.5766 1.5 35 8.51488 35 17.99C35 27.4651 27.5766 34.48 18 34.48C16.2799 34.48 14.6296 34.2528 13.079 33.8264C12.7776 33.7435 12.4571 33.767 12.171 33.8933L8.79679 35.3828C7.91415 35.7724 6.91779 35.1446 6.88821 34.1803L6.79564 31.156C6.78425 30.7836 6.61663 30.4352 6.33893 30.1868C3.03116 27.2287 1 22.9461 1 17.99ZM12.7854 14.8897L7.79161 22.8124C7.31238 23.5727 8.24695 24.4295 8.96291 23.8862L14.327 19.8152C14.6899 19.5398 15.1913 19.5384 15.5557 19.8116L19.5276 22.7905C20.7193 23.6845 22.4204 23.3706 23.2148 22.1103L28.2085 14.1875C28.6877 13.4272 27.7531 12.5704 27.0371 13.1137L21.673 17.1847C21.3102 17.4601 20.8088 17.4616 20.4444 17.1882L16.4726 14.2094C15.2807 13.3155 13.5797 13.6293 12.7854 14.8897Z"
></path>
</svg>
</svg>
</div>
</div>
)
}
Expand Down
14 changes: 6 additions & 8 deletions src/components/Userlike/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const styles: {
border: '0'
},
icon: {
fontSize: '36px'
fontSize: '40px'
}
}

Expand All @@ -48,8 +48,8 @@ const Userlike = ({
color = 'white',
backgroundColor = '#0d8cff',
position = 'right',
vOffset = '24px',
hOffset = '24px',
vOffset = 'calc(0% + 20px)',
hOffset = 'calc(0% + 24px)',
style = 'round',
containerClass = ClassNames.container
}: Props): JSX.Element | null => {
Expand Down Expand Up @@ -88,16 +88,14 @@ const Userlike = ({
<svg
width="1em"
height="1em"
viewBox="0 0 36 36"
viewBox="0 0 40 40"
fill="none"
style={{ ...styles.icon, color }}
>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M18 36c2.893 0 5.626-.682 8.047-1.895h5.11a2 2 0 002-2v-4.393A17.916 17.916 0 0036 18c0-9.941-8.059-18-18-18S0 8.059 0 18s8.059 18 18 18zM9.5 22a1.5 1.5 0 000 3h17a1.5 1.5 0 000-3h-17zm1.5-4a1.5 1.5 0 011.5-1.5h14a1.5 1.5 0 010 3h-14A1.5 1.5 0 0111 18zm-1.5-7a1.5 1.5 0 000 3h17a1.5 1.5 0 000-3h-17z"
d="M37.4 30.7c-.1-.5 0-.9.2-1.4 1.5-2.8 2.3-6 2.3-9.4C40 9 31 0 20 0 9 0 0 9 0 20s9 20 20 20c3.3 0 6.5-.9 9.4-2.3.4-.2.9-.3 1.4-.2l6.8 1.3c.7.1 1.3-.5 1.2-1.2l-1.4-6.9zM21 29h-8c-1.1 0-2-.9-2-2s.9-2 2-2h8c1.1 0 2 .9 2 2s-.9 2-2 2zm6-7H13c-1.1 0-2-.9-2-2s.9-2 2-2h14c1.1 0 2 .9 2 2s-.9 2-2 2zm0-7H13c-1.1 0-2-.9-2-2s.9-2 2-2h14c1.1 0 2 .9 2 2s-.9 2-2 2z"
fill="currentColor"
/>
></path>
</svg>
</button>
</div>
Expand Down
2 changes: 1 addition & 1 deletion website/pages/helpscout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ const Page: NextPage = () => (
<ExampleLinks />
</div>
</div>
<HelpScout color="#527ceb" />
<HelpScout />
</Layout>
</LiveChatLoaderProvider>
)
Expand Down
2 changes: 1 addition & 1 deletion website/pages/userlike.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ const Page: NextPage = () => (
<ExampleLinks />
</div>
</div>
<Userlike vOffset="47px" hOffset="49px" />
<Userlike />
</Layout>
</LiveChatLoaderProvider>
)
Expand Down

1 comment on commit cc48f9c

@vercel
Copy link

@vercel vercel bot commented on cc48f9c Oct 13, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

react-live-chat-loader – ./

react-live-chat-loader.vercel.app
react-live-chat-loader-git-main-calibreapp.vercel.app
react-live-chat-loader-calibreapp.vercel.app

Please sign in to comment.