drone/web/src/components/ThreadSection/ThreadSection.module.scss
2023-04-10 15:00:23 -06:00

84 lines
1.4 KiB
SCSS

.thread {
margin-bottom: var(--spacing-medium);
--layout-spacing: var(--spacing-2) !important;
.content {
padding-left: 25px;
position: relative;
> ::before {
position: absolute;
top: -8px;
left: 7px;
content: '';
width: 1px;
height: calc(100% + 18px);
border: 1px dashed var(--grey-200);
opacity: 0.7;
}
&.hideGutter > ::before {
display: none;
}
}
}
.titleContent {
padding-left: 25px;
position: relative;
> ::before {
position: absolute;
top: 28px;
left: 15px;
content: '';
width: 1px;
height: 25px;
border: 1px dashed var(--grey-200);
opacity: 0.7;
z-index: 2;
}
}
.inCommentBox {
padding-left: 25px;
position: relative;
> ::after {
position: absolute;
bottom: -10px;
left: 15px;
content: '';
width: 1px;
height: 22px;
border: 1px dashed var(--grey-200);
opacity: 0.7;
z-index: 2;
}
}
.threadLessSpace {
margin-bottom: var(--spacing-small) !important;
--layout-spacing: var(--spacing-2) !important;
.content {
padding-left: 25px;
position: relative;
--layout-spacing: var(--spacing-2) !important;
> ::before {
position: absolute;
top: -8px;
left: 7px;
content: '';
width: 1px;
height: calc(100% + 18px);
border: 1px dashed var(--grey-200);
opacity: 0.7;
}
&.hideGutter > ::before {
display: none;
}
}
}