Files
grecia/app/assets/stylesheets/admin/budgets/actions.scss
Javi Martín 1a797f2808 Use multiplications instead of divisions in Sass variables
In the previous commit, we used the `calc` function when assiging CSS
properties in order to avoid warnings like:

```
Deprecation Warning: Using / for division outside of calc() is
deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div($global-width, 2) or calc($global-width / 2)
```

In cases like dividing by two, there's a third alternative: multiplying
by 0.5. We're applying this principle to all variable assignments where
we were using divisions, since using the `calc` function here would
sometimes result in errors due to these variables being used in
arithmetical operations. We aren't using `math.div` because it makes the
code harder to read.
2024-04-04 15:16:24 +02:00

68 lines
1.0 KiB
SCSS

.admin .budgets-actions {
> * {
$gap: $line-height;
$vertical-gap: $line-height * 0.5;
@include flex-with-gap($gap);
align-items: center;
flex-wrap: wrap;
margin-top: -$vertical-gap;
> * {
margin-top: $vertical-gap;
}
dt {
flex-basis: 12em;
}
&:only-child dt {
flex-basis: auto;
}
dd {
flex-basis: 20em;
flex-grow: 1;
max-width: calc(#{$global-width} * 3 / 4);
}
+ * {
border-top: $admin-border;
clip-path: inset(0 0 0 $gap);
margin-top: $line-height * 1.5;
padding-top: $line-height * 1.5;
}
}
button {
cursor: pointer;
width: 100%;
}
.calculate-winners-link {
@include hollow-button;
}
.ballots-link {
@include regular-button;
}
.destroy-link {
@include regular-button($alert-color);
&:hover,
&:focus {
background-color: $color-alert;
}
&[disabled] {
opacity: 0.4;
}
}
.calculate-winners-link,
.ballots-link,
.destroy-link {
margin-bottom: 0;
}
}