79 lines
1.2 KiB
CSS
79 lines
1.2 KiB
CSS
|
.palette {
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette div {
|
||
|
|
width: 50px;
|
||
|
|
height: 50px;
|
||
|
|
border: 1px solid black;
|
||
|
|
border-radius: 5px;
|
||
|
|
margin: 1em;
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-purple div.item-1 {
|
||
|
|
background-color: var(--purple-1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-purple div.item-2 {
|
||
|
|
background-color: var(--purple-2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-purple div.item-3 {
|
||
|
|
background-color: var(--purple-3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-purple div.item-4 {
|
||
|
|
background-color: var(--purple-4);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-purple div.item-5 {
|
||
|
|
background-color: var(--purple-5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-blue div.item-1 {
|
||
|
|
background-color: var(--blue-1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-blue div.item-2 {
|
||
|
|
background-color: var(--blue-2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-blue div.item-3 {
|
||
|
|
background-color: var(--blue-3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-blue div.item-4 {
|
||
|
|
background-color: var(--blue-4);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-blue div.item-5 {
|
||
|
|
background-color: var(--blue-5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-grey div.item-1 {
|
||
|
|
background-color: var(--grey-1);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-grey div.item-2 {
|
||
|
|
background-color: var(--grey-2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-grey div.item-3 {
|
||
|
|
background-color: var(--grey-3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-grey div.item-4 {
|
||
|
|
background-color: var(--grey-4);
|
||
|
|
}
|
||
|
|
|
||
|
|
.palette-grey div.item-5 {
|
||
|
|
background-color: var(--grey-5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.design_horizontal {
|
||
|
|
display: flex;
|
||
|
|
flex-flow: row;
|
||
|
|
}
|
||
|
|
|