|
|
|
@ -117,7 +117,7 @@ $content-width: 840px; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
|
|
|
|
|
i.fa { |
|
|
|
|
margin-right: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
@ -186,7 +186,10 @@ $content-width: 840px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.content { |
|
|
|
|
padding: 55px 15px 20px 25px; |
|
|
|
|
padding-top: 55px; |
|
|
|
|
padding-bottom: 20px; |
|
|
|
|
padding-inline-start: 25px; |
|
|
|
|
padding-inline-end: 15px; |
|
|
|
|
|
|
|
|
|
@media screen and (max-width: $no-columns-breakpoint) { |
|
|
|
|
max-width: none; |
|
|
|
@ -202,11 +205,12 @@ $content-width: 840px; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
margin: -15px -15px 0 0; |
|
|
|
|
margin-top: -15px; |
|
|
|
|
margin-inline-end: -15px; |
|
|
|
|
|
|
|
|
|
& > * { |
|
|
|
|
margin-top: 15px; |
|
|
|
|
margin-right: 15px; |
|
|
|
|
margin-inline-end: 15px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -385,7 +389,7 @@ $content-width: 840px; |
|
|
|
|
z-index: 10; |
|
|
|
|
width: 100%; |
|
|
|
|
height: calc(100% - 56px); |
|
|
|
|
left: 0; |
|
|
|
|
inset-inline-start: 0; |
|
|
|
|
bottom: 0; |
|
|
|
|
overflow-y: auto; |
|
|
|
|
background: $ui-base-color; |
|
|
|
@ -470,10 +474,11 @@ body, |
|
|
|
|
.filters { |
|
|
|
|
display: flex; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
gap: 40px; |
|
|
|
|
|
|
|
|
|
.filter-subset { |
|
|
|
|
flex: 0 0 auto; |
|
|
|
|
margin: 0 40px 20px 0; |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
margin-bottom: 30px; |
|
|
|
@ -485,7 +490,7 @@ body, |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
display: inline-block; |
|
|
|
|
margin-right: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -563,7 +568,10 @@ body, |
|
|
|
|
|
|
|
|
|
& > strong { |
|
|
|
|
display: block; |
|
|
|
|
margin: 0 0 10px -5px; |
|
|
|
|
margin-top: 0; |
|
|
|
|
margin-bottom: 10px; |
|
|
|
|
margin-inline-end: 0; |
|
|
|
|
margin-inline-start: -5px; |
|
|
|
|
font-weight: 500; |
|
|
|
|
font-size: 14px; |
|
|
|
|
line-height: 18px; |
|
|
|
@ -588,7 +596,7 @@ body, |
|
|
|
|
|
|
|
|
|
.activity-stream { |
|
|
|
|
flex: 2 0 0; |
|
|
|
|
margin-right: 20px; |
|
|
|
|
margin-inline-end: 20px; |
|
|
|
|
max-width: calc(100% - 60px); |
|
|
|
|
|
|
|
|
|
.entry { |
|
|
|
@ -632,20 +640,23 @@ body, |
|
|
|
|
margin-bottom: 5px; |
|
|
|
|
|
|
|
|
|
#form_status_batch_action { |
|
|
|
|
margin: 0 5px 5px 0; |
|
|
|
|
margin-bottom: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
input.button { |
|
|
|
|
margin: 0 5px 5px 0; |
|
|
|
|
margin-bottom: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.media-spoiler-toggle-buttons { |
|
|
|
|
margin-left: auto; |
|
|
|
|
margin-inline-start: auto; |
|
|
|
|
|
|
|
|
|
.button { |
|
|
|
|
overflow: visible; |
|
|
|
|
margin: 0 0 5px 5px; |
|
|
|
|
margin-bottom: 5px; |
|
|
|
|
margin-inline-start: 5px; |
|
|
|
|
float: right; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -667,7 +678,7 @@ body, |
|
|
|
|
|
|
|
|
|
.special-action-button, |
|
|
|
|
.back-link { |
|
|
|
|
text-align: right; |
|
|
|
|
text-align: end; |
|
|
|
|
flex: 1 1 auto; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -685,7 +696,7 @@ body, |
|
|
|
|
display: block; |
|
|
|
|
line-height: 20px; |
|
|
|
|
padding: 15px; |
|
|
|
|
padding-left: 15px * 2 + 40px; |
|
|
|
|
padding-inline-start: 15px * 2 + 40px; |
|
|
|
|
background: $ui-base-color; |
|
|
|
|
border-bottom: 1px solid darken($ui-base-color, 8%); |
|
|
|
|
position: relative; |
|
|
|
@ -712,7 +723,7 @@ body, |
|
|
|
|
|
|
|
|
|
&__avatar { |
|
|
|
|
position: absolute; |
|
|
|
|
left: 15px; |
|
|
|
|
inset-inline-start: 15px; |
|
|
|
|
top: 15px; |
|
|
|
|
|
|
|
|
|
.avatar { |
|
|
|
@ -780,7 +791,7 @@ a.name-tag, |
|
|
|
|
.avatar { |
|
|
|
|
display: block; |
|
|
|
|
margin: 0; |
|
|
|
|
margin-right: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -794,7 +805,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
.speech-bubble { |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
border-left: 4px solid $ui-highlight-color; |
|
|
|
|
border-inline-start: 4px solid $ui-highlight-color; |
|
|
|
|
|
|
|
|
|
&.positive { |
|
|
|
|
border-left-color: $success-green; |
|
|
|
@ -810,7 +821,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
&__bubble { |
|
|
|
|
padding: 16px; |
|
|
|
|
padding-left: 14px; |
|
|
|
|
padding-inline-start: 14px; |
|
|
|
|
font-size: 15px; |
|
|
|
|
line-height: 20px; |
|
|
|
|
border-radius: 4px 4px 4px 0; |
|
|
|
@ -824,7 +835,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
&__owner { |
|
|
|
|
padding: 8px; |
|
|
|
|
padding-left: 12px; |
|
|
|
|
padding-inline-start: 12px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
time { |
|
|
|
@ -848,7 +859,7 @@ a.name-tag, |
|
|
|
|
border: 0; |
|
|
|
|
|
|
|
|
|
&__avatar-wrapper { |
|
|
|
|
margin-left: 0; |
|
|
|
|
margin-inline-start: 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -857,7 +868,7 @@ a.name-tag, |
|
|
|
|
font-weight: 500; |
|
|
|
|
color: $darker-text-color; |
|
|
|
|
text-transform: uppercase; |
|
|
|
|
text-align: right; |
|
|
|
|
text-align: end; |
|
|
|
|
|
|
|
|
|
a { |
|
|
|
|
color: inherit; |
|
|
|
@ -908,7 +919,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
&__icon { |
|
|
|
|
color: $dark-text-color; |
|
|
|
|
margin-right: 4px; |
|
|
|
|
margin-inline-end: 4px; |
|
|
|
|
font-weight: 500; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -1106,7 +1117,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
> h4 { |
|
|
|
|
position: sticky; |
|
|
|
|
left: 0; |
|
|
|
|
inset-inline-start: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&__table { |
|
|
|
@ -1118,7 +1129,7 @@ a.name-tag, |
|
|
|
|
&__date { |
|
|
|
|
white-space: nowrap; |
|
|
|
|
padding: 10px 0; |
|
|
|
|
text-align: left; |
|
|
|
|
text-align: start; |
|
|
|
|
min-width: 120px; |
|
|
|
|
|
|
|
|
|
&.retention__table__average { |
|
|
|
@ -1176,7 +1187,7 @@ a.name-tag, |
|
|
|
|
|
|
|
|
|
&__total { |
|
|
|
|
display: block; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
margin-inline-end: 10px; |
|
|
|
|
font-weight: 500; |
|
|
|
|
font-size: 28px; |
|
|
|
|
color: $primary-text-color; |
|
|
|
@ -1278,7 +1289,7 @@ a.sparkline { |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&__value { |
|
|
|
|
text-align: right; |
|
|
|
|
text-align: end; |
|
|
|
|
color: $darker-text-color; |
|
|
|
|
padding: 11px 10px; |
|
|
|
|
} |
|
|
|
@ -1289,7 +1300,7 @@ a.sparkline { |
|
|
|
|
height: 8px; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
background: $ui-highlight-color; |
|
|
|
|
margin-right: 10px; |
|
|
|
|
margin-inline-end: 10px; |
|
|
|
|
|
|
|
|
|
@for $i from 0 through 10 { |
|
|
|
|
&--#{10 * $i} { |
|
|
|
@ -1325,7 +1336,7 @@ a.sparkline { |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&__rules { |
|
|
|
|
margin-left: 30px; |
|
|
|
|
margin-inline-start: 30px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -1447,7 +1458,7 @@ a.sparkline { |
|
|
|
|
height: 21px; |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 0; |
|
|
|
|
right: 15px; |
|
|
|
|
inset-inline-end: 15px; |
|
|
|
|
background: linear-gradient(to left, $ui-base-color, transparent); |
|
|
|
|
pointer-events: none; |
|
|
|
|
} |
|
|
|
@ -1527,7 +1538,7 @@ a.sparkline { |
|
|
|
|
background: $ui-base-color; |
|
|
|
|
position: relative; |
|
|
|
|
padding: 15px; |
|
|
|
|
padding-left: 15px * 2 + 40px; |
|
|
|
|
padding-inline-start: 15px * 2 + 40px; |
|
|
|
|
border-bottom: 1px solid darken($ui-base-color, 8%); |
|
|
|
|
|
|
|
|
|
&:first-child { |
|
|
|
@ -1547,7 +1558,7 @@ a.sparkline { |
|
|
|
|
|
|
|
|
|
&__avatar { |
|
|
|
|
position: absolute; |
|
|
|
|
left: 15px; |
|
|
|
|
inset-inline-start: 15px; |
|
|
|
|
top: 15px; |
|
|
|
|
border-radius: 4px; |
|
|
|
|
width: 40px; |
|
|
|
@ -1563,7 +1574,7 @@ a.sparkline { |
|
|
|
|
.username { |
|
|
|
|
color: $primary-text-color; |
|
|
|
|
font-weight: 500; |
|
|
|
|
margin-right: 5px; |
|
|
|
|
margin-inline-end: 5px; |
|
|
|
|
|
|
|
|
|
a { |
|
|
|
|
color: inherit; |
|
|
|
@ -1578,7 +1589,7 @@ a.sparkline { |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
time { |
|
|
|
|
margin-left: 5px; |
|
|
|
|
margin-inline-start: 5px; |
|
|
|
|
vertical-align: baseline; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -1613,8 +1624,8 @@ a.sparkline { |
|
|
|
|
&__actions { |
|
|
|
|
position: absolute; |
|
|
|
|
top: 15px; |
|
|
|
|
right: 15px; |
|
|
|
|
text-align: right; |
|
|
|
|
inset-inline-end: 15px; |
|
|
|
|
text-align: end; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
@ -1637,7 +1648,7 @@ a.sparkline { |
|
|
|
|
flex: 0 0 auto; |
|
|
|
|
width: 200px; |
|
|
|
|
padding: 15px; |
|
|
|
|
padding-right: 0; |
|
|
|
|
padding-inline-end: 0; |
|
|
|
|
|
|
|
|
|
.button { |
|
|
|
|
display: block; |
|
|
|
@ -1723,7 +1734,7 @@ a.sparkline { |
|
|
|
|
|
|
|
|
|
&__rules { |
|
|
|
|
list-style: disc; |
|
|
|
|
padding-left: 15px; |
|
|
|
|
padding-inline-start: 15px; |
|
|
|
|
margin-bottom: 20px; |
|
|
|
|
color: $darker-text-color; |
|
|
|
|
|
|
|
|
@ -1812,7 +1823,7 @@ a.sparkline { |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
counter-increment: step 1; |
|
|
|
|
padding-left: 2.5rem; |
|
|
|
|
padding-inline-start: 2.5rem; |
|
|
|
|
padding-bottom: 8px; |
|
|
|
|
position: relative; |
|
|
|
|
margin-bottom: 8px; |
|
|
|
@ -1822,7 +1833,7 @@ a.sparkline { |
|
|
|
|
content: counter(step); |
|
|
|
|
font-size: 0.625rem; |
|
|
|
|
font-weight: 500; |
|
|
|
|
left: 0; |
|
|
|
|
inset-inline-start: 0; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
@ -1841,7 +1852,7 @@ a.sparkline { |
|
|
|
|
background: $highlight-text-color; |
|
|
|
|
bottom: 0; |
|
|
|
|
top: calc(1.875rem + 1px); |
|
|
|
|
left: 0.6875rem; |
|
|
|
|
inset-inline-start: 0.6875rem; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|