mirror of
https://github.com/LBRYFoundation/lbry.com.git
synced 2025-08-23 17:47:26 +00:00
142 lines
2.8 KiB
SCSS
142 lines
2.8 KiB
SCSS
@import "global";
|
|
|
|
$color-roadmap-border: $color-primary;
|
|
$width-roadmap: 4px;
|
|
$width-roadmap-item: $width-roadmap - 1;
|
|
$width-date: 120px;
|
|
$radius-roadmap: 10px;
|
|
|
|
.roadmap-container
|
|
{
|
|
border-left: $width-roadmap solid $color-roadmap-border;
|
|
margin: $spacing-vertical 0 $spacing-vertical $width-date;
|
|
&:before, &:after
|
|
{
|
|
background: $color-roadmap-border;
|
|
content: "";
|
|
display: block;
|
|
position: relative;
|
|
height: $width-roadmap;
|
|
left: -2 * ($width-roadmap + 1);
|
|
width: $width-roadmap * 4;
|
|
}
|
|
&:before
|
|
{
|
|
top: -1 * ($width-roadmap);
|
|
}
|
|
&:after
|
|
{
|
|
bottom: -1 * ($width-roadmap);
|
|
}
|
|
}
|
|
|
|
.show-all-roadmap-groups
|
|
{
|
|
display: inline-block;
|
|
margin: $spacing-vertical 0 0;
|
|
}
|
|
|
|
.roadmap-group-closed
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
$title-spur: 8 * $width-roadmap;
|
|
|
|
.roadmap-group-title
|
|
{
|
|
&:before
|
|
{
|
|
border-top: $width-roadmap solid $color-roadmap-border;
|
|
content: "";
|
|
display: inline-block;
|
|
height: $width-roadmap;
|
|
margin-right: 10px;
|
|
vertical-align: middle;
|
|
width: $title-spur;
|
|
}
|
|
cursor: pointer;
|
|
font-weight: 400;
|
|
margin: $spacing-vertical * 2 0 $spacing-vertical * 1 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.roadmap-group-title-label
|
|
{
|
|
background: $color-roadmap-border;
|
|
@include border-radius($radius-roadmap);
|
|
color: rgba(255, 255, 255, 0.85);
|
|
display: inline-block;
|
|
letter-spacing: 0;
|
|
padding: 0 10px;
|
|
text-align: center;
|
|
width: calc(100% - #{$title-spur} - 20px);
|
|
}
|
|
|
|
.roadmap-item
|
|
{
|
|
$left-margin: 20px;
|
|
$item-padding: $spacing-vertical / 2;
|
|
margin-bottom: $spacing-vertical;
|
|
position: relative;
|
|
margin-left: $left-margin;
|
|
position: relative;
|
|
padding: $item-padding;
|
|
background: #f2f2f2;
|
|
@include border-radius($radius-roadmap);
|
|
&:before {
|
|
border-top: $width-roadmap-item solid $color-roadmap-border;
|
|
content: "";
|
|
position: absolute;
|
|
left: -1 * $left-margin;
|
|
top: 0.5 * ($font-size-h3) + $item-padding;
|
|
display: inline-block;
|
|
margin-top: $width-roadmap-item / 2;
|
|
height: $width-roadmap-item;
|
|
width: 10px;
|
|
}
|
|
}
|
|
|
|
.roadmap-item-date
|
|
{
|
|
display: inline-block;
|
|
position: absolute;
|
|
top: 0;
|
|
left: -1 * $width-date;
|
|
color: $color-meta-light;
|
|
line-height: 42px;
|
|
}
|
|
|
|
.roadmap-item-title
|
|
{
|
|
display: inline-block;
|
|
margin: 0;
|
|
}
|
|
|
|
.roadmap-item-content
|
|
{
|
|
font-size: 0.9em;
|
|
margin: 10px;
|
|
/* Paul, when you rebase on master and see this, these are temp rules I added to help the roadmap look only like lukewarm garbage rather than hot garbage*/
|
|
h3 {
|
|
font-size: $font-size-h4 !important;
|
|
margin-top: $spacing-vertical * 0.5 !important;
|
|
}
|
|
ul {
|
|
margin-left: 30px !important;
|
|
}
|
|
ul > li + li {
|
|
margin-top: $spacing-vertical * 0.25;
|
|
}
|
|
}
|
|
.roadmap-item-content a{@include anchor($color-primary);}
|
|
.roadmap-item-assignee
|
|
{
|
|
float: right;
|
|
font-size: 0.8em;
|
|
}
|
|
/*
|
|
.roadmap-item-closed .roadmap-item-content
|
|
{
|
|
display: none;
|
|
}*/
|