mirror of https://github.com/astrit/css.gg.git
🔥 (styled-components): remove src folder
This commit is contained in:
parent
c9bf148a72
commit
da6d7e38f5
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAbstract = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 3px solid;
|
||||
border-top: 3px solid;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
border: 3px solid;
|
||||
border-radius: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Abstract = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAbstract {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAdd = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 5px;
|
||||
top: 8px;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
top: 4px;
|
||||
left: 8px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Add = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAdd {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAddR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
border-radius: 5px;
|
||||
top: 8px;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
top: 4px;
|
||||
left: 8px;
|
||||
}
|
||||
`
|
||||
|
||||
export const AddR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAddR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAdidas = styled.i`
|
||||
& {
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: 23px;
|
||||
height: 15px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
overflow: hidden;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
box-sizing: border-box;
|
||||
display: block;
|
||||
width: 5px;
|
||||
height: 18px;
|
||||
background: currentColor;
|
||||
transform: rotate(-30deg);
|
||||
left: 4px;
|
||||
bottom: -14px;
|
||||
box-shadow: 7px -2px, 14px -4px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Adidas = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAdidas {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlarm = styled.i`
|
||||
& {
|
||||
background: linear-gradient(to left, currentColor 5px, transparent 0) no-repeat 4.5px 6px/5px
|
||||
2px,
|
||||
linear-gradient(to left, currentColor 7px, transparent 0) no-repeat 4.5px 2px/2px 6px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border-radius: 100%;
|
||||
border: 2px solid transparent;
|
||||
transform: scale(var(--ggs, 1));
|
||||
box-shadow: 0 0 0 2px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: -4px;
|
||||
}
|
||||
&::before {
|
||||
left: -5px;
|
||||
transform: rotate(-42deg);
|
||||
}
|
||||
&::after {
|
||||
transform: rotate(42deg);
|
||||
right: -5px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Alarm = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlarm {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlbum = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-left: 7px solid transparent;
|
||||
border-right: 3px solid transparent;
|
||||
border-bottom: 8px solid transparent;
|
||||
box-shadow: 0 0 0 2px, inset 6px 4px 0 -4px, inset -6px 4px 0 -4px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 2px;
|
||||
height: 5px;
|
||||
background: currentColor;
|
||||
transform: rotate(46deg);
|
||||
top: 5px;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
transform: rotate(-46deg);
|
||||
right: 2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Album = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlbum {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignBottom = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-top: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor;
|
||||
bottom: 2px;
|
||||
}
|
||||
&::before {
|
||||
left: 1px;
|
||||
height: 12px;
|
||||
}
|
||||
&::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignBottom = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignBottom {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignCenter = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-top: 2px solid transparent;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-left: -4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
background: currentColor;
|
||||
}
|
||||
&::before {
|
||||
left: 2px;
|
||||
width: 12px;
|
||||
top: -2px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
right: 1px;
|
||||
top: 4px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignCenter = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignCenter {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignLeft = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-left: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-left: -4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
width: 12px;
|
||||
background: currentColor;
|
||||
left: 2px;
|
||||
top: 1px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
top: 7px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignMiddle = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
margin-top: -8px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor;
|
||||
}
|
||||
&::before {
|
||||
left: 1px;
|
||||
height: 12px;
|
||||
top: 2px;
|
||||
}
|
||||
&::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
top: 5px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignMiddle = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignMiddle {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,43 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignRight = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-right: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-right: -4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 4px;
|
||||
width: 12px;
|
||||
background: currentColor;
|
||||
right: 2px;
|
||||
top: 1px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
top: 7px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,45 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAlignTop = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
border-top: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-top: -4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 4px;
|
||||
background: currentColor;
|
||||
top: 2px;
|
||||
}
|
||||
&::before {
|
||||
left: 1px;
|
||||
height: 12px;
|
||||
}
|
||||
&::after {
|
||||
height: 6px;
|
||||
right: 1px;
|
||||
opacity: 0.5;
|
||||
}
|
||||
`
|
||||
|
||||
export const AlignTop = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAlignTop {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAnchor = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 2px;
|
||||
height: 14px;
|
||||
background: currentColor;
|
||||
border-radius: 8px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
width: 12px;
|
||||
border-bottom-left-radius: 20px;
|
||||
border-bottom-right-radius: 20px;
|
||||
border-top-color: transparent;
|
||||
left: -5px;
|
||||
bottom: 2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
border-radius: 8px;
|
||||
top: -4px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Anchor = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAnchor {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAppleWatch = styled.i`
|
||||
& {
|
||||
background: linear-gradient(to left, currentColor 5px, transparent 0) no-repeat 13px 4px/2px 4px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border: 5px solid transparent;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 9px;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
width: 10px;
|
||||
height: 5px;
|
||||
border: 2px solid;
|
||||
border-bottom: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
left: 2px;
|
||||
}
|
||||
&::after {
|
||||
top: -3px;
|
||||
}
|
||||
&::before {
|
||||
transform: scaleY(-1);
|
||||
top: 12px;
|
||||
}
|
||||
`
|
||||
|
||||
export const AppleWatch = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAppleWatch {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowAlignH = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 20px;
|
||||
height: 10px;
|
||||
background: linear-gradient(to left, currentColor 15px, transparent 0) no-repeat 2px 4px/6px 2px,
|
||||
linear-gradient(to left, currentColor 15px, transparent 0) no-repeat 12px 4px/6px 2px,
|
||||
linear-gradient(to left, currentColor 15px, transparent 0) no-repeat center/2px 10px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
top: 2px;
|
||||
}
|
||||
&::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
left: 1px;
|
||||
}
|
||||
&::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
right: 1px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowAlignH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowAlignH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowAlignV = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 10px;
|
||||
height: 20px;
|
||||
background: linear-gradient(to left, currentColor 15px, transparent 0) no-repeat 4px 2px/2px 6px,
|
||||
linear-gradient(to left, currentColor 15px, transparent 0) no-repeat 4px 12px/2px 6px,
|
||||
linear-gradient(to left, currentColor 15px, transparent 0) no-repeat center/10px 2px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
left: 2px;
|
||||
}
|
||||
&::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
bottom: 1px;
|
||||
}
|
||||
&::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
top: 1px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowAlignV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowAlignV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomLeft = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-left: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 3px;
|
||||
left: -3px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomLeftO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomLeftO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomLeftO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomLeftR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomLeftR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomLeftR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomRight = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 3px;
|
||||
right: -3px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomRightO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomRightO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomRightO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowBottomRightR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
bottom: 4px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowBottomRightR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowBottomRightR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowDown = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 7px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
left: 10px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowDown = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowDown {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowDownO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowDownO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowDownO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowDownR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(-45deg);
|
||||
left: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowDownR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowDownR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLeft = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
}
|
||||
&::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 7px;
|
||||
}
|
||||
&::before {
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
bottom: 10px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLeftO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLeftO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLeftO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLeftR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLeftR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLeftR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongDown = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongDown = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongDown {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongDownC = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
top: -4px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongDownC = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongDownC {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongDownE = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
top: -5px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongDownE = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongDownE {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongDownL = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
top: -1px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongDownL = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongDownL {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongDownR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-top: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: -5px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongDownR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongDownR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongLeft = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongLeftC = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
right: -4px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongLeftC = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongLeftC {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongLeftE = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
right: -4px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongLeftE = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongLeftE {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongLeftL = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
right: -1px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongLeftL = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongLeftL {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongLeftR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-right: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: -5px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongLeftR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongLeftR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongRight = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongRightC = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
left: -4px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongRightC = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongRightC {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongRightE = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
left: -4px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongRightE = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongRightE {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongRightL = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
left: -1px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongRightL = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongRightL {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongRightR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
width: 24px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
right: 0;
|
||||
bottom: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: -5px;
|
||||
bottom: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongRightR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongRightR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,40 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongUp = styled.i`
|
||||
&,
|
||||
&::after {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: 6px;
|
||||
}
|
||||
& {
|
||||
position: relative;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongUp = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongUp {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongUpC = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
border-radius: 8px;
|
||||
bottom: -4px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongUpC = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongUpC {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,51 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongUpE = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
bottom: -5px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongUpE = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongUpE {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,50 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongUpL = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
bottom: -1px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongUpL = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongUpL {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowLongUpR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid transparent;
|
||||
border-left: 2px solid transparent;
|
||||
border-bottom: 4px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
height: 24px;
|
||||
width: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
top: 0;
|
||||
left: -2px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: -5px;
|
||||
left: -2px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowLongUpR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowLongUpR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowRight = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
}
|
||||
&::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 7px;
|
||||
}
|
||||
&::before {
|
||||
width: 16px;
|
||||
height: 2px;
|
||||
bottom: 10px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowRightO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowRightO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowRightO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowRightR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
bottom: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
bottom: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowRightR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowRightR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopLeft = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
top: 3px;
|
||||
left: -3px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,49 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopLeftO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
right: 4px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
left: 4px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopLeftO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopLeftO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopLeftR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopLeftR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopLeftR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopRight = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-right: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
top: 3px;
|
||||
right: -3px;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopRightO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopRightO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopRightO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowTopRightR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 2px;
|
||||
background: currentColor;
|
||||
transform: rotate(-45deg);
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
top: 4px;
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowTopRightR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowTopRightR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowUp = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 7px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 16px;
|
||||
left: 10px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowUp = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowUp {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowUpO = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 20px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowUpO = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowUpO {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,48 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowUpR = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 2px solid;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 4px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
transform: rotate(45deg);
|
||||
left: 6px;
|
||||
}
|
||||
&::before {
|
||||
width: 2px;
|
||||
height: 10px;
|
||||
left: 8px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowUpR = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowUpR {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsBreakeH = styled.i``
|
||||
|
||||
export const ArrowsBreakeH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsBreakeH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsBreakeV = styled.i``
|
||||
|
||||
export const ArrowsBreakeV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsBreakeV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExchange = styled.i``
|
||||
|
||||
export const ArrowsExchange = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExchange {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExchangeAlt = styled.i``
|
||||
|
||||
export const ArrowsExchangeAlt = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExchangeAlt {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExchangeAltV = styled.i``
|
||||
|
||||
export const ArrowsExchangeAltV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExchangeAltV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExchangeV = styled.i``
|
||||
|
||||
export const ArrowsExchangeV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExchangeV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandDownLeft = styled.i``
|
||||
|
||||
export const ArrowsExpandDownLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandDownLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandDownRight = styled.i``
|
||||
|
||||
export const ArrowsExpandDownRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandDownRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandLeft = styled.i``
|
||||
|
||||
export const ArrowsExpandLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandLeftAlt = styled.i``
|
||||
|
||||
export const ArrowsExpandLeftAlt = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandLeftAlt {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandRight = styled.i``
|
||||
|
||||
export const ArrowsExpandRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandRightAlt = styled.i``
|
||||
|
||||
export const ArrowsExpandRightAlt = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandRightAlt {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandUpLeft = styled.i``
|
||||
|
||||
export const ArrowsExpandUpLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandUpLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsExpandUpRight = styled.i``
|
||||
|
||||
export const ArrowsExpandUpRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsExpandUpRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsH = styled.i``
|
||||
|
||||
export const ArrowsH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsHAlt = styled.i``
|
||||
|
||||
export const ArrowsHAlt = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsHAlt {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsMergeAltH = styled.i``
|
||||
|
||||
export const ArrowsMergeAltH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsMergeAltH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsMergeAltV = styled.i``
|
||||
|
||||
export const ArrowsMergeAltV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsMergeAltV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsPushDownLeft = styled.i``
|
||||
|
||||
export const ArrowsPushDownLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsPushDownLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsPushDownRight = styled.i``
|
||||
|
||||
export const ArrowsPushDownRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsPushDownRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsPushUpLeft = styled.i``
|
||||
|
||||
export const ArrowsPushUpLeft = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsPushUpLeft {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsPushUpRight = styled.i``
|
||||
|
||||
export const ArrowsPushUpRight = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsPushUpRight {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsResizeH = styled.i``
|
||||
|
||||
export const ArrowsResizeH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsResizeH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsResizeV = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 6px;
|
||||
height: 16px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
&::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
top: 0;
|
||||
}
|
||||
&::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
bottom: 0;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowsResizeV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsResizeV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,44 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsScrollH = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
transform: scale(var(--ggs, 1));
|
||||
width: 16px;
|
||||
height: 6px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
&::after {
|
||||
border-bottom: 2px solid;
|
||||
border-left: 2px solid;
|
||||
right: 0;
|
||||
}
|
||||
&::before {
|
||||
border-top: 2px solid;
|
||||
border-right: 2px solid;
|
||||
left: 0;
|
||||
}
|
||||
`
|
||||
|
||||
export const ArrowsScrollH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsScrollH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsScrollV = styled.i``
|
||||
|
||||
export const ArrowsScrollV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsScrollV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsShrinkH = styled.i``
|
||||
|
||||
export const ArrowsShrinkH = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsShrinkH {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsShrinkV = styled.i``
|
||||
|
||||
export const ArrowsShrinkV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsShrinkV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsV = styled.i``
|
||||
|
||||
export const ArrowsV = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsV {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledArrowsVAlt = styled.i``
|
||||
|
||||
export const ArrowsVAlt = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledArrowsVAlt {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,37 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAssign = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border-radius: 100px;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
box-shadow: -5px -5px 0 -3px, 5px 5px 0 -3px, 5px -5px 0 -3px, -5px 5px 0 -3px;
|
||||
left: -3px;
|
||||
top: -3px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Assign = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAssign {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAsterisk = styled.i``
|
||||
|
||||
export const Asterisk = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAsterisk {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,56 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAttachment = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border: 2px solid;
|
||||
border-top: 0;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
margin-top: 11px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
border: 2px solid;
|
||||
}
|
||||
&::after {
|
||||
border-bottom: 0;
|
||||
border-top-left-radius: 100px;
|
||||
border-top-right-radius: 100px;
|
||||
right: -2px;
|
||||
width: 10px;
|
||||
height: 14px;
|
||||
bottom: 8px;
|
||||
}
|
||||
&::before {
|
||||
width: 6px;
|
||||
height: 12px;
|
||||
border-top: 0;
|
||||
border-bottom-left-radius: 100px;
|
||||
border-bottom-right-radius: 100px;
|
||||
left: 2px;
|
||||
bottom: 4px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Attachment = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAttachment {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAttribution = styled.i``
|
||||
|
||||
export const Attribution = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAttribution {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledAwards = styled.i``
|
||||
|
||||
export const Awards = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledAwards {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,57 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledBackspace = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border: 2px solid;
|
||||
border-left: 0;
|
||||
border-top-right-radius: 2px;
|
||||
border-bottom-right-radius: 2px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
}
|
||||
&::before {
|
||||
background: linear-gradient(to left, currentColor 18px, transparent 0) no-repeat center
|
||||
center/10px 2px;
|
||||
border-right: 3px solid transparent;
|
||||
box-shadow: inset 0 0 0 2px;
|
||||
right: 2px;
|
||||
bottom: 1px;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-left: 3px solid transparent;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
&::after {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-top: 2px solid;
|
||||
border-left: 2px solid;
|
||||
border-top-left-radius: 1px;
|
||||
transform: rotate(-45deg);
|
||||
top: 0;
|
||||
left: -5px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Backspace = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledBackspace {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledBandAid = styled.i``
|
||||
|
||||
export const BandAid = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledBandAid {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledBanks = styled.i``
|
||||
|
||||
export const Banks = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledBanks {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,46 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledBattery = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border: 2px solid;
|
||||
border-radius: 3px;
|
||||
margin-left: -3px;
|
||||
}
|
||||
&::after,
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
height: 6px;
|
||||
background: currentColor;
|
||||
top: 1px;
|
||||
}
|
||||
&::before {
|
||||
right: -4px;
|
||||
border-radius: 3px;
|
||||
width: 4px;
|
||||
}
|
||||
&::after {
|
||||
width: 8px;
|
||||
left: 1px;
|
||||
}
|
||||
`
|
||||
|
||||
export const Battery = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledBattery {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
|
@ -1,39 +0,0 @@
|
|||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
|
||||
const StyledBatteryEmpty = styled.i`
|
||||
& {
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 12px;
|
||||
transform: scale(var(--ggs, 1));
|
||||
border: 2px solid;
|
||||
border-radius: 3px;
|
||||
margin-left: -3px;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
border-radius: 3px;
|
||||
width: 4px;
|
||||
height: 6px;
|
||||
right: -4px;
|
||||
top: 1px;
|
||||
background: currentColor;
|
||||
}
|
||||
`
|
||||
|
||||
export const BatteryEmpty = React.forwardRef<
|
||||
HTMLElement,
|
||||
React.DetailedHTMLProps<React.HtmlHTMLAttributes<HTMLElement>, HTMLElement>
|
||||
>((props, ref) => {
|
||||
return (
|
||||
<>
|
||||
<StyledBatteryEmpty {...props} ref={ref} />
|
||||
</>
|
||||
)
|
||||
})
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue