57 lines
1.0 KiB
CSS
57 lines
1.0 KiB
CSS
.list {
|
|
list-style-type: none;
|
|
}
|
|
|
|
.linkListItem {
|
|
border: 1px solid var(--Base-Border-Subtle);
|
|
background-color: var(--Surface-Primary-Default);
|
|
}
|
|
|
|
.linkListItem + .linkListItem {
|
|
border-top: none;
|
|
}
|
|
|
|
.linkListItem:first-child {
|
|
border-radius: var(--Corner-Radius-md) var(--Corner-Radius-md) 0 0;
|
|
}
|
|
|
|
.linkListItem:last-child {
|
|
border-radius: 0 0 var(--Corner-Radius-md) var(--Corner-Radius-md);
|
|
}
|
|
|
|
.linkListItem:hover {
|
|
background-color: var(--Surface-Primary-Hover);
|
|
}
|
|
|
|
.content {
|
|
display: grid;
|
|
align-items: center;
|
|
padding: var(--Space-x2);
|
|
gap: var(--Space-x2);
|
|
text-decoration: none;
|
|
color: var(--Text-Interactive-Default);
|
|
}
|
|
|
|
.graphic {
|
|
grid-template-columns: 80px 1fr auto;
|
|
}
|
|
|
|
.noGraphic {
|
|
grid-template-columns: 1fr auto;
|
|
}
|
|
|
|
.illustrationWrapper {
|
|
position: relative;
|
|
border-radius: var(--Corner-Radius-sm);
|
|
background-color: var(--Surface-Primary-Hover-Accent);
|
|
width: 80px;
|
|
height: 80px;
|
|
}
|
|
|
|
.illustration {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|