@basiq/connect-auth 0.1.79 → 0.1.81

package/src/styledComponents/ui/button.ts

@@ -1,112 +0,0 @@
-import styled, { css } from 'styled-components';
-import { SimpleButton } from './basic';
-import { ButtonType } from '../../components/ui/Button';
-
-export const ButtonLabel = styled.span`
-	font-size: 18px;
-`;
-
-interface IButtonStyled {
-	buttonType?: ButtonType;
-	disabled: boolean;
-	onClick: () => void;
-}
-export const ButtonStyled = styled(SimpleButton)<IButtonStyled>`
-	min-height: 40px;
-	justify-content: center;
-	background-color: ${(props) => props.theme.color.endeavour};
-	text-align: center;
-	box-shadow: none;
-	border: none;
-	cursor: pointer;
-	color: ${({ theme }) => theme.color.white};
-
-	&:last-child {
-		margin-bottom: 0;
-	}
-	&:hover {
-		background-color: ${({ theme }) => theme.color.bostonBlue};
-	}
-	&:active {
-		background-color: ${({ theme }) => theme.color.congressBlue};
-	}
-	${({ buttonType, theme }) => {
-		switch (buttonType) {
-			case 'secondary':
-				return css`
-					color: ${theme.color.ebony};
-					background-color: ${theme.color.porcelainSecond};
-					&:hover {
-						color: ${theme.color.abbey};
-						background-color: ${theme.color.porcelainSecondLight};
-					}
-					&:active {
-						background-color: ${theme.color.ironSecond};
-					}
-				`;
-			case 'tiny':
-				return css`
-					width: auto;
-					min-height: 32px;
-					padding: 6px 16px;
-					box-sizing: border-box;
-					font-size: 14px;
-					color: ${theme.color.cyprus};
-					background-color: ${theme.color.hokeyPokey};
-					&:hover {
-						background-color: ${theme.color.hokeyPokeyLight};
-					}
-					&:active {
-						background-color: ${theme.color.anzac};
-					}
-				`;
-
-			case 'back':
-				return css`
-					background: none;
-					justify-content: initial;
-					padding: 0;
-					min-height: unset;
-					color: ${theme.color.casper};
-					width: auto;
-					img {
-						width: 25px;
-						filter: invert(68%) sepia(13%) saturate(348%) hue-rotate(155deg) brightness(91%) contrast(94%);
-					}
-					&:hover {
-						color: ${theme.color.abbey};
-						background-color: unset;
-						img {
-							filter: invert(31%) sepia(10%) saturate(313%) hue-rotate(155deg) brightness(96%) contrast(87%);
-						}
-					}
-					&:active {
-						color: ${theme.color.jumbo};
-						background-color: unset;
-						img {
-							filter: invert(49%) sepia(0%) saturate(5%) hue-rotate(29deg) brightness(99%) contrast(83%);
-						}
-					}
-					&:disabled {
-						color: ${theme.color.porcelain};
-						background-color: unset !important;
-						img {
-							color: ${theme.color.porcelain};
-						}
-					}
-				`;
-			default:
-				return '';
-		}
-	}}
-	img {
-		color: ${({ theme }) => theme.color.casper};
-		margin-right: 3px;
-	}
-
-	&:disabled {
-		background-color: ${({ theme }) => theme.color.porcelain};
-		color: ${({ theme }) => theme.color.casper};
-		cursor: not-allowed;
-	}
-`;

package/src/styledComponents/ui/index.ts

@@ -1,3 +0,0 @@
-export * from './basic';
-export * from './button';
-export * from './modals';

package/src/styledComponents/ui/modals.ts

@@ -1,48 +0,0 @@
-import styled from 'styled-components';
-import { hexToRGBa } from '../../helpers';
-import { IconWrapper } from './basic';
-
-interface IModalStyled {
-	disableTransparency: boolean;
-}
-
-export const ModalStyled = styled.div<IModalStyled>`
-	position: absolute;
-	top: 0;
-	bottom: 0;
-	left: 0;
-	right: 0;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	background-color: ${({ theme, disableTransparency }) => (disableTransparency ? theme.color.jumbo : hexToRGBa(theme.color.blackPearl, 0.7))};
-	z-index: 1000000000;
-	padding: 16px;
-
-	a {
-		margin-bottom: 8px;
-	}
-`;
-export const LoadingModalStyled = styled.div<IModalStyled>`
-	box-shadow: ${({ theme, disableTransparency }) => (disableTransparency ? 'none' : `0 1px 2px ${hexToRGBa(theme.color.blueBayoux, 0.3)}`)};
-	border-radius: 2px;
-	padding: 16px 12px;
-	font-size: 16px;
-	line-height: 16px;
-	color: ${({ theme }) => theme.color.white};
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-
-	${IconWrapper} {
-		filter: invert(1);
-		margin-bottom: 15px;
-		width: 48px;
-	}
-`;
-export const LoadingModalText = styled.span`
-	font-size: 18px;
-	white-space: pre-line;
-	text-align: center;
-	line-height: 30px;
-`;