@fluent-windows/core
Version:
React components that inspired by Microsoft's Fluent Design System.
36 lines (35 loc) • 699 B
JavaScript
const root = theme => ({
display: 'inline-block',
borderRadius: '50%',
border: '1.5px solid',
borderColor: `${theme.colors.primary.default} ${theme.colors.primary.light3} ${theme.colors.primary.light3}`,
'@global': {
'@keyframes rotate': {
from: {
transform: 'rotate(0deg)'
},
to: {
transform: 'rotate(360deg)'
}
}
},
animation: '$rotate 1.3s cubic-bezier(0.5, 0.2, 0.3, 0.65) infinite'
});
const sizeSmall = {
width: 16,
height: 16
};
const sizeMedium = {
width: 20,
height: 20
};
const sizeLarge = {
width: 28,
height: 28
};
export const styles = theme => ({
root: root(theme),
sizeSmall,
sizeMedium,
sizeLarge
});