cddce21f7b
The interpolation of the rem-calc function made the code harder to read.
Besides, for new code we've already agreed upon using rem units instead
of `rem-calc`.
For instance, we had the following code:
```
width: calc(100% - #{2 * rem-calc(10)});
```
Now, `2 * rem-calc(10)` is the same as `rem-calc(20)`, but we were using
`2 *` to make it clear that this value was related to the value of the
`margin-left` property, which was `rem-calc(10)`.
IMHO using `0.625rem` for the margin and `2 * 0.625rem` for the width
the code is easier to read because there are no interpolation and no
complex operations involved.
46 lines
757 B
SCSS
46 lines
757 B
SCSS
.admin .budgets-table {
|
|
|
|
.budget-completed,
|
|
.budget-draft {
|
|
padding-left: calc(1em + 0.625rem);
|
|
position: relative;
|
|
|
|
&::before {
|
|
color: $admin-border-color;
|
|
left: rem-calc(4);
|
|
position: absolute;
|
|
transform: translateY(50%);
|
|
}
|
|
|
|
span {
|
|
color: $admin-text;
|
|
display: block;
|
|
font-size: $tiny-font-size;
|
|
font-weight: bold;
|
|
line-height: rem-calc(12);
|
|
}
|
|
}
|
|
|
|
.budget-completed {
|
|
@include has-fa-icon(lock, solid);
|
|
|
|
span {
|
|
text-transform: uppercase;
|
|
}
|
|
}
|
|
|
|
.budget-draft {
|
|
@include has-fa-icon(pencil-alt, solid);
|
|
|
|
span {
|
|
font-style: italic;
|
|
}
|
|
}
|
|
|
|
td time:last-of-type::after,
|
|
td small::before {
|
|
content: "";
|
|
display: block;
|
|
}
|
|
}
|