admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

feat: iframe addition (chrome-extension) (#4418)

Browse Source 
* toggle iframe addition

* React UI init

* remove files

* loading state files

* render iframe logic

* remove event

* build fix

* WIP

* Ok

* Cleaned

---------

Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
This commit is contained in:
Aditya Pimpalkar
2024-03-15 15:36:53 +00:00
committed by GitHub
parent c083bb15cd
commit 638a12c571
11 changed files with 206 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
packages/twenty-chrome-extension/src/options/modules/ui/display/loader/components/Loader.tsx Normal file
View File

@ -0,0 +1,38 @@
import styled from '@emotion/styled';
import { motion } from 'framer-motion';
const StyledLoaderContainer = styled.div`
justify-content: center;
align-items: center;
display: flex;
gap: ${({ theme }) => theme.spacing(2)};
width: ${({ theme }) => theme.spacing(6)};
height: ${({ theme }) => theme.spacing(3)};
border-radius: ${({ theme }) => theme.border.radius.pill};
border: 1px solid ${({ theme }) => theme.font.color.tertiary};
overflow: hidden;
`;
const StyledLoader = styled(motion.div)`
background-color: ${({ theme }) => theme.font.color.tertiary};
border-radius: ${({ theme }) => theme.border.radius.pill};
height: 8px;
width: 8px;
`;
export const Loader = () => (
<StyledLoaderContainer>
<StyledLoader
animate={{
x: [-16, 0, 16],
width: [8, 12, 8],
height: [8, 2, 8],
}}
transition={{
duration: 0.8,
times: [0, 0.15, 0.3],
repeat: Infinity,
}}
/>
</StyledLoaderContainer>
);