Fixed ordered list styles

This commit is contained in:
Piotr Janosz
2019-08-21 13:31:29 +02:00
committed by fabioberger
parent b17d12fe23
commit 078af36e0e

View File

@@ -1,29 +1,31 @@
import styled from 'styled-components';
import { docs} from 'ts/style/docs';
import { docs } from 'ts/style/docs';
export const OrderedList = styled.ol`
list-style-type: none;
counter-reset: tutorialSteps;
margin-bottom: ${docs.marginBottom};
list-style: none;
counter-reset: steps;
margin-bottom: ${docs.marginBottom};
li {
display: flex;
counter-increment: tutorialSteps;
position: relative;
counter-increment: steps;
padding-left: 48px;
margin-bottom: 0.8333rem;
font-size: 1rem;
line-height: 30px;
}
li:before {
border-radius: 50%;
background-color: rgba(0, 174, 153, 0.1);
content: counter(tutorialSteps);
display: flex;
align-items: center;
justify-content: center;
min-width: 30px;
height: 30px;
margin-right: 1rem;
&:before {
display: flex;
align-items: center;
justify-content: center;
position: absolute;
left: 0;
content: counter(steps);
border-radius: 50%;
background-color: rgba(0, 174, 153, 0.1);
min-width: 30px;
height: 30px;
}
}
`;