Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
 Zoë Bijl
|
7c2e1f0984 |
+2
-13
@@ -11,30 +11,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||
|
||||
- Added documentation for `yarn dev` (#75)
|
||||
- Added an .editorconfig (#78)
|
||||
- Added a CHANGELOG.md basaed on “Keep a Changelog” (#80)
|
||||
- Added a changelog basaed on “Keep a Changelog” (#80)
|
||||
|
||||
### Changed
|
||||
|
||||
- Preserve ‘mastodon-settings’ in localStorage (#66)
|
||||
- Redesigned the login page (#76)
|
||||
- Changed all icons to the Phosphor icon set (#77)
|
||||
- Changed AUTHORS.md to reflect fork contributors (#89)
|
||||
- Changed all icons with the Phosphor icon set (#77)
|
||||
|
||||
### Fixed
|
||||
|
||||
- Updated caniuse-lite browserlist (#82)
|
||||
- Fixed various linter issues (#85)
|
||||
- Fixed various CSS issues (#100)
|
||||
- Updated Prettier to 3.6.2 (#86)
|
||||
- Updated Yarn to 4.10.3 (#90)
|
||||
- Updated Webpack to 5.102.1 (#83)
|
||||
- Updated ESlint to 9.37.0 (#88)
|
||||
|
||||
### Removed
|
||||
|
||||
- Removed FontAwesome (#99)
|
||||
- Removed unused CSS files (#99)
|
||||
- Removed various unused assets
|
||||
|
||||
## [0.5.0] - 2025-07-14
|
||||
|
||||
|
||||
@@ -6,6 +6,7 @@ import { defineMessages, FormattedMessage, injectIntl } from "react-intl";
|
||||
|
||||
import ImmutablePropTypes from "react-immutable-proptypes";
|
||||
|
||||
import { languages as preloadedLanguages } from "flavours/glitch/initial_state";
|
||||
|
||||
// Our imports
|
||||
import LocalSettingsPageItem from "./item";
|
||||
@@ -35,6 +36,12 @@ const messages = defineMessages({
|
||||
direct: { id: "privacy.direct.short", defaultMessage: "Mentioned people only" },
|
||||
});
|
||||
|
||||
const langs = []
|
||||
|
||||
for (const lang of preloadedLanguages) {
|
||||
langs.push({"value": lang[0], "label": lang[1]})
|
||||
}
|
||||
|
||||
class LocalSettingsPage extends PureComponent {
|
||||
|
||||
static propTypes = {
|
||||
@@ -203,6 +210,16 @@ class LocalSettingsPage extends PureComponent {
|
||||
({ intl, onChange, settings }) => (
|
||||
<div className='glitch local-settings__page compose_box_opts'>
|
||||
<h1><FormattedMessage id='settings.compose_box_opts' defaultMessage='Compose box' /></h1>
|
||||
<LocalSettingsPageItem
|
||||
settings={settings}
|
||||
item={["default_language"]}
|
||||
id='mastodon-settings--default-language'
|
||||
select={langs}
|
||||
onChange={onChange}
|
||||
>
|
||||
<FormattedMessage id='settings.default_language' defaultMessage='Default language for new toots' />
|
||||
</LocalSettingsPageItem>
|
||||
|
||||
<LocalSettingsPageItem
|
||||
settings={settings}
|
||||
item={["always_show_spoilers_field"]}
|
||||
|
||||
@@ -39,7 +39,7 @@ export default class LocalSettingsPageItem extends PureComponent {
|
||||
|
||||
render () {
|
||||
const { handleChange } = this;
|
||||
const { settings, item, id, inputProps, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
|
||||
const { settings, item, id, inputProps, select, options, children, dependsOn, dependsOnNot, placeholder, disabled } = this.props;
|
||||
let enabled = !disabled;
|
||||
|
||||
if (dependsOn) {
|
||||
@@ -52,6 +52,31 @@ export default class LocalSettingsPageItem extends PureComponent {
|
||||
enabled = enabled && !settings.getIn(dependsOnNot[i]);
|
||||
}
|
||||
}
|
||||
|
||||
if (select && select.length > 0) {
|
||||
const currentValue = settings.getIn(item);
|
||||
const optionElems = select && select.length > 0 && select.map((opt) => {
|
||||
return (
|
||||
<option
|
||||
value={opt.value}
|
||||
selected={currentValue === opt.value}
|
||||
>
|
||||
{opt.label}
|
||||
</option>
|
||||
)
|
||||
})
|
||||
return (
|
||||
<div className='glitch local-settings__page__item select'>
|
||||
<fieldset>
|
||||
<label>Default language:
|
||||
<select>
|
||||
{optionElems}
|
||||
</select>
|
||||
</label>
|
||||
</fieldset>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (options && options.length > 0) {
|
||||
const currentValue = settings.getIn(item);
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "variables" as *;
|
||||
|
||||
@mixin avatar-radius() {
|
||||
border-radius: $ui-avatar-border-size;
|
||||
background-position: 50%;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
$maximum-width: 1235px;
|
||||
$fluid-breakpoint: $maximum-width + 20px;
|
||||
|
||||
@@ -30,7 +26,7 @@ $fluid-breakpoint: $maximum-width + 20px;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 1em 1.75em;
|
||||
padding-inline-start: 3em;
|
||||
font-weight: 500;
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
$emojis-requiring-inversion: "back" "copyright" "curly_loop" "currency_exchange"
|
||||
"end" "heavy_check_mark" "heavy_division_sign" "heavy_dollar_sign"
|
||||
"heavy_minus_sign" "heavy_multiplication_x" "heavy_plus_sign" "on"
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.card {
|
||||
& > a {
|
||||
display: block;
|
||||
@@ -14,7 +10,7 @@
|
||||
&:active,
|
||||
&:focus {
|
||||
.card__bar {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -22,7 +18,7 @@
|
||||
&__img {
|
||||
height: 130px;
|
||||
position: relative;
|
||||
background: color.adjust($ui-base-color, $lightness: -12%);
|
||||
background: darken($ui-base-color, 12%);
|
||||
|
||||
img {
|
||||
display: block;
|
||||
@@ -43,7 +39,7 @@
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
|
||||
.avatar {
|
||||
flex: 0 0 auto;
|
||||
@@ -61,7 +57,7 @@
|
||||
border-radius: 4px;
|
||||
@include avatar-radius;
|
||||
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
@@ -153,7 +149,7 @@
|
||||
|
||||
.disabled {
|
||||
cursor: default;
|
||||
color: color.adjust($inverted-text-color, $lightness: 10%);
|
||||
color: lighten($inverted-text-color, 10%);
|
||||
}
|
||||
|
||||
@media screen and (width <= 700px) {
|
||||
@@ -219,22 +215,22 @@
|
||||
}
|
||||
|
||||
&.admin {
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
background-color: rgba(color.adjust($error-red, $lightness: 12%), 0.1);
|
||||
border-color: rgba(color.adjust($error-red, $lightness: 12%), 0.5);
|
||||
color: lighten($error-red, 12%);
|
||||
background-color: rgba(lighten($error-red, 12%), 0.1);
|
||||
border-color: rgba(lighten($error-red, 12%), 0.5);
|
||||
}
|
||||
}
|
||||
|
||||
.simple_form .not_recommended {
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
background-color: rgba(color.adjust($error-red, $lightness: 12%), 0.1);
|
||||
border-color: rgba(color.adjust($error-red, $lightness: 12%), 0.5);
|
||||
color: lighten($error-red, 12%);
|
||||
background-color: rgba(lighten($error-red, 12%), 0.1);
|
||||
border-color: rgba(lighten($error-red, 12%), 0.5);
|
||||
}
|
||||
|
||||
.simple_form .glitch_only {
|
||||
color: color.adjust($warning-red, $lightness: 12%);
|
||||
background-color: rgba(color.adjust($warning-red, $lightness: 12%), 0.1);
|
||||
border-color: rgba(color.adjust($warning-red, $lightness: 12%), 0.5);
|
||||
color: lighten($warning-red, 12%);
|
||||
background-color: rgba(lighten($warning-red, 12%), 0.1);
|
||||
border-color: rgba(lighten($warning-red, 12%), 0.5);
|
||||
}
|
||||
|
||||
.account__header__fields {
|
||||
@@ -242,14 +238,14 @@
|
||||
padding: 0;
|
||||
margin: 15px -15px -15px;
|
||||
border: 0 none;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-top: 1px solid lighten($ui-base-color, 12%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 12%);
|
||||
font-size: 14px;
|
||||
line-height: 20px;
|
||||
|
||||
dl {
|
||||
display: flex;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
dt,
|
||||
@@ -268,7 +264,7 @@
|
||||
width: 120px;
|
||||
flex: 0 0 auto;
|
||||
color: $secondary-text-color;
|
||||
background: rgba(color.adjust($ui-base-color, $lightness: -8%), 0.5);
|
||||
background: rgba(darken($ui-base-color, 8%), 0.5);
|
||||
}
|
||||
|
||||
dd {
|
||||
@@ -337,7 +333,7 @@
|
||||
}
|
||||
|
||||
.batch-table__row--muted {
|
||||
color: color.adjust($ui-base-color, $lightness: 26%);
|
||||
color: lighten($ui-base-color, 26%);
|
||||
}
|
||||
|
||||
.batch-table__row--muted .pending-account__header,
|
||||
@@ -346,7 +342,7 @@
|
||||
&,
|
||||
a,
|
||||
strong {
|
||||
color: color.adjust($ui-base-color, $lightness: 26%);
|
||||
color: lighten($ui-base-color, 26%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -358,7 +354,7 @@
|
||||
tbody td.accounts-table__extra,
|
||||
&__count,
|
||||
&__count small {
|
||||
color: color.adjust($ui-base-color, $lightness: 26%);
|
||||
color: lighten($ui-base-color, 26%);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,4 @@
|
||||
@use "sass:color";
|
||||
@use "sass:math";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
$no-columns-breakpoint: 600px;
|
||||
$sidebar-width: 240px;
|
||||
@@ -34,8 +31,8 @@ $content-width: 840px;
|
||||
|
||||
&__toggle {
|
||||
display: none;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
align-items: center;
|
||||
|
||||
&__logo {
|
||||
@@ -125,7 +122,7 @@ $content-width: 840px;
|
||||
|
||||
&:hover {
|
||||
color: $primary-text-color;
|
||||
background-color: color.adjust($ui-base-color, $lightness: -5%);
|
||||
background-color: darken($ui-base-color, 5%);
|
||||
transition: all 100ms linear;
|
||||
transition-property: color, background-color;
|
||||
}
|
||||
@@ -136,7 +133,7 @@ $content-width: 840px;
|
||||
}
|
||||
|
||||
ul {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border-radius: 0 0 0 4px;
|
||||
margin: 0;
|
||||
|
||||
@@ -242,7 +239,7 @@ $content-width: 840px;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
@@ -295,7 +292,7 @@ $content-width: 840px;
|
||||
color: $darker-text-color;
|
||||
padding-bottom: 8px;
|
||||
margin-bottom: 8px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
h6 {
|
||||
@@ -396,7 +393,7 @@ $content-width: 840px;
|
||||
ul a,
|
||||
ul ul a {
|
||||
border-radius: 0;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
transition: none;
|
||||
|
||||
&:hover {
|
||||
@@ -524,7 +521,7 @@ body,
|
||||
|
||||
&:hover {
|
||||
color: $primary-text-color;
|
||||
border-bottom: 2px solid color.adjust($ui-base-color, $lightness: 5%);
|
||||
border-bottom: 2px solid lighten($ui-base-color, 5%);
|
||||
}
|
||||
|
||||
&.selected {
|
||||
@@ -695,7 +692,7 @@ body,
|
||||
padding: 15px;
|
||||
padding-inline-start: 15px * 2 + 40px;
|
||||
background: $ui-base-color;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
color: $darker-text-color;
|
||||
@@ -715,7 +712,7 @@ body,
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&__avatar {
|
||||
@@ -769,7 +766,7 @@ a.inline-name-tag,
|
||||
&.suspended {
|
||||
.username {
|
||||
text-decoration: line-through;
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
color: lighten($error-red, 12%);
|
||||
}
|
||||
|
||||
.avatar {
|
||||
@@ -809,7 +806,7 @@ a.name-tag,
|
||||
}
|
||||
|
||||
&.negative {
|
||||
border-left-color: color.adjust($error-red, $lightness: 12%);
|
||||
border-left-color: lighten($error-red, 12%);
|
||||
}
|
||||
|
||||
&.warning {
|
||||
@@ -874,7 +871,7 @@ a.name-tag,
|
||||
&:focus,
|
||||
&:hover,
|
||||
&:active {
|
||||
color: color.adjust($darker-text-color, $lightness: 8%);
|
||||
color: lighten($darker-text-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -888,10 +885,10 @@ a.name-tag,
|
||||
&__item {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: -4%);
|
||||
border-top: 1px solid darken($ui-base-color, 4%);
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
}
|
||||
|
||||
&__reported-by,
|
||||
@@ -963,7 +960,7 @@ a.name-tag,
|
||||
|
||||
.account__header__fields,
|
||||
.account__header__content {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
border-radius: 4px;
|
||||
height: 100%;
|
||||
}
|
||||
@@ -1000,7 +997,7 @@ a.name-tag,
|
||||
.filters-list__item {
|
||||
padding: 15px 0;
|
||||
background: $ui-base-color;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border: 1px solid lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
@@ -1011,13 +1008,13 @@ a.name-tag,
|
||||
|
||||
.announcements-list,
|
||||
.filters-list {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border: 1px solid lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
|
||||
&__item {
|
||||
padding: 15px 0;
|
||||
background: $ui-base-color;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
|
||||
&__title {
|
||||
padding: 0 15px;
|
||||
@@ -1092,7 +1089,7 @@ a.name-tag,
|
||||
|
||||
&.expired {
|
||||
.expiration {
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
color: lighten($error-red, 12%);
|
||||
}
|
||||
|
||||
.permissions-list__item__icon {
|
||||
@@ -1168,7 +1165,7 @@ a.name-tag,
|
||||
.sparkline {
|
||||
display: block;
|
||||
text-decoration: none;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
@@ -1231,7 +1228,7 @@ a.name-tag,
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
stroke: color.adjust($highlight-text-color, $lightness: 6%) !important;
|
||||
stroke: lighten($highlight-text-color, 6%) !important;
|
||||
fill: none !important;
|
||||
}
|
||||
}
|
||||
@@ -1241,17 +1238,17 @@ a.sparkline {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 6%);
|
||||
background: lighten($ui-base-color, 6%);
|
||||
}
|
||||
}
|
||||
|
||||
.skeleton {
|
||||
background-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background-color: lighten($ui-base-color, 8%);
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
color.adjust($ui-base-color, $lightness: 8%),
|
||||
color.adjust($ui-base-color, $lightness: 12%),
|
||||
color.adjust($ui-base-color, $lightness: 8%)
|
||||
lighten($ui-base-color, 8%),
|
||||
lighten($ui-base-color, 12%),
|
||||
lighten($ui-base-color, 8%)
|
||||
);
|
||||
background-size: 200px 100%;
|
||||
background-repeat: no-repeat;
|
||||
@@ -1278,7 +1275,7 @@ a.sparkline {
|
||||
}
|
||||
|
||||
&__item {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
|
||||
&__key {
|
||||
font-weight: 500;
|
||||
@@ -1331,7 +1328,7 @@ a.sparkline {
|
||||
|
||||
&__category {
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
@@ -1359,7 +1356,7 @@ a.sparkline {
|
||||
|
||||
&__details {
|
||||
&__item {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 15px 0;
|
||||
|
||||
&:last-child {
|
||||
@@ -1408,7 +1405,7 @@ a.sparkline {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1426,7 +1423,7 @@ a.sparkline {
|
||||
margin: 0;
|
||||
width: 56px;
|
||||
height: 56px;
|
||||
background-color: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background-color: darken($ui-base-color, 8%);
|
||||
border-radius: 8px;
|
||||
border: 1px solid $ui-base-color;
|
||||
}
|
||||
@@ -1545,7 +1542,7 @@ a.sparkline {
|
||||
position: relative;
|
||||
padding: 15px;
|
||||
padding-inline-start: 15px * 2 + 40px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&:first-child {
|
||||
border-top-left-radius: 4px;
|
||||
@@ -1559,7 +1556,7 @@ a.sparkline {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background-color: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&__avatar {
|
||||
@@ -1637,13 +1634,13 @@ a.sparkline {
|
||||
}
|
||||
|
||||
.report-actions {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&__item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
line-height: 18px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
@@ -1755,15 +1752,15 @@ a.sparkline {
|
||||
|
||||
&__statuses-list {
|
||||
border-radius: 4px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
font-size: 13px;
|
||||
line-height: 18px;
|
||||
overflow: hidden;
|
||||
|
||||
&__item {
|
||||
padding: 16px;
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
@@ -1807,7 +1804,7 @@ a.sparkline {
|
||||
flex: 0 0 auto;
|
||||
width: 4px;
|
||||
height: 21px;
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
margin: 0 2px;
|
||||
border-radius: 2px;
|
||||
|
||||
@@ -1879,7 +1876,7 @@ a.sparkline {
|
||||
}
|
||||
|
||||
.status {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border: 1px solid lighten($ui-base-color, 4%);
|
||||
background: $ui-base-color;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
@@ -1,15 +1,9 @@
|
||||
@use "sass:meta";
|
||||
@use "sass:string";
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
@function hex-color($color) {
|
||||
@if meta.type-of($color) == "color" {
|
||||
$color: string.slice(color.ie-hex-str($color), 4);
|
||||
@if type-of($color) == "color" {
|
||||
$color: str-slice(ie-hex-str($color), 4);
|
||||
}
|
||||
|
||||
@return "%23" + string.unquote($color);
|
||||
@return "%23" + unquote($color);
|
||||
}
|
||||
|
||||
body {
|
||||
@@ -115,7 +109,7 @@ body {
|
||||
}
|
||||
|
||||
&.embed {
|
||||
background: color.scale($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
margin: 0;
|
||||
padding-bottom: 0;
|
||||
|
||||
@@ -128,7 +122,7 @@ body {
|
||||
}
|
||||
|
||||
&.admin {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@@ -212,7 +206,7 @@ button {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
line-height: 1.7;
|
||||
color: color.adjust($error-red, $lightness: 4%);
|
||||
color: lighten($error-red, 4%);
|
||||
text-align: center;
|
||||
|
||||
& > div {
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "variables" as *;
|
||||
|
||||
.logo {
|
||||
color: $primary-text-color;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.image {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
@@ -88,7 +84,7 @@
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 1.9;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-radius: 8px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
@@ -114,7 +110,7 @@
|
||||
}
|
||||
|
||||
&__meta {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
margin-bottom: 30px;
|
||||
@@ -130,7 +126,7 @@
|
||||
width: 0;
|
||||
border: 0;
|
||||
border-style: solid;
|
||||
border-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-color: lighten($ui-base-color, 8%);
|
||||
border-left-width: 1px;
|
||||
min-height: calc(100% - 60px);
|
||||
flex: 0 0 auto;
|
||||
@@ -235,7 +231,7 @@
|
||||
line-height: 22px;
|
||||
padding: 20px;
|
||||
border-radius: 4px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
color: $highlight-text-color;
|
||||
cursor: pointer;
|
||||
}
|
||||
@@ -245,7 +241,7 @@
|
||||
}
|
||||
|
||||
&__body {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border: 1px solid lighten($ui-base-color, 4%);
|
||||
border-top: 0;
|
||||
padding: 20px;
|
||||
font-size: 15px;
|
||||
@@ -255,18 +251,18 @@
|
||||
|
||||
&__domain-blocks {
|
||||
margin-top: 30px;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border: 1px solid lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
|
||||
&__domain {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
padding: 10px;
|
||||
font-size: 15px;
|
||||
color: $darker-text-color;
|
||||
|
||||
&:nth-child(2n) {
|
||||
background: color.adjust($ui-base-color, $lightness: -2%);
|
||||
background: darken($ui-base-color, 2%);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
|
||||
@@ -1,10 +1,6 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.account {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
||||
@@ -169,7 +165,7 @@
|
||||
|
||||
.account__header__wrapper {
|
||||
flex: 0 0 auto;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.account__disclaimer {
|
||||
@@ -207,8 +203,8 @@
|
||||
}
|
||||
|
||||
.account__action-bar {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
line-height: 36px;
|
||||
overflow: hidden;
|
||||
flex: 0 0 auto;
|
||||
@@ -226,7 +222,7 @@
|
||||
text-decoration: none;
|
||||
overflow: hidden;
|
||||
flex: 0 1 100%;
|
||||
border-inline-start: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-inline-start: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 10px 0;
|
||||
border-bottom: 4px solid transparent;
|
||||
|
||||
@@ -282,7 +278,7 @@
|
||||
padding: 8px 10px;
|
||||
padding-inline-start: 68px;
|
||||
position: relative;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
min-height: 54px;
|
||||
|
||||
&__details {
|
||||
@@ -328,9 +324,9 @@
|
||||
.account--panel {
|
||||
display: flex;
|
||||
gap: 5px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
flex-direction: row;
|
||||
padding: 5px;
|
||||
}
|
||||
@@ -485,9 +481,9 @@
|
||||
.account__moved-note {
|
||||
padding: 14px 10px;
|
||||
padding-bottom: 16px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&__message {
|
||||
position: relative;
|
||||
@@ -567,7 +563,7 @@
|
||||
overflow: hidden;
|
||||
height: 145px;
|
||||
position: relative;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
|
||||
img {
|
||||
object-fit: cover;
|
||||
@@ -580,9 +576,9 @@
|
||||
|
||||
&__bar {
|
||||
position: relative;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
padding: 5px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 12%);
|
||||
|
||||
.avatar {
|
||||
display: block;
|
||||
@@ -590,8 +586,8 @@
|
||||
width: 94px;
|
||||
|
||||
.account__avatar {
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 2px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
border: 2px solid lighten($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -711,10 +707,10 @@
|
||||
|
||||
.account__header__fields {
|
||||
margin: 0;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-top: 1px solid lighten($ui-base-color, 12%);
|
||||
|
||||
a {
|
||||
color: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
color: lighten($ui-highlight-color, 8%);
|
||||
}
|
||||
|
||||
dl:first-child .verified {
|
||||
@@ -757,8 +753,8 @@
|
||||
flex-direction: column;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-top: 1px solid lighten($ui-base-color, 12%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 12%);
|
||||
|
||||
&__header {
|
||||
display: flex;
|
||||
@@ -787,7 +783,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: color.adjust($darker-text-color, $lightness: 7%);
|
||||
color: lighten($darker-text-color, 7%);
|
||||
background-color: rgba($darker-text-color, 0.15);
|
||||
}
|
||||
|
||||
@@ -796,7 +792,7 @@
|
||||
}
|
||||
|
||||
&[disabled] {
|
||||
color: color.adjust($darker-text-color, $lightness: -13%);
|
||||
color: darken($darker-text-color, 13%);
|
||||
background-color: transparent;
|
||||
cursor: default;
|
||||
}
|
||||
@@ -841,7 +837,7 @@
|
||||
.follow-request-banner,
|
||||
.account-memorial-banner {
|
||||
padding: 20px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.announcements__item__content {
|
||||
word-wrap: break-word;
|
||||
overflow-y: auto;
|
||||
@@ -46,7 +42,7 @@
|
||||
}
|
||||
|
||||
.announcements {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
@@ -130,7 +126,7 @@
|
||||
|
||||
&__item {
|
||||
flex-shrink: 0;
|
||||
background: color.adjust($ui-base-color, $lightness: 12%);
|
||||
background: lighten($ui-base-color, 12%);
|
||||
border: 0;
|
||||
border-radius: 3px;
|
||||
margin: 2px;
|
||||
@@ -173,26 +169,26 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 16%);
|
||||
background: lighten($ui-base-color, 16%);
|
||||
transition: all 200ms ease-out;
|
||||
transition-property: background-color, color;
|
||||
|
||||
&__count {
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
&.active {
|
||||
transition: all 100ms ease-in;
|
||||
transition-property: background-color, color;
|
||||
background-color: color.mix(
|
||||
color.adjust($ui-base-color, $lightness: 12%),
|
||||
background-color: mix(
|
||||
lighten($ui-base-color, 12%),
|
||||
$ui-highlight-color,
|
||||
80%
|
||||
);
|
||||
|
||||
.reactions-bar__item__count {
|
||||
color: color.adjust($highlight-text-color, $lightness: 8%);
|
||||
color: lighten($highlight-text-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -223,7 +219,7 @@
|
||||
&:active,
|
||||
&:focus {
|
||||
opacity: 1;
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
transition: all 200ms ease-out;
|
||||
transition-property: background-color, color;
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.column__wrapper {
|
||||
display: flex;
|
||||
flex: 1 1 auto;
|
||||
@@ -112,7 +108,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.tabs-bar__wrapper {
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
position: sticky;
|
||||
top: $ui-header-height;
|
||||
z-index: 2;
|
||||
@@ -174,7 +170,7 @@ $ui-header-height: 55px;
|
||||
.column-back-button {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-radius: 4px 4px 0 0;
|
||||
color: $highlight-text-color;
|
||||
cursor: pointer;
|
||||
@@ -227,7 +223,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.column-link {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
color: $primary-text-color;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
@@ -239,7 +235,7 @@ $ui-header-height: 55px;
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 11%);
|
||||
background: lighten($ui-base-color, 11%);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -331,7 +327,7 @@ $ui-header-height: 55px;
|
||||
color: $darker-text-color;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.column-header > button,
|
||||
@@ -378,7 +374,7 @@ $ui-header-height: 55px;
|
||||
&:focus-visible,
|
||||
&:hover,
|
||||
&.active {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&:active {
|
||||
@@ -422,7 +418,7 @@ $ui-header-height: 55px;
|
||||
&:hover,
|
||||
&.active {
|
||||
color: inherit;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&:active {
|
||||
@@ -520,7 +516,7 @@ $ui-header-height: 55px;
|
||||
height: 0;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-top: 1px solid lighten($ui-base-color, 12%);
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
@@ -536,7 +532,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.column-header__collapsible-inner {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
@@ -632,11 +628,11 @@ $ui-header-height: 55px;
|
||||
&:not([disabled]) {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: color.adjust($ui-base-color, $lightness: -10%);
|
||||
background-color: darken($ui-base-color, 10%);
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: color.adjust($ui-highlight-color, $lightness: -2%);
|
||||
background-color: darken($ui-highlight-color, 2%);
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
@@ -688,7 +684,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.follow_requests-unlocked_explanation {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
contain: initial;
|
||||
flex-grow: 0;
|
||||
}
|
||||
@@ -744,7 +740,7 @@ $ui-header-height: 55px;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
|
||||
label {
|
||||
flex: 1 1 auto;
|
||||
@@ -771,7 +767,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.column-settings__outer {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
@@ -797,7 +793,7 @@ $ui-header-height: 55px;
|
||||
@include search-input;
|
||||
|
||||
&::placeholder {
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
|
||||
&::-moz-focus-inner {
|
||||
@@ -811,7 +807,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
@media screen and (width <= 600px) {
|
||||
@@ -830,7 +826,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
&__multi-value {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
|
||||
&__remove {
|
||||
cursor: pointer;
|
||||
@@ -838,8 +834,8 @@ $ui-header-height: 55px;
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 12%);
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 12%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -859,12 +855,12 @@ $ui-header-height: 55px;
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: color.adjust($dark-text-color, $lightness: 4%);
|
||||
color: lighten($dark-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
&__indicator-separator {
|
||||
background-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&__menu {
|
||||
@@ -885,7 +881,7 @@ $ui-header-height: 55px;
|
||||
|
||||
&--is-focused,
|
||||
&--is-selected {
|
||||
background: color.adjust($ui-secondary-color, $lightness: -10%);
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -899,7 +895,7 @@ $ui-header-height: 55px;
|
||||
|
||||
.notifications-permission-banner {
|
||||
padding: 30px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@@ -977,8 +973,8 @@ $ui-header-height: 55px;
|
||||
|
||||
.column-list {
|
||||
margin: 0 20px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: color.adjust($ui-base-color, $lightness: -2%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
background: darken($ui-base-color, 2%);
|
||||
border-radius: 4px;
|
||||
|
||||
&__empty-message {
|
||||
@@ -1093,7 +1089,7 @@ $ui-header-height: 55px;
|
||||
}
|
||||
|
||||
.hashtag-header {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
font-size: 17px;
|
||||
line-height: 22px;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.compose-form {
|
||||
padding: 10px;
|
||||
|
||||
@@ -311,7 +307,7 @@
|
||||
&:focus,
|
||||
&:active,
|
||||
&.selected {
|
||||
background: color.adjust($ui-secondary-color, $lightness: -10%);
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
|
||||
> .account,
|
||||
@@ -402,7 +398,7 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($secondary-text-color, $lightness: 7%);
|
||||
color: lighten($secondary-text-color, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -473,7 +469,7 @@
|
||||
border-radius: 6px;
|
||||
width: 100%;
|
||||
height: 6px;
|
||||
background: color.adjust($simple-background-color, $lightness: -8%);
|
||||
background: darken($simple-background-color, 8%);
|
||||
}
|
||||
|
||||
.upload-progress__tracker {
|
||||
@@ -499,7 +495,7 @@
|
||||
padding: 10px;
|
||||
border-radius: 0 0 4px 4px;
|
||||
color: $action-button-color;
|
||||
background: color.adjust($simple-background-color, $lightness: -8%);
|
||||
background: darken($simple-background-color, 8%);
|
||||
}
|
||||
|
||||
.compose-form__buttons {
|
||||
@@ -609,7 +605,7 @@
|
||||
}
|
||||
|
||||
&.active:hover {
|
||||
background: color.adjust($ui-highlight-color, $lightness: 4%);
|
||||
background: lighten($ui-highlight-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -691,7 +687,7 @@
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-highlight-color, $lightness: 4%);
|
||||
background: lighten($ui-highlight-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,23 +1,19 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.scrollable .account-card {
|
||||
margin: 10px;
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.scrollable .account-card__title__avatar {
|
||||
img,
|
||||
.account__avatar {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
.scrollable .account-card__bio::after {
|
||||
background: linear-gradient(
|
||||
to left,
|
||||
color.adjust($ui-base-color, $lightness: 8%),
|
||||
lighten($ui-base-color, 8%),
|
||||
transparent
|
||||
);
|
||||
}
|
||||
@@ -65,8 +61,8 @@
|
||||
vertical-align: middle;
|
||||
|
||||
&.checked {
|
||||
border-color: color.adjust($ui-highlight-color, $lightness: 4%);
|
||||
background: color.adjust($ui-highlight-color, $lightness: 4%);
|
||||
border-color: lighten($ui-highlight-color, 4%);
|
||||
background: lighten($ui-highlight-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,9 +1,6 @@
|
||||
@use "sass:color";
|
||||
@use "../variables" as *;
|
||||
|
||||
.domain {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
.domain__domain-name {
|
||||
flex: 1 1 auto;
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
$doodle-background: #d9e1e8;
|
||||
|
||||
.doodle-modal {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.drawer {
|
||||
display: flex;
|
||||
gap: var(--size-layout-gap);
|
||||
@@ -100,7 +96,7 @@
|
||||
&:focus-visible,
|
||||
&:hover,
|
||||
&.active {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -167,15 +163,15 @@
|
||||
}
|
||||
|
||||
.search-results__section {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
}
|
||||
|
||||
&__header {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 15px;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
@@ -216,7 +212,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: color.adjust($secondary-text-color, $lightness: 4%);
|
||||
color: lighten($secondary-text-color, 4%);
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
@@ -253,7 +249,7 @@
|
||||
}
|
||||
|
||||
.drawer__inner__mastodon {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%)
|
||||
background: lighten($ui-base-color, 4%)
|
||||
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z"/></svg>')
|
||||
no-repeat bottom / 100% auto;
|
||||
flex: 1;
|
||||
@@ -284,7 +280,7 @@
|
||||
}
|
||||
|
||||
.pseudo-drawer {
|
||||
background: color.adjust($ui-base-color, $lightness: 13%);
|
||||
background: lighten($ui-base-color, 13%);
|
||||
font-size: 13px;
|
||||
text-align: start;
|
||||
}
|
||||
@@ -308,7 +304,7 @@
|
||||
bottom /
|
||||
100%
|
||||
auto,
|
||||
color.adjust($ui-base-color, $lightness: 4%);
|
||||
lighten($ui-base-color, 4%);
|
||||
} @else {
|
||||
background:
|
||||
url("~flavours/glitch/images/wave-drawer-glitched.png")
|
||||
@@ -316,7 +312,7 @@
|
||||
bottom /
|
||||
100%
|
||||
auto,
|
||||
color.adjust($ui-base-color, $lightness: 4%);
|
||||
lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
& > .mastodon {
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.emojione {
|
||||
font-size: inherit;
|
||||
vertical-align: middle;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.emoji-mart {
|
||||
&,
|
||||
* {
|
||||
@@ -19,7 +15,7 @@
|
||||
}
|
||||
|
||||
.emoji-mart-bar {
|
||||
border: 0 solid color.adjust($ui-secondary-color, $lightness: -8%);
|
||||
border: 0 solid darken($ui-secondary-color, 8%);
|
||||
|
||||
&:first-child {
|
||||
border-bottom-width: 1px;
|
||||
@@ -56,7 +52,7 @@
|
||||
border: 0;
|
||||
|
||||
&:hover {
|
||||
color: color.adjust($lighter-text-color, $lightness: -4%);
|
||||
color: darken($lighter-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -64,7 +60,7 @@
|
||||
color: $highlight-text-color;
|
||||
|
||||
&:hover {
|
||||
color: color.adjust($highlight-text-color, $lightness: -4%);
|
||||
color: darken($highlight-text-color, 4%);
|
||||
}
|
||||
|
||||
.emoji-mart-anchor-bar {
|
||||
@@ -78,7 +74,7 @@
|
||||
inset-inline-start: 0;
|
||||
width: 100%;
|
||||
height: 3px;
|
||||
background-color: color.adjust($ui-highlight-color, $lightness: -3%);
|
||||
background-color: darken($ui-highlight-color, 3%);
|
||||
}
|
||||
|
||||
.emoji-mart-anchors {
|
||||
|
||||
@@ -1,13 +1,9 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.account-card__header {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.explore__search-header {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
@@ -18,12 +14,12 @@
|
||||
}
|
||||
|
||||
.search__input {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.search__popout {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.search .fa {
|
||||
@@ -49,7 +45,7 @@
|
||||
color: $primary-text-color;
|
||||
text-decoration: none;
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
gap: 15px;
|
||||
|
||||
&:last-child {
|
||||
|
||||
@@ -1,26 +1,26 @@
|
||||
@use "misc";
|
||||
@use "boost";
|
||||
@use "accounts";
|
||||
@use "domains";
|
||||
@use "status";
|
||||
@use "modal";
|
||||
@use "compose_form";
|
||||
@use "columns";
|
||||
@use "regeneration_indicator";
|
||||
@use "directory";
|
||||
@use "search";
|
||||
@use "emoji";
|
||||
@use "doodle";
|
||||
@use "drawer";
|
||||
@use "media";
|
||||
@use "sensitive";
|
||||
@use "lists";
|
||||
@use "emoji_picker";
|
||||
@use "local_settings";
|
||||
@use "single_column";
|
||||
@use "announcements";
|
||||
@use "explore";
|
||||
@use "scrollbars";
|
||||
@use "signed_out";
|
||||
@use "privacy_policy";
|
||||
@use "about";
|
||||
@import "misc";
|
||||
@import "boost";
|
||||
@import "accounts";
|
||||
@import "domains";
|
||||
@import "status";
|
||||
@import "modal";
|
||||
@import "compose_form";
|
||||
@import "columns";
|
||||
@import "regeneration_indicator";
|
||||
@import "directory";
|
||||
@import "search";
|
||||
@import "emoji";
|
||||
@import "doodle";
|
||||
@import "drawer";
|
||||
@import "media";
|
||||
@import "sensitive";
|
||||
@import "lists";
|
||||
@import "emoji_picker";
|
||||
@import "local_settings";
|
||||
@import "single_column";
|
||||
@import "announcements";
|
||||
@import "explore";
|
||||
@import "scrollbars";
|
||||
@import "signed_out";
|
||||
@import "privacy_policy";
|
||||
@import "about";
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.list-editor {
|
||||
background: $ui-base-color;
|
||||
flex-direction: column;
|
||||
@@ -16,7 +12,7 @@
|
||||
|
||||
h4 {
|
||||
padding: 15px 0;
|
||||
background: color.adjust($ui-base-color, $lightness: 13%);
|
||||
background: lighten($ui-base-color, 13%);
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
@@ -69,11 +65,11 @@
|
||||
}
|
||||
|
||||
&__account {
|
||||
background: color.adjust($ui-base-color, $lightness: 13%);
|
||||
background: lighten($ui-base-color, 13%);
|
||||
}
|
||||
|
||||
&__lists {
|
||||
background: color.adjust($ui-base-color, $lightness: 13%);
|
||||
background: lighten($ui-base-color, 13%);
|
||||
height: 50vh;
|
||||
border-radius: 0 0 8px 8px;
|
||||
overflow-y: auto;
|
||||
@@ -81,7 +77,7 @@
|
||||
|
||||
.list {
|
||||
padding: 10px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.list__wrapper {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.glitch.local-settings {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -68,7 +64,7 @@
|
||||
font-size: inherit;
|
||||
text-align: start;
|
||||
text-decoration: none;
|
||||
background: color.adjust($ui-secondary-color, $lightness: 8%);
|
||||
background: lighten($ui-secondary-color, 8%);
|
||||
cursor: pointer;
|
||||
transition: background 0.3s;
|
||||
|
||||
@@ -95,7 +91,7 @@
|
||||
}
|
||||
|
||||
.glitch.local-settings__navigation {
|
||||
background: color.adjust($ui-secondary-color, $lightness: 8%);
|
||||
background: lighten($ui-secondary-color, 8%);
|
||||
width: 212px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.video-error-cover {
|
||||
align-items: center;
|
||||
background: $base-overlay-background;
|
||||
@@ -27,7 +23,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: color.adjust($darker-text-color, $lightness: 8%);
|
||||
color: lighten($darker-text-color, 8%);
|
||||
}
|
||||
|
||||
.status__content > & {
|
||||
@@ -389,7 +385,7 @@
|
||||
overflow: hidden;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
border-radius: 4px;
|
||||
padding-bottom: 44px;
|
||||
width: 100%;
|
||||
@@ -558,7 +554,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
color: color.adjust($darker-text-color, $lightness: 7%);
|
||||
color: lighten($darker-text-color, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -694,7 +690,7 @@
|
||||
inset-inline-start: 0;
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
background: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
background: lighten($ui-highlight-color, 8%);
|
||||
}
|
||||
|
||||
&__handle {
|
||||
@@ -707,7 +703,7 @@
|
||||
inset-inline-start: 0;
|
||||
margin-inline-start: -6px;
|
||||
transform: translate(0, -50%);
|
||||
background: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
background: lighten($ui-highlight-color, 8%);
|
||||
box-shadow: 1px 2px 6px rgba($base-shadow-color, 0.2);
|
||||
opacity: 0;
|
||||
|
||||
@@ -761,7 +757,7 @@
|
||||
height: 4px;
|
||||
border-radius: 4px;
|
||||
top: 14px;
|
||||
background: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
background: lighten($ui-highlight-color, 8%);
|
||||
}
|
||||
|
||||
&__buffer {
|
||||
@@ -777,7 +773,7 @@
|
||||
height: 12px;
|
||||
top: 10px;
|
||||
margin-inline-start: -6px;
|
||||
background: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
background: lighten($ui-highlight-color, 8%);
|
||||
box-shadow: 1px 2px 6px rgba($base-shadow-color, 0.2);
|
||||
|
||||
.no-reduce-motion & {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.app-body {
|
||||
-webkit-overflow-scrolling: touch;
|
||||
-ms-overflow-style: -ms-autohiding-scrollbar;
|
||||
@@ -173,7 +169,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus-visible {
|
||||
color: color.adjust($action-button-color, $lightness: 7%);
|
||||
color: lighten($action-button-color, 7%);
|
||||
background-color: rgba($action-button-color, 0.15);
|
||||
transition: all 200ms ease-out;
|
||||
transition-property: background-color, color;
|
||||
@@ -218,7 +214,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus-visible {
|
||||
color: color.adjust($lighter-text-color, $lightness: -7%);
|
||||
color: darken($lighter-text-color, 7%);
|
||||
background-color: rgba($lighter-text-color, 0.15);
|
||||
}
|
||||
|
||||
@@ -234,7 +230,7 @@
|
||||
color: $highlight-text-color;
|
||||
|
||||
&.disabled {
|
||||
color: color.adjust($highlight-text-color, $lightness: 13%);
|
||||
color: lighten($highlight-text-color, 13%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -292,7 +288,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus-visible {
|
||||
color: color.adjust($lighter-text-color, $lightness: -7%);
|
||||
color: darken($lighter-text-color, 7%);
|
||||
background-color: rgba($lighter-text-color, 0.15);
|
||||
transition: all 200ms ease-out;
|
||||
transition-property: background-color, color;
|
||||
@@ -303,7 +299,7 @@
|
||||
}
|
||||
|
||||
&.disabled {
|
||||
color: color.adjust($lighter-text-color, $lightness: 20%);
|
||||
color: lighten($lighter-text-color, 20%);
|
||||
background-color: transparent;
|
||||
cursor: default;
|
||||
}
|
||||
@@ -705,7 +701,7 @@ body > [data-popper-placement] {
|
||||
.tabs-bar {
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
flex: 0 0 auto;
|
||||
overflow-y: auto;
|
||||
}
|
||||
@@ -720,7 +716,7 @@ body > [data-popper-placement] {
|
||||
text-align: center;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
border-bottom: 2px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 2px solid lighten($ui-base-color, 8%);
|
||||
transition: all 50ms linear;
|
||||
transition-property: border-bottom, background, color;
|
||||
|
||||
@@ -733,8 +729,8 @@ body > [data-popper-placement] {
|
||||
&:focus,
|
||||
&:active {
|
||||
@include multi-columns("screen and (min-width: 631px)") {
|
||||
background: color.adjust($ui-base-color, $lightness: 14%);
|
||||
border-bottom-color: color.adjust($ui-base-color, $lightness: 14%);
|
||||
background: lighten($ui-base-color, 14%);
|
||||
border-bottom-color: lighten($ui-base-color, 14%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -762,7 +758,7 @@ body > [data-popper-placement] {
|
||||
inset-inline-start: 9px;
|
||||
top: -13px;
|
||||
background: $ui-highlight-color;
|
||||
border: 2px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 2px solid lighten($ui-base-color, 8%);
|
||||
padding: 1px 6px;
|
||||
border-radius: 6px;
|
||||
font-size: 10px;
|
||||
@@ -784,7 +780,7 @@ body > [data-popper-placement] {
|
||||
}
|
||||
|
||||
.column-link--transparent .icon-with-badge__badge {
|
||||
border-color: color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-color: darken($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.scrollable {
|
||||
@@ -865,11 +861,11 @@ body > [data-popper-placement] {
|
||||
|
||||
.react-toggle:is(:hover, :focus-within):not(.react-toggle--disabled)
|
||||
.react-toggle-track {
|
||||
background-color: color.adjust($ui-base-color, $lightness: -10%);
|
||||
background-color: darken($ui-base-color, 10%);
|
||||
}
|
||||
|
||||
.react-toggle--checked .react-toggle-track {
|
||||
background-color: color.adjust($ui-highlight-color, $lightness: -2%);
|
||||
background-color: darken($ui-highlight-color, 2%);
|
||||
}
|
||||
|
||||
.react-toggle--checked:is(:hover, :focus-within):not(.react-toggle--disabled)
|
||||
@@ -922,7 +918,7 @@ body > [data-popper-placement] {
|
||||
height: 22px;
|
||||
border: 1px solid $ui-base-color;
|
||||
border-radius: 50%;
|
||||
background-color: color.adjust($simple-background-color, $lightness: -2%);
|
||||
background-color: darken($simple-background-color, 2%);
|
||||
box-sizing: border-box;
|
||||
transition: all 0.25s ease;
|
||||
transition-property: border-color, left;
|
||||
@@ -967,7 +963,7 @@ body > [data-popper-placement] {
|
||||
margin-top: 10px;
|
||||
|
||||
h4 {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 10px;
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
@@ -1033,8 +1029,8 @@ body > [data-popper-placement] {
|
||||
kbd {
|
||||
display: inline-block;
|
||||
padding: 3px 5px;
|
||||
background-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -4%);
|
||||
background-color: lighten($ui-base-color, 8%);
|
||||
border: 1px solid darken($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1063,7 +1059,7 @@ body > [data-popper-placement] {
|
||||
|
||||
&.light {
|
||||
color: $inverted-text-color;
|
||||
border-bottom: 2px solid color.adjust($ui-base-color, $lightness: 27%);
|
||||
border-bottom: 2px solid lighten($ui-base-color, 27%);
|
||||
|
||||
&:focus,
|
||||
&:active {
|
||||
@@ -1097,7 +1093,7 @@ button.icon-button.active i.fa-retweet {
|
||||
}
|
||||
|
||||
.reduce-motion button.icon-button.disabled i.fa-retweet {
|
||||
color: color.adjust($action-button-color, $lightness: -13%);
|
||||
color: darken($action-button-color, 13%);
|
||||
}
|
||||
|
||||
.load-more {
|
||||
@@ -1116,12 +1112,12 @@ button.icon-button.active i.fa-retweet {
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
}
|
||||
}
|
||||
|
||||
.load-gap {
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.timeline-hint {
|
||||
@@ -1144,7 +1140,7 @@ button.icon-button.active i.fa-retweet {
|
||||
&:focus,
|
||||
&:active {
|
||||
text-decoration: underline;
|
||||
color: color.adjust($highlight-text-color, $lightness: 4%);
|
||||
color: lighten($highlight-text-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1181,8 +1177,8 @@ button.icon-button.active i.fa-retweet {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-inline-start: 1px solid color.adjust($ui-base-color, $lightness: 20%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
border-inline-start: 1px solid lighten($ui-base-color, 20%);
|
||||
box-shadow: 0 0 5px black;
|
||||
border-bottom: 1px solid $ui-base-color;
|
||||
}
|
||||
@@ -1236,7 +1232,7 @@ button.icon-button.active i.fa-retweet {
|
||||
}
|
||||
|
||||
.circular-progress {
|
||||
color: color.adjust($ui-base-color, $lightness: 26%);
|
||||
color: lighten($ui-base-color, 26%);
|
||||
animation: 1.4s linear 0s infinite normal none running simple-rotate;
|
||||
|
||||
circle {
|
||||
@@ -1528,12 +1524,12 @@ button.icon-button.active i.fa-retweet {
|
||||
|
||||
.conversation {
|
||||
display: flex;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 5px;
|
||||
padding-bottom: 0;
|
||||
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
@@ -1601,10 +1597,10 @@ button.icon-button.active i.fa-retweet {
|
||||
}
|
||||
|
||||
&--unread {
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.conversation__content__info {
|
||||
|
||||
@@ -1,9 +1,5 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.modal-container--preloader {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.modal-root {
|
||||
@@ -138,7 +134,7 @@
|
||||
.onboarding-modal__paginator,
|
||||
.error-modal__footer {
|
||||
flex: 0 0 auto;
|
||||
background: color.adjust($ui-secondary-color, $lightness: -8%);
|
||||
background: darken($ui-secondary-color, 8%);
|
||||
display: flex;
|
||||
padding: 25px;
|
||||
|
||||
@@ -162,8 +158,8 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($lighter-text-color, $lightness: -4%);
|
||||
background-color: color.adjust($ui-secondary-color, $lightness: -16%);
|
||||
color: darken($lighter-text-color, 4%);
|
||||
background-color: darken($ui-secondary-color, 16%);
|
||||
}
|
||||
|
||||
&.onboarding-modal__done,
|
||||
@@ -173,7 +169,7 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($inverted-text-color, $lightness: 4%);
|
||||
color: lighten($inverted-text-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -194,17 +190,17 @@
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 14px;
|
||||
background: color.adjust($ui-secondary-color, $lightness: -16%);
|
||||
background: darken($ui-secondary-color, 16%);
|
||||
margin: 0 3px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-secondary-color, $lightness: -18%);
|
||||
background: darken($ui-secondary-color, 18%);
|
||||
}
|
||||
|
||||
&.active {
|
||||
cursor: default;
|
||||
background: color.adjust($ui-secondary-color, $lightness: -24%);
|
||||
background: darken($ui-secondary-color, 24%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -235,7 +231,7 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($highlight-text-color, $lightness: 4%);
|
||||
color: lighten($highlight-text-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -333,7 +329,7 @@
|
||||
}
|
||||
|
||||
.figure {
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
color: $secondary-text-color;
|
||||
margin-bottom: 20px;
|
||||
border-radius: 4px;
|
||||
@@ -425,7 +421,7 @@
|
||||
.mute-modal,
|
||||
.block-modal,
|
||||
.compare-history-modal {
|
||||
background: color.adjust($ui-secondary-color, $lightness: 8%);
|
||||
background: lighten($ui-secondary-color, 8%);
|
||||
color: $inverted-text-color;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
@@ -459,7 +455,7 @@
|
||||
}
|
||||
|
||||
.status__content__spoiler-link {
|
||||
color: color.adjust($secondary-text-color, $lightness: 8%);
|
||||
color: lighten($secondary-text-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -541,7 +537,7 @@
|
||||
max-width: 90vw;
|
||||
width: 480px;
|
||||
height: 80vh;
|
||||
background: color.adjust($ui-secondary-color, $lightness: 8%);
|
||||
background: lighten($ui-secondary-color, 8%);
|
||||
color: $inverted-text-color;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
@@ -581,7 +577,7 @@
|
||||
&__lead {
|
||||
font-size: 17px;
|
||||
line-height: 22px;
|
||||
color: color.adjust($inverted-text-color, $lightness: 16%);
|
||||
color: lighten($inverted-text-color, 16%);
|
||||
margin-bottom: 30px;
|
||||
|
||||
a {
|
||||
@@ -624,7 +620,7 @@
|
||||
background: $ui-primary-color;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-primary-color, $lightness: 8%);
|
||||
background: lighten($ui-primary-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -643,7 +639,7 @@
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
border-color: color.adjust($inverted-text-color, $lightness: 15%);
|
||||
border-color: lighten($inverted-text-color, 15%);
|
||||
border-width: 4px;
|
||||
}
|
||||
|
||||
@@ -664,7 +660,7 @@
|
||||
|
||||
& > .poll__option__text {
|
||||
font-size: 13px;
|
||||
color: color.adjust($inverted-text-color, $lightness: 16%);
|
||||
color: lighten($inverted-text-color, 16%);
|
||||
|
||||
strong {
|
||||
font-size: 17px;
|
||||
@@ -833,7 +829,7 @@
|
||||
margin-bottom: 10px;
|
||||
|
||||
&:focus {
|
||||
border: 1px solid color.adjust($ui-secondary-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-secondary-color, 8%);
|
||||
}
|
||||
|
||||
&__wrapper {
|
||||
@@ -982,7 +978,7 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($lighter-text-color, $lightness: -4%);
|
||||
color: darken($lighter-text-color, 4%);
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
@@ -1026,9 +1022,9 @@
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
background: $simple-background-color
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($simple-background-color, $lightness: - 14%))}'/></svg>")
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(darken($simple-background-color, 14%))}'/></svg>")
|
||||
no-repeat right 8px center / auto 16px;
|
||||
border: 1px solid color.adjust($simple-background-color, $lightness: -14%);
|
||||
border: 1px solid darken($simple-background-color, 14%);
|
||||
border-radius: 4px;
|
||||
padding: 6px 10px;
|
||||
padding-inline-end: 30px;
|
||||
@@ -1163,7 +1159,7 @@
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
@media screen and (width <= 600px) {
|
||||
@@ -1368,7 +1364,7 @@ img.modal-warning {
|
||||
&__input {
|
||||
@include search-input;
|
||||
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
padding: 4px 6px;
|
||||
color: $primary-text-color;
|
||||
font-size: 16px;
|
||||
@@ -1385,7 +1381,7 @@ img.modal-warning {
|
||||
flex: 1 1 auto;
|
||||
|
||||
&::placeholder {
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
|
||||
&:focus {
|
||||
@@ -1402,12 +1398,12 @@ img.modal-warning {
|
||||
margin-top: -1px;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&.focused &__input {
|
||||
border-color: $highlight-text-color;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
&.invalid &__input {
|
||||
@@ -1475,7 +1471,7 @@ img.modal-warning {
|
||||
input {
|
||||
display: block;
|
||||
font-family: inherit;
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
border: 1px solid $highlight-text-color;
|
||||
color: $darker-text-color;
|
||||
border-radius: 4px;
|
||||
@@ -1488,7 +1484,7 @@ img.modal-warning {
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.privacy-policy {
|
||||
background: $ui-base-color;
|
||||
padding: 20px;
|
||||
@@ -173,14 +169,14 @@
|
||||
|
||||
code {
|
||||
font-size: 0.875em;
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
border-radius: 4px;
|
||||
padding: 0.2em 0.3em;
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top: 1px solid lighten($ui-base-color, 4%);
|
||||
margin-top: 3em;
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.regeneration-indicator {
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
|
||||
@@ -1,10 +1,6 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
/* Scrollbars */
|
||||
html {
|
||||
scrollbar-color: color.adjust($ui-base-color, $lightness: 4%)
|
||||
scrollbar-color: lighten($ui-base-color, 4%)
|
||||
rgba($base-overlay-background, 0.1);
|
||||
}
|
||||
|
||||
@@ -14,17 +10,17 @@ html {
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border: 0 none $base-border-color;
|
||||
border-radius: 50px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: 6%);
|
||||
background: lighten($ui-base-color, 6%);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-track {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.search {
|
||||
position: relative;
|
||||
}
|
||||
@@ -59,7 +55,7 @@
|
||||
|
||||
&:focus-visible,
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: -10%);
|
||||
background: darken($ui-base-color, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -172,7 +168,7 @@
|
||||
color: $dark-text-color;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@@ -185,8 +181,8 @@
|
||||
.trends {
|
||||
&__header {
|
||||
color: $dark-text-color;
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 4%);
|
||||
font-weight: 500;
|
||||
padding: 15px;
|
||||
font-size: 16px;
|
||||
@@ -202,7 +198,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
gap: 15px;
|
||||
|
||||
&:last-child {
|
||||
@@ -259,7 +255,7 @@
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
stroke: color.adjust($highlight-text-color, $lightness: 6%) !important;
|
||||
stroke: lighten($highlight-text-color, 6%) !important;
|
||||
fill: none !important;
|
||||
}
|
||||
}
|
||||
@@ -283,37 +279,31 @@
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
stroke: color.adjust($gold-star, $lightness: 6%) !important;
|
||||
stroke: lighten($gold-star, 6%) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--disabled {
|
||||
.trends__item__name {
|
||||
color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
color: lighten($ui-base-color, 12%);
|
||||
|
||||
a {
|
||||
color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
color: lighten($ui-base-color, 12%);
|
||||
}
|
||||
}
|
||||
|
||||
.trends__item__current {
|
||||
color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
color: lighten($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
.trends__item__sparkline {
|
||||
path:first-child {
|
||||
fill: rgba(
|
||||
color.adjust($ui-base-color, $lightness: 12%),
|
||||
0.25
|
||||
) !important;
|
||||
fill: rgba(lighten($ui-base-color, 12%), 0.25) !important;
|
||||
}
|
||||
|
||||
path:last-child {
|
||||
stroke: color.adjust(
|
||||
color.adjust($ui-base-color, $lightness: 12%),
|
||||
$lightness: 6%
|
||||
) !important;
|
||||
stroke: lighten(lighten($ui-base-color, 12%), 6%) !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "../variables" as *;
|
||||
|
||||
.sensitive-info {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.sign-in-banner {
|
||||
padding: 10px;
|
||||
|
||||
@@ -18,7 +14,7 @@
|
||||
text-decoration: underline;
|
||||
|
||||
.fa {
|
||||
color: color.adjust($dark-text-color, $lightness: 7%);
|
||||
color: lighten($dark-text-color, 7%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,8 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "columns" as *;
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
.compose-panel {
|
||||
width: 285px;
|
||||
margin-top: 10px;
|
||||
@@ -83,7 +78,7 @@
|
||||
flex: 0 0 auto;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top: 1px solid lighten($ui-base-color, 4%);
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
@@ -265,8 +260,7 @@
|
||||
.navigation-panel {
|
||||
margin: 0;
|
||||
background: $ui-base-color;
|
||||
border-inline-start: 1px solid
|
||||
color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-inline-start: 1px solid lighten($ui-base-color, 8%);
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
@@ -284,7 +278,7 @@
|
||||
.layout-single-column .ui__header {
|
||||
display: flex;
|
||||
background: $ui-base-color;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.layout-single-column {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../mixins" as *;
|
||||
@use "../variables" as *;
|
||||
|
||||
@keyframes spring-flip-in {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
@@ -89,7 +85,7 @@
|
||||
text-decoration: underline;
|
||||
|
||||
.fa {
|
||||
color: color.adjust($dark-text-color, $lightness: 7%);
|
||||
color: lighten($dark-text-color, 7%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -153,7 +149,7 @@
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.notification-follow,
|
||||
@@ -161,7 +157,7 @@
|
||||
position: relative;
|
||||
|
||||
// same like Status
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
.account {
|
||||
border-bottom: 0 none;
|
||||
@@ -171,7 +167,7 @@
|
||||
.focusable {
|
||||
&:focus {
|
||||
outline: 0;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
|
||||
&.status.status-direct.muted {
|
||||
background: transparent;
|
||||
@@ -179,7 +175,7 @@
|
||||
|
||||
.detailed-status,
|
||||
.detailed-status__action-bar {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -191,7 +187,7 @@
|
||||
padding: 15px;
|
||||
position: relative;
|
||||
height: auto;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
cursor: auto;
|
||||
|
||||
@supports (-ms-overflow-style: -ms-autohiding-scrollbar) {
|
||||
@@ -219,9 +215,9 @@
|
||||
}
|
||||
|
||||
&.status-direct {
|
||||
--color-status-bg: #{color.mix($ui-base-color, $ui-highlight-color, 95%)};
|
||||
--color-status-bg: #{mix($ui-base-color, $ui-highlight-color, 95%)};
|
||||
|
||||
border-bottom-color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-bottom-color: lighten($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
&.light {
|
||||
@@ -253,7 +249,7 @@
|
||||
background: $ui-primary-color;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-primary-color, $lightness: 8%);
|
||||
background: lighten($ui-primary-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -312,15 +308,15 @@
|
||||
|
||||
&:focus > .status__content::after {
|
||||
background: linear-gradient(
|
||||
rgba(color.adjust($ui-base-color, $lightness: 4%), 0),
|
||||
rgba(color.adjust($ui-base-color, $lightness: 4%), 1)
|
||||
rgba(lighten($ui-base-color, 4%), 0),
|
||||
rgba(lighten($ui-base-color, 4%), 1)
|
||||
);
|
||||
}
|
||||
|
||||
&.status-direct > .status__content::after {
|
||||
background: linear-gradient(
|
||||
rgba(color.mix($ui-base-color, $ui-highlight-color, 95%), 0),
|
||||
rgba(color.mix($ui-base-color, $ui-highlight-color, 95%), 1)
|
||||
rgba(mix($ui-base-color, $ui-highlight-color, 95%), 0),
|
||||
rgba(mix($ui-base-color, $ui-highlight-color, 95%), 1)
|
||||
);
|
||||
}
|
||||
|
||||
@@ -343,7 +339,7 @@
|
||||
background: transparent;
|
||||
|
||||
.icon-button.disabled {
|
||||
color: color.adjust($action-button-color, $lightness: 13%);
|
||||
color: lighten($action-button-color, 13%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -384,7 +380,7 @@
|
||||
padding: 0 10px;
|
||||
|
||||
.detailed-status__display-name {
|
||||
color: color.adjust($inverted-text-color, $lightness: 16%);
|
||||
color: lighten($inverted-text-color, 16%);
|
||||
|
||||
span {
|
||||
display: inline;
|
||||
@@ -450,9 +446,9 @@
|
||||
}
|
||||
|
||||
.detailed-status {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
padding: 14px 10px;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&--flex {
|
||||
display: flex;
|
||||
@@ -491,9 +487,9 @@
|
||||
}
|
||||
|
||||
.detailed-status__action-bar {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding: 10px 0;
|
||||
@@ -610,7 +606,7 @@ a.status__display-name,
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 29%);
|
||||
background: lighten($ui-base-color, 29%);
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
@@ -627,7 +623,7 @@ a.status__display-name,
|
||||
position: relative;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
border-radius: 4px;
|
||||
color: $dark-text-color;
|
||||
margin-top: 14px;
|
||||
@@ -689,7 +685,7 @@ a.status-card {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -750,7 +746,7 @@ a.status-card {
|
||||
|
||||
.status-card__image {
|
||||
flex: 0 0 100px;
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
position: relative;
|
||||
|
||||
& > .fa {
|
||||
@@ -781,7 +777,7 @@ a.status-card {
|
||||
}
|
||||
|
||||
.status-card.compact {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-color: lighten($ui-base-color, 4%);
|
||||
|
||||
&.interactive {
|
||||
border: 0;
|
||||
@@ -802,7 +798,7 @@ a.status-card {
|
||||
}
|
||||
|
||||
a.status-card.compact:hover {
|
||||
background-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background-color: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.status-card__image-image {
|
||||
@@ -837,7 +833,7 @@ a.status-card.compact:hover {
|
||||
.attachment-list {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
border-radius: 4px;
|
||||
margin-top: 14px;
|
||||
overflow: hidden;
|
||||
@@ -847,7 +843,7 @@ a.status-card.compact:hover {
|
||||
color: $dark-text-color;
|
||||
padding: 8px 18px;
|
||||
cursor: default;
|
||||
border-inline-end: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-inline-end: 1px solid lighten($ui-base-color, 8%);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
@@ -900,7 +896,7 @@ a.status-card.compact:hover {
|
||||
|
||||
.status__wrapper--filtered__button {
|
||||
display: inline;
|
||||
color: color.adjust($ui-highlight-color, $lightness: 8%);
|
||||
color: lighten($ui-highlight-color, 8%);
|
||||
border: 0;
|
||||
background: transparent;
|
||||
padding: 0;
|
||||
@@ -941,12 +937,12 @@ a.status-card.compact:hover {
|
||||
}
|
||||
|
||||
&--first-in-thread {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&__line {
|
||||
height: 10px - 4px;
|
||||
border-inline-start: 2px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-inline-start: 2px solid lighten($ui-base-color, 8%);
|
||||
width: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@@ -992,7 +988,7 @@ a.status-card.compact:hover {
|
||||
|
||||
&__footer {
|
||||
border-radius: 0 0 4px 4px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
padding: 10px;
|
||||
padding-top: 12px;
|
||||
display: flex;
|
||||
@@ -1001,7 +997,7 @@ a.status-card.compact:hover {
|
||||
|
||||
&__header {
|
||||
border-radius: 4px 4px 0 0;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -1041,7 +1037,7 @@ a.status-card.compact:hover {
|
||||
|
||||
.picture-in-picture-placeholder {
|
||||
box-sizing: border-box;
|
||||
border: 2px dashed color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 2px dashed lighten($ui-base-color, 8%);
|
||||
background: $base-shadow-color;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -1064,6 +1060,6 @@ a.status-card.compact:hover {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-color: lighten($ui-base-color, 12%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.container-alt {
|
||||
width: 700px;
|
||||
margin: 0 auto;
|
||||
|
||||
@@ -1,3 +1,3 @@
|
||||
@use "contrast/variables";
|
||||
@use "index";
|
||||
@use "contrast/diff";
|
||||
@import "contrast/variables";
|
||||
@import "index";
|
||||
@import "contrast/diff";
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "sass:color";
|
||||
|
||||
// Dependent colors
|
||||
$black: #000000;
|
||||
|
||||
@@ -13,18 +11,12 @@ $ui-primary-color: $classic-primary-color !default;
|
||||
$ui-secondary-color: $classic-secondary-color !default;
|
||||
$ui-highlight-color: $classic-highlight-color !default;
|
||||
|
||||
$darker-text-color: color.adjust($ui-primary-color, $lightness: 20%) !default;
|
||||
$dark-text-color: color.adjust($ui-primary-color, $lightness: 12%) !default;
|
||||
$secondary-text-color: color.adjust(
|
||||
$ui-secondary-color,
|
||||
$lightness: 6%
|
||||
) !default;
|
||||
$highlight-text-color: color.adjust(
|
||||
$ui-highlight-color,
|
||||
$lightness: 10%
|
||||
) !default;
|
||||
$action-button-color: color.adjust($ui-base-color, $lightness: 50%);
|
||||
$darker-text-color: lighten($ui-primary-color, 20%) !default;
|
||||
$dark-text-color: lighten($ui-primary-color, 12%) !default;
|
||||
$secondary-text-color: lighten($ui-secondary-color, 6%) !default;
|
||||
$highlight-text-color: lighten($ui-highlight-color, 10%) !default;
|
||||
$action-button-color: lighten($ui-base-color, 50%);
|
||||
|
||||
$inverted-text-color: $black !default;
|
||||
$lighter-text-color: color.adjust($ui-base-color, $lightness: -6%) !default;
|
||||
$light-text-color: color.adjust($ui-primary-color, $lightness: -40%) !default;
|
||||
$lighter-text-color: darken($ui-base-color, 6%) !default;
|
||||
$light-text-color: darken($ui-primary-color, 40%) !default;
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.dashboard__counters {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
@@ -17,7 +13,7 @@
|
||||
& > div,
|
||||
& > a {
|
||||
padding: 20px;
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
height: 100%;
|
||||
@@ -31,7 +27,7 @@
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -103,12 +99,12 @@
|
||||
}
|
||||
|
||||
&.positive {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
color: $valid-value-color;
|
||||
}
|
||||
|
||||
&.negative {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
color: $error-value-color;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
$no-columns-breakpoint: 600px;
|
||||
|
||||
code {
|
||||
@@ -168,7 +164,7 @@ code {
|
||||
code {
|
||||
border-radius: 3px;
|
||||
padding: 0.2em 0.4em;
|
||||
background: color.adjust($ui-base-color, $lightness: -12%);
|
||||
background: darken($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
li {
|
||||
@@ -296,7 +292,7 @@ code {
|
||||
|
||||
.required abbr {
|
||||
text-decoration: none;
|
||||
color: color.adjust($error-value-color, $lightness: 12%);
|
||||
color: lighten($error-value-color, 12%);
|
||||
}
|
||||
|
||||
.fields-group {
|
||||
@@ -439,13 +435,13 @@ code {
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
resize: vertical;
|
||||
background: color.adjust($ui-base-color, $lightness: -10%);
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -14%);
|
||||
background: darken($ui-base-color, 10%);
|
||||
border: 1px solid darken($ui-base-color, 14%);
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
|
||||
&::placeholder {
|
||||
color: color.adjust($darker-text-color, $lightness: 4%);
|
||||
color: lighten($darker-text-color, 4%);
|
||||
}
|
||||
|
||||
&:invalid {
|
||||
@@ -457,13 +453,13 @@ code {
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: color.adjust($ui-base-color, $lightness: -20%);
|
||||
border-color: darken($ui-base-color, 20%);
|
||||
}
|
||||
|
||||
&:active,
|
||||
&:focus {
|
||||
border-color: $highlight-text-color;
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -474,13 +470,13 @@ code {
|
||||
input[type="datetime-local"] {
|
||||
&:focus:invalid:not(:placeholder-shown),
|
||||
&:required:invalid:not(:placeholder-shown) {
|
||||
border-color: color.adjust($error-red, $lightness: 12%);
|
||||
border-color: lighten($error-red, 12%);
|
||||
}
|
||||
}
|
||||
|
||||
.input.field_with_errors {
|
||||
label {
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
color: lighten($error-red, 12%);
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
@@ -490,13 +486,13 @@ code {
|
||||
input[type="datetime-local"],
|
||||
textarea,
|
||||
select {
|
||||
border-color: color.adjust($error-red, $lightness: 12%);
|
||||
border-color: lighten($error-red, 12%);
|
||||
}
|
||||
|
||||
.error {
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
color: color.adjust($error-red, $lightness: 12%);
|
||||
color: lighten($error-red, 12%);
|
||||
margin-top: 4px;
|
||||
}
|
||||
}
|
||||
@@ -588,10 +584,10 @@ code {
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
resize: vertical;
|
||||
background: color.adjust($ui-base-color, $lightness: -10%)
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($ui-base-color, $lightness: 12%))}'/></svg>")
|
||||
background: darken($ui-base-color, 10%)
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 12%))}'/></svg>")
|
||||
no-repeat right 8px center / auto 16px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -14%);
|
||||
border: 1px solid darken($ui-base-color, 14%);
|
||||
border-radius: 4px;
|
||||
padding-inline-start: 10px;
|
||||
padding-inline-end: 30px;
|
||||
@@ -632,8 +628,8 @@ code {
|
||||
width: 5px;
|
||||
background-image: linear-gradient(
|
||||
to right,
|
||||
rgba(color.adjust($ui-base-color, $lightness: -10%), 0),
|
||||
color.adjust($ui-base-color, $lightness: -10%)
|
||||
rgba(darken($ui-base-color, 10%), 0),
|
||||
darken($ui-base-color, 10%)
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -648,7 +644,7 @@ code {
|
||||
}
|
||||
|
||||
.flash-message {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
color: $darker-text-color;
|
||||
border-radius: 4px;
|
||||
padding: 15px 10px;
|
||||
@@ -729,7 +725,7 @@ code {
|
||||
}
|
||||
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -813,7 +809,7 @@ code {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
color: color.adjust($highlight-text-color, $lightness: 8%);
|
||||
color: lighten($highlight-text-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -859,7 +855,7 @@ code {
|
||||
.permissions-list {
|
||||
border: 1px solid $ui-base-color;
|
||||
border-radius: 4px;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
@@ -1009,8 +1005,8 @@ code {
|
||||
}
|
||||
|
||||
.input-copy {
|
||||
background: color.adjust($ui-base-color, $lightness: -10%);
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -14%);
|
||||
background: darken($ui-base-color, 10%);
|
||||
border: 1px solid darken($ui-base-color, 14%);
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -1071,7 +1067,7 @@ code {
|
||||
&__item {
|
||||
padding: 15px;
|
||||
color: $ui-secondary-color;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 4%);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "variables" as *;
|
||||
|
||||
/* 🦥 GoToSocial */
|
||||
|
||||
/* Variables */
|
||||
|
||||
@@ -6,8 +6,8 @@
|
||||
*/
|
||||
|
||||
/* 🛠️ Config */
|
||||
@use "colors";
|
||||
@use "sizes";
|
||||
@import "colors";
|
||||
@import "sizes";
|
||||
|
||||
/* 🧩 Components */
|
||||
@use "status";
|
||||
@import "status";
|
||||
|
||||
@@ -1,10 +1,10 @@
|
||||
/* 🚥 Status */
|
||||
@use "status/status-account";
|
||||
@use "status/status-display-name";
|
||||
@use "status/status-icons";
|
||||
@use "status/status-info";
|
||||
@use "status/status-prepend";
|
||||
@use "status/status-spoiler";
|
||||
@import "status/status-account";
|
||||
@import "status/status-display-name";
|
||||
@import "status/status-icons";
|
||||
@import "status/status-info";
|
||||
@import "status/status-prepend";
|
||||
@import "status/status-spoiler";
|
||||
|
||||
.status {
|
||||
background-color: var(--color-status-bg);
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
@use "mixins";
|
||||
@use "variables";
|
||||
@use "styles/fonts/roboto";
|
||||
@use "styles/fonts/roboto-mono";
|
||||
@import "mixins";
|
||||
@import "variables";
|
||||
@import "styles/fonts/roboto";
|
||||
@import "styles/fonts/roboto-mono";
|
||||
|
||||
@use "reset";
|
||||
@use "basics";
|
||||
@use "branding";
|
||||
@use "containers";
|
||||
@use "lists";
|
||||
@use "modal";
|
||||
@use "widgets";
|
||||
@use "forms";
|
||||
@use "accounts";
|
||||
@use "statuses";
|
||||
@use "components/index";
|
||||
@use "polls";
|
||||
@use "about";
|
||||
@use "tables";
|
||||
@use "admin";
|
||||
@use "accessibility";
|
||||
@use "rtl";
|
||||
@use "dashboard";
|
||||
@use "rich_text";
|
||||
@import "reset";
|
||||
@import "basics";
|
||||
@import "branding";
|
||||
@import "containers";
|
||||
@import "lists";
|
||||
@import "modal";
|
||||
@import "widgets";
|
||||
@import "forms";
|
||||
@import "accounts";
|
||||
@import "statuses";
|
||||
@import "components/index";
|
||||
@import "polls";
|
||||
@import "about";
|
||||
@import "tables";
|
||||
@import "admin";
|
||||
@import "accessibility";
|
||||
@import "rtl";
|
||||
@import "dashboard";
|
||||
@import "rich_text";
|
||||
|
||||
@use "gts";
|
||||
@use "gts/config";
|
||||
@use "tangerine/config" as tangerine;
|
||||
@import "gts";
|
||||
@import "gts/config";
|
||||
@import "tangerine/config";
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
@use "sass:color";
|
||||
@use "styles/fonts/roboto";
|
||||
@use "reset";
|
||||
@import "styles/fonts/roboto";
|
||||
@import "reset";
|
||||
|
||||
:root {
|
||||
--color-bg: #191b22;
|
||||
@@ -71,7 +70,7 @@ button:focus-visible {
|
||||
|
||||
button {
|
||||
padding: 7px 10px;
|
||||
border: 1px solid color.scale(#66befe, $lightness: 7%);
|
||||
border: 1px solid lighten(#66befe, 7%);
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
color: #2a2b2f;
|
||||
@@ -96,7 +95,7 @@ input[type="text"] {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 15px;
|
||||
border: 1px solid color.scale(#282c37, $lightness: 7%);
|
||||
border: 1px solid lighten(#282c37, 7%);
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
box-shadow: none;
|
||||
@@ -110,7 +109,7 @@ input[type="text"] {
|
||||
.content {
|
||||
padding: 15px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid color.scale(#39404f, $lightness: 7%);
|
||||
border: 1px solid lighten(#39404f, 7%);
|
||||
color: #fff;
|
||||
background-color: #39404f;
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
@use "mastodon-light/variables";
|
||||
@use "index";
|
||||
@use "mastodon-light/diff";
|
||||
@use "mastodon-light/colors";
|
||||
@import "mastodon-light/variables";
|
||||
@import "index";
|
||||
@import "mastodon-light/diff";
|
||||
@import "mastodon-light/colors";
|
||||
|
||||
@@ -16,9 +16,6 @@
|
||||
/* Secondary */
|
||||
--color-secondary-fg: #606984;
|
||||
|
||||
/* Account */
|
||||
--color-account-bg: #fff;
|
||||
|
||||
/* Drawer */
|
||||
--color-drawer-bg: #fff;
|
||||
--color-drawer-bg--hover: #ccd7e0;
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "../variables" as *;
|
||||
|
||||
// Notes!
|
||||
// Sass color functions, "darken" and "lighten" are automatically replaced.
|
||||
|
||||
@@ -29,23 +26,23 @@ html {
|
||||
.column-inline-form,
|
||||
.regeneration-indicator {
|
||||
background: $white;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.error-column {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.column > .scrollable.about {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.about__meta,
|
||||
.about__section__title,
|
||||
.interaction-modal {
|
||||
background: $white;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.rules-list li::before {
|
||||
@@ -53,12 +50,12 @@ html {
|
||||
}
|
||||
|
||||
.directory__card__img {
|
||||
background: color.adjust($ui-base-color, $lightness: 12%);
|
||||
background: lighten($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
.filter-form {
|
||||
background: $white;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.column-back-button,
|
||||
@@ -106,7 +103,7 @@ html {
|
||||
.confirmation-modal__cancel-button,
|
||||
.mute-modal__cancel-button,
|
||||
.block-modal__cancel-button {
|
||||
color: color.adjust($ui-base-color, $lightness: 26%);
|
||||
color: lighten($ui-base-color, 26%);
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
@@ -116,15 +113,15 @@ html {
|
||||
}
|
||||
|
||||
.column-subheading {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.getting-started,
|
||||
.scrollable {
|
||||
.column-link {
|
||||
background: $white;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&:hover,
|
||||
&:active,
|
||||
@@ -135,8 +132,8 @@ html {
|
||||
}
|
||||
|
||||
.getting-started .navigation-bar {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top: 1px solid lighten($ui-base-color, 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
@media screen and (max-width: $no-gap-breakpoint) {
|
||||
border-top: 0;
|
||||
@@ -151,7 +148,7 @@ html {
|
||||
.setting-text,
|
||||
.report-dialog-modal__textarea,
|
||||
.audio-player {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.report-dialog-modal .dialog-option .poll__input {
|
||||
@@ -172,18 +169,18 @@ html {
|
||||
|
||||
.compose-form__poll-wrapper select {
|
||||
background: $simple-background-color
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($ui-base-color, $lightness: 8%))}'/></svg>")
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 8%))}'/></svg>")
|
||||
no-repeat right 8px center / auto 16px;
|
||||
}
|
||||
|
||||
.compose-form__poll-wrapper,
|
||||
.compose-form__poll-wrapper .poll__footer {
|
||||
border-top-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.compose-form .compose-form__buttons-wrapper {
|
||||
background: $ui-base-color;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
@@ -198,7 +195,7 @@ html {
|
||||
.compose-form__modifiers {
|
||||
.compose-form__upload__actions .icon-button,
|
||||
.compose-form__upload__warning .icon-button {
|
||||
color: color.adjust($white, $lightness: 7%);
|
||||
color: lighten($white, 7%);
|
||||
|
||||
&:active,
|
||||
&:focus,
|
||||
@@ -209,11 +206,11 @@ html {
|
||||
}
|
||||
|
||||
.compose-form__buttons-wrapper {
|
||||
background: color.adjust($ui-base-color, $lightness: -6%);
|
||||
background: darken($ui-base-color, 6%);
|
||||
}
|
||||
|
||||
.autosuggest-textarea__suggestions {
|
||||
background: color.adjust($ui-base-color, $lightness: -6%);
|
||||
background: darken($ui-base-color, 6%);
|
||||
}
|
||||
|
||||
.autosuggest-textarea__suggestions__item {
|
||||
@@ -221,16 +218,16 @@ html {
|
||||
&:focus,
|
||||
&:active,
|
||||
&.selected {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.emoji-mart-bar {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-color: lighten($ui-base-color, 4%);
|
||||
|
||||
&:first-child {
|
||||
background: color.adjust($ui-base-color, $lightness: -6%);
|
||||
background: darken($ui-base-color, 6%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -245,7 +242,7 @@ html {
|
||||
|
||||
// Change the background colors of statuses
|
||||
.focusable:focus {
|
||||
background: color.adjust($white, $lightness: 4%);
|
||||
background: lighten($white, 4%);
|
||||
}
|
||||
|
||||
.detailed-status,
|
||||
@@ -260,7 +257,7 @@ html {
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 4%);
|
||||
background: lighten($ui-base-color, 4%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -323,12 +320,12 @@ html {
|
||||
|
||||
.language-dropdown__dropdown__results__item
|
||||
.language-dropdown__dropdown__results__item__common-name {
|
||||
color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.language-dropdown__dropdown__results__item.active
|
||||
.language-dropdown__dropdown__results__item__common-name {
|
||||
color: color.adjust($ui-base-color, $lightness: -12%);
|
||||
color: darken($ui-base-color, 12%);
|
||||
}
|
||||
|
||||
.dropdown-menu__separator,
|
||||
@@ -336,11 +333,11 @@ html {
|
||||
.dropdown-menu__container__header,
|
||||
.compare-history-modal .report-modal__target,
|
||||
.report-dialog-modal .poll__option.dialog-option {
|
||||
border-bottom-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-bottom-color: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
.report-dialog-modal__container {
|
||||
border-top-color: color.adjust($ui-base-color, $lightness: 4%);
|
||||
border-top-color: lighten($ui-base-color, 4%);
|
||||
}
|
||||
|
||||
// Change the background colors of modals
|
||||
@@ -362,7 +359,7 @@ html {
|
||||
.picture-in-picture__footer,
|
||||
.reactions-bar__item {
|
||||
background: $white;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.reactions-bar__item:hover,
|
||||
@@ -375,12 +372,8 @@ html {
|
||||
}
|
||||
|
||||
.reactions-bar__item.active {
|
||||
background-color: color.mix($white, $ui-highlight-color, 80%);
|
||||
border-color: color.mix(
|
||||
color.adjust($ui-base-color, $lightness: 8%),
|
||||
$ui-highlight-color,
|
||||
80%
|
||||
);
|
||||
background-color: mix($white, $ui-highlight-color, 80%);
|
||||
border-color: mix(lighten($ui-base-color, 8%), $ui-highlight-color, 80%);
|
||||
}
|
||||
|
||||
.media-modal__overlay .picture-in-picture__footer {
|
||||
@@ -402,16 +395,16 @@ html {
|
||||
}
|
||||
|
||||
.report-modal__comment {
|
||||
border-right-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-right-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.report-modal__container {
|
||||
border-top-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-top-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.column-header__collapsible-inner {
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
@@ -426,7 +419,7 @@ html {
|
||||
}
|
||||
|
||||
.flash-message.warning {
|
||||
color: color.adjust($gold-star, $lightness: 16%);
|
||||
color: lighten($gold-star, 16%);
|
||||
}
|
||||
|
||||
.boost-modal__action-bar,
|
||||
@@ -435,14 +428,14 @@ html {
|
||||
.block-modal__action-bar,
|
||||
.onboarding-modal__paginator,
|
||||
.error-modal__footer {
|
||||
background: color.adjust($ui-base-color, $lightness: -6%);
|
||||
background: darken($ui-base-color, 6%);
|
||||
|
||||
.onboarding-modal__nav,
|
||||
.error-modal__nav {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background-color: color.adjust($ui-base-color, $lightness: -12%);
|
||||
background-color: darken($ui-base-color, 12%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -453,10 +446,10 @@ html {
|
||||
|
||||
.embed-modal .embed-modal__container .embed-modal__html {
|
||||
background: $white;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&:focus {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-color: lighten($ui-base-color, 12%);
|
||||
background: $white;
|
||||
}
|
||||
}
|
||||
@@ -466,12 +459,12 @@ html {
|
||||
}
|
||||
|
||||
.react-toggle:hover:not(.react-toggle--disabled) .react-toggle-track {
|
||||
background: color.adjust($ui-secondary-color, $lightness: -10%);
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
|
||||
.react-toggle.react-toggle--checked:hover:not(.react-toggle--disabled)
|
||||
.react-toggle-track {
|
||||
background: color.adjust($ui-highlight-color, $lightness: 10%);
|
||||
background: lighten($ui-highlight-color, 10%);
|
||||
}
|
||||
|
||||
// Change the default color used for the text in an empty column or on the error column
|
||||
@@ -483,8 +476,8 @@ html {
|
||||
|
||||
// Change the default colors used on some parts of the profile pages
|
||||
.activity-stream-tabs {
|
||||
background: var(--color-account-bg);
|
||||
border-bottom-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: $account-background-color;
|
||||
border-bottom-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.nothing-here,
|
||||
@@ -492,7 +485,7 @@ html {
|
||||
.directory__tag > a,
|
||||
.directory__tag > div {
|
||||
background: $white;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
@media screen and (max-width: $no-gap-breakpoint) {
|
||||
border-left: 0;
|
||||
@@ -508,15 +501,15 @@ html {
|
||||
input[type="password"],
|
||||
textarea {
|
||||
&:hover {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 12%);
|
||||
border-color: lighten($ui-base-color, 12%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.picture-in-picture-placeholder {
|
||||
background: $white;
|
||||
border-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-color: lighten($ui-base-color, 8%);
|
||||
color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.directory__tag > a {
|
||||
@@ -535,24 +528,24 @@ html {
|
||||
&__toolbar,
|
||||
&__row,
|
||||
.nothing-here {
|
||||
border-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
.activity-stream {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
|
||||
&--under-tabs {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.entry {
|
||||
background: var(--color-account-bg);
|
||||
background: $account-background-color;
|
||||
|
||||
.detailed-status.light,
|
||||
.more.light,
|
||||
.status.light {
|
||||
border-bottom-color: color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom-color: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -619,7 +612,7 @@ html {
|
||||
|
||||
.reply-indicator {
|
||||
background: transparent;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.status__content,
|
||||
@@ -643,9 +636,9 @@ html {
|
||||
}
|
||||
|
||||
.mute-modal select {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
background: $simple-background-color
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($ui-base-color, $lightness: 8%))}'/></svg>")
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 8%))}'/></svg>")
|
||||
no-repeat right 8px center / auto 16px;
|
||||
}
|
||||
|
||||
@@ -657,15 +650,15 @@ html {
|
||||
&:not([disabled]) {
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: color.adjust($ui-secondary-color, $lightness: -10%);
|
||||
background: darken($ui-secondary-color, 10%);
|
||||
}
|
||||
|
||||
&.active {
|
||||
background-color: color.adjust($ui-highlight-color, $lightness: -2%);
|
||||
background-color: darken($ui-highlight-color, 2%);
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background: color.adjust($ui-highlight-color, $lightness: 10%);
|
||||
background: lighten($ui-highlight-color, 10%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -673,16 +666,16 @@ html {
|
||||
|
||||
.glitch.local-settings {
|
||||
background: $ui-base-color;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.glitch.local-settings__navigation {
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
background: darken($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
.glitch.local-settings__navigation__item {
|
||||
background: color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px color.adjust($ui-base-color, $lightness: 8%) solid;
|
||||
background: darken($ui-base-color, 8%);
|
||||
border-bottom: 1px lighten($ui-base-color, 8%) solid;
|
||||
|
||||
&:hover {
|
||||
background: $ui-base-color;
|
||||
@@ -712,8 +705,8 @@ html {
|
||||
|
||||
.status.collapsed .status__content::after {
|
||||
background: linear-gradient(
|
||||
rgba(color.adjust($ui-base-color, $lightness: -13%), 0),
|
||||
rgba(color.adjust($ui-base-color, $lightness: -13%), 1)
|
||||
rgba(darken($ui-base-color, 13%), 0),
|
||||
rgba(darken($ui-base-color, 13%), 1)
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "sass:color";
|
||||
|
||||
// Dependent colors
|
||||
$black: #000000;
|
||||
$white: #ffffff;
|
||||
@@ -16,7 +14,7 @@ $grey-600: #4e4c5a; // Trout
|
||||
$grey-100: #dadaf3; // Topaz
|
||||
|
||||
// Differences
|
||||
$success-green: color.adjust(#3c754d, $lightness: 8%);
|
||||
$success-green: lighten(#3c754d, 8%);
|
||||
|
||||
$base-overlay-background: $white !default;
|
||||
$valid-value-color: $success-green !default;
|
||||
@@ -36,10 +34,7 @@ $ui-button-tertiary-border-color: $blurple-500 !default;
|
||||
|
||||
$primary-text-color: $black !default;
|
||||
$darker-text-color: $classic-base-color !default;
|
||||
$highlight-text-color: color.adjust(
|
||||
$ui-highlight-color,
|
||||
$lightness: -8%
|
||||
) !default;
|
||||
$highlight-text-color: darken($ui-highlight-color, 8%) !default;
|
||||
$dark-text-color: #444b5d;
|
||||
$action-button-color: #606984;
|
||||
|
||||
@@ -52,19 +47,11 @@ $account-background-color: $white !default;
|
||||
|
||||
// Invert darkened and lightened colors
|
||||
@function darken($color, $amount) {
|
||||
@return hsl(
|
||||
color.hue($color),
|
||||
color.saturation($color),
|
||||
color.lightness($color) + $amount
|
||||
);
|
||||
@return hsl(hue($color), saturation($color), lightness($color) + $amount);
|
||||
}
|
||||
|
||||
@function lighten($color, $amount) {
|
||||
@return hsl(
|
||||
color.hue($color),
|
||||
color.saturation($color),
|
||||
color.lightness($color) - $amount
|
||||
);
|
||||
@return hsl(hue($color), saturation($color), lightness($color) - $amount);
|
||||
}
|
||||
|
||||
$emojis-requiring-inversion: "chains";
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.modal-layout {
|
||||
background: $ui-base-color
|
||||
url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.80078 31.757813" width="234.80078" height="31.757812"><path d="M19.599609 0c-1.05 0-2.10039.375-2.90039 1.125L0 16.925781v14.832031h234.80078V17.025391l-16.5-15.900391c-1.6-1.5-4.20078-1.5-5.80078 0l-13.80078 13.099609c-1.6 1.5-4.19883 1.5-5.79883 0L179.09961 1.125c-1.6-1.5-4.19883-1.5-5.79883 0L159.5 14.224609c-1.6 1.5-4.20078 1.5-5.80078 0L139.90039 1.125c-1.6-1.5-4.20078-1.5-5.80078 0l-13.79883 13.099609c-1.6 1.5-4.20078 1.5-5.80078 0L100.69922 1.125c-1.600001-1.5-4.198829-1.5-5.798829 0l-13.59961 13.099609c-1.6 1.5-4.200781 1.5-5.800781 0L61.699219 1.125c-1.6-1.5-4.198828-1.5-5.798828 0L42.099609 14.224609c-1.6 1.5-4.198828 1.5-5.798828 0L22.5 1.125C21.7.375 20.649609 0 19.599609 0z" fill="#{hex-color($ui-base-lighter-color)}33"/></svg>')
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.poll {
|
||||
margin-top: 16px;
|
||||
font-size: 14px;
|
||||
@@ -20,7 +16,7 @@
|
||||
&__chart {
|
||||
border-radius: 4px;
|
||||
display: block;
|
||||
background: color.adjust($ui-primary-color, $lightness: -5%);
|
||||
background: darken($ui-primary-color, 5%);
|
||||
height: 5px;
|
||||
min-width: 1%;
|
||||
|
||||
@@ -51,17 +47,17 @@
|
||||
// duplication
|
||||
&::-moz-progress-bar {
|
||||
border-radius: 4px;
|
||||
background: color.adjust($ui-primary-color, $lightness: -5%);
|
||||
background: darken($ui-primary-color, 5%);
|
||||
}
|
||||
|
||||
&::-ms-fill {
|
||||
border-radius: 4px;
|
||||
background: color.adjust($ui-primary-color, $lightness: -5%);
|
||||
background: darken($ui-primary-color, 5%);
|
||||
}
|
||||
|
||||
&::-webkit-progress-value {
|
||||
border-radius: 4px;
|
||||
background: color.adjust($ui-primary-color, $lightness: -5%);
|
||||
background: darken($ui-primary-color, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -98,7 +94,7 @@
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
background: $simple-background-color;
|
||||
border: 1px solid color.adjust($simple-background-color, $lightness: -14%);
|
||||
border: 1px solid darken($simple-background-color, 14%);
|
||||
border-radius: 4px;
|
||||
padding: 6px 10px;
|
||||
|
||||
@@ -140,7 +136,7 @@
|
||||
&:active,
|
||||
&:focus,
|
||||
&:hover {
|
||||
border-color: color.adjust($valid-value-color, $lightness: 15%);
|
||||
border-color: lighten($valid-value-color, 15%);
|
||||
border-width: 4px;
|
||||
}
|
||||
|
||||
@@ -228,7 +224,7 @@
|
||||
}
|
||||
|
||||
.compose-form__poll-wrapper {
|
||||
border-top: 1px solid color.adjust($simple-background-color, $lightness: -8%);
|
||||
border-top: 1px solid darken($simple-background-color, 8%);
|
||||
overflow-x: hidden;
|
||||
|
||||
ul {
|
||||
@@ -244,8 +240,7 @@
|
||||
}
|
||||
|
||||
.poll__footer {
|
||||
border-top: 1px solid
|
||||
color.adjust($simple-background-color, $lightness: -8%);
|
||||
border-top: 1px solid darken($simple-background-color, 8%);
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -301,9 +296,9 @@
|
||||
outline: 0;
|
||||
font-family: inherit;
|
||||
background: $simple-background-color
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($simple-background-color, $lightness: - 14%))}'/></svg>")
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(darken($simple-background-color, 14%))}'/></svg>")
|
||||
no-repeat right 8px center / auto 16px;
|
||||
border: 1px solid color.adjust($simple-background-color, $lightness: -14%);
|
||||
border: 1px solid darken($simple-background-color, 14%);
|
||||
border-radius: 4px;
|
||||
padding: 6px 10px;
|
||||
padding-inline-end: 30px;
|
||||
@@ -314,7 +309,7 @@
|
||||
color: $dark-text-color;
|
||||
|
||||
&__chart {
|
||||
background: rgba(color.adjust($ui-primary-color, $lightness: -14%), 0.7);
|
||||
background: rgba(darken($ui-primary-color, 14%), 0.7);
|
||||
|
||||
&.leading {
|
||||
background: rgba($ui-highlight-color, 0.5);
|
||||
|
||||
@@ -1,6 +1,3 @@
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.status__content__text,
|
||||
.e-content,
|
||||
.reply-indicator__content {
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
body.rtl {
|
||||
direction: rtl;
|
||||
|
||||
@@ -98,15 +94,15 @@ body.rtl {
|
||||
&::after {
|
||||
background-image: linear-gradient(
|
||||
to left,
|
||||
rgba(color.adjust($ui-base-color, $lightness: -10%), 0),
|
||||
color.adjust($ui-base-color, $lightness: -10%)
|
||||
rgba(darken($ui-base-color, 10%), 0),
|
||||
darken($ui-base-color, 10%)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
.simple_form select {
|
||||
background: color.adjust($ui-base-color, $lightness: -10%)
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(color.adjust($ui-base-color, $lightness: 12%))}'/></svg>")
|
||||
background: darken($ui-base-color, 10%)
|
||||
url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14.933 18.467' height='19.698' width='15.929'><path d='M3.467 14.967l-3.393-3.5H14.86l-3.392 3.5c-1.866 1.925-3.666 3.5-4 3.5-.335 0-2.135-1.575-4-3.5zm.266-11.234L7.467 0 11.2 3.733l3.733 3.734H0l3.733-3.734z' fill='#{hex-color(lighten($ui-base-color, 12%))}'/></svg>")
|
||||
no-repeat left 8px center / auto 16px;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.activity-stream {
|
||||
box-shadow: 0 0 15px rgba($base-shadow-color, 0.2);
|
||||
border-radius: 4px;
|
||||
@@ -73,7 +69,7 @@
|
||||
}
|
||||
|
||||
&--highlighted .entry {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
@use "sass:color";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
@@ -15,7 +11,7 @@
|
||||
vertical-align: top;
|
||||
border-top: 1px solid $ui-base-color;
|
||||
text-align: start;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
|
||||
&.critical {
|
||||
font-weight: 700;
|
||||
@@ -82,7 +78,7 @@
|
||||
& > tbody > tr > td {
|
||||
padding: 11px 10px;
|
||||
background: transparent;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border: 1px solid lighten($ui-base-color, 8%);
|
||||
color: $secondary-text-color;
|
||||
}
|
||||
|
||||
@@ -95,19 +91,17 @@
|
||||
&.batch-table {
|
||||
& > thead > tr > th {
|
||||
background: $ui-base-color;
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-top: 1px solid darken($ui-base-color, 8%);
|
||||
border-bottom: 1px solid darken($ui-base-color, 8%);
|
||||
|
||||
&:first-child {
|
||||
border-radius: 4px 0 0;
|
||||
border-inline-start: 1px solid
|
||||
color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-inline-start: 1px solid darken($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
border-radius: 0 4px 0 0;
|
||||
border-inline-end: 1px solid
|
||||
color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-inline-end: 1px solid darken($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -192,7 +186,7 @@ a.table-action-link {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
background: $ui-base-color;
|
||||
border-radius: 4px 0 0;
|
||||
height: 47px;
|
||||
@@ -209,7 +203,7 @@ a.table-action-link {
|
||||
height: 47px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
color: $secondary-text-color;
|
||||
display: none;
|
||||
@@ -248,14 +242,14 @@ a.table-action-link {
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__form {
|
||||
padding: 16px;
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
background: $ui-base-color;
|
||||
|
||||
@@ -266,25 +260,25 @@ a.table-action-link {
|
||||
}
|
||||
|
||||
&__row {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
background: color.adjust($ui-base-color, $lightness: -4%);
|
||||
background: darken($ui-base-color, 4%);
|
||||
|
||||
@media screen and (max-width: $no-gap-breakpoint) {
|
||||
.optional &:first-child {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-top: 1px solid darken($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: -2%);
|
||||
background: darken($ui-base-color, 2%);
|
||||
}
|
||||
|
||||
&:nth-child(even) {
|
||||
background: $ui-base-color;
|
||||
|
||||
&:hover {
|
||||
background: color.adjust($ui-base-color, $lightness: 2%);
|
||||
background: lighten($ui-base-color, 2%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -359,12 +353,12 @@ a.table-action-link {
|
||||
}
|
||||
|
||||
.nothing-here {
|
||||
border: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border: 1px solid darken($ui-base-color, 8%);
|
||||
border-top: 0;
|
||||
box-shadow: none;
|
||||
|
||||
@media screen and (max-width: $no-gap-breakpoint) {
|
||||
border-top: 1px solid color.adjust($ui-base-color, $lightness: -8%);
|
||||
border-top: 1px solid darken($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
*/
|
||||
|
||||
/* 🛠️ Config */
|
||||
@use "keyframes";
|
||||
@import "keyframes";
|
||||
|
||||
/* 🧩 Components */
|
||||
@use "status-bar";
|
||||
@import "status-bar";
|
||||
|
||||
@@ -1,5 +1,3 @@
|
||||
@use "sass:color";
|
||||
|
||||
// Commonly used web colors
|
||||
$black: #000000; // Black
|
||||
$white: #ffffff; // White
|
||||
@@ -34,9 +32,9 @@ $error-value-color: $error-red !default;
|
||||
|
||||
// Tell UI to use selected colors
|
||||
$ui-base-color: $classic-base-color !default; // Darkest
|
||||
$ui-base-lighter-color: color.scale(
|
||||
$ui-base-lighter-color: lighten(
|
||||
$ui-base-color,
|
||||
$lightness: 26%
|
||||
26%
|
||||
) !default; // Lighter darkest
|
||||
$ui-primary-color: $classic-primary-color !default; // Lighter
|
||||
$ui-secondary-color: $classic-secondary-color !default; // Lightest
|
||||
@@ -63,15 +61,9 @@ $primary-text-color: $white !default;
|
||||
$darker-text-color: $ui-primary-color !default;
|
||||
$dark-text-color: $ui-base-lighter-color !default;
|
||||
$secondary-text-color: $ui-secondary-color !default;
|
||||
$highlight-text-color: color.scale(
|
||||
$ui-highlight-color,
|
||||
$lightness: 8%
|
||||
) !default;
|
||||
$highlight-text-color: lighten($ui-highlight-color, 8%) !default;
|
||||
$action-button-color: $ui-base-lighter-color !default;
|
||||
$action-button-focus-color: color.scale(
|
||||
$ui-base-lighter-color,
|
||||
$lightness: 4%
|
||||
) !default;
|
||||
$action-button-focus-color: lighten($ui-base-lighter-color, 4%) !default;
|
||||
$passive-text-color: $gold-star !default;
|
||||
$active-passive-text-color: $success-green !default;
|
||||
|
||||
@@ -102,11 +94,11 @@ $ui-avatar-border-size: 8%;
|
||||
$dismiss-overlay-width: 4rem;
|
||||
|
||||
:root {
|
||||
--dropdown-border-color: #{color.scale($ui-base-color, $lightness: 12%)};
|
||||
--dropdown-background-color: #{color.scale($ui-base-color, $lightness: 4%)};
|
||||
--dropdown-border-color: #{lighten($ui-base-color, 12%)};
|
||||
--dropdown-background-color: #{lighten($ui-base-color, 4%)};
|
||||
--dropdown-shadow:
|
||||
0 20px 25px -5px #{rgba($base-shadow-color, 0.25)},
|
||||
0 8px 10px -6px #{rgba($base-shadow-color, 0.25)};
|
||||
--modal-background-color: #{color.scale($ui-base-color, $lightness: -4%)};
|
||||
--modal-border-color: #{color.scale($ui-base-color, $lightness: 4%)};
|
||||
--modal-background-color: #{darken($ui-base-color, 4%)};
|
||||
--modal-border-color: #{lighten($ui-base-color, 4%)};
|
||||
}
|
||||
|
||||
@@ -1,7 +1,4 @@
|
||||
@use "sass:color";
|
||||
@use "sass:math";
|
||||
@use "mixins" as *;
|
||||
@use "variables" as *;
|
||||
|
||||
.hero-widget {
|
||||
margin-bottom: 10px;
|
||||
@@ -57,7 +54,7 @@
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
color: color.adjust($darker-text-color, $lightness: 10%);
|
||||
color: lighten($darker-text-color, 10%);
|
||||
}
|
||||
|
||||
a {
|
||||
@@ -226,7 +223,7 @@
|
||||
&:hover,
|
||||
&:active,
|
||||
&:focus {
|
||||
background: color.adjust($ui-base-color, $lightness: 8%);
|
||||
background: lighten($ui-base-color, 8%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -308,7 +305,7 @@
|
||||
tbody td {
|
||||
padding: 15px 0;
|
||||
vertical-align: middle;
|
||||
border-bottom: 1px solid color.adjust($ui-base-color, $lightness: 8%);
|
||||
border-bottom: 1px solid lighten($ui-base-color, 8%);
|
||||
}
|
||||
|
||||
tbody tr:last-child td {
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import Rails from "@rails/ujs";
|
||||
import "font-awesome/css/font-awesome.css";
|
||||
|
||||
export function start() {
|
||||
require.context("../images/", true);
|
||||
|
||||
@@ -1 +1 @@
|
||||
// @import "flavours/glitch/styles/contrast";
|
||||
@import "flavours/glitch/styles/contrast";
|
||||
|
||||
@@ -1 +1 @@
|
||||
// @import "flavours/glitch/styles/mastodon-light";
|
||||
@import "flavours/glitch/styles/mastodon-light";
|
||||
|
||||
+1
-1
@@ -91,7 +91,7 @@
|
||||
"lodash": "^4.17.21",
|
||||
"mark-loader": "^0.1.6",
|
||||
"marky": "^1.2.5",
|
||||
"mini-css-extract-plugin": "^2.9.4",
|
||||
"mini-css-extract-plugin": "^1.6.2",
|
||||
"mkdirp": "^3.0.1",
|
||||
"npmlog": "^7.0.1",
|
||||
"path-complete-extname": "^1.0.0",
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 232 KiB |
+1
-1
@@ -283,7 +283,7 @@
|
||||
|
||||
<symbol id="lock-open-simple" fill="currentcolor" viewBox="0 0 256 256">
|
||||
<path d="M216,96V208a8,8,0,0,1-8,8H48a8,8,0,0,1-8-8V96a8,8,0,0,1,8-8H208A8,8,0,0,1,216,96Z" opacity="0.2"></path>
|
||||
<path d="M207.998431,8 C231.042632,8 251.349085,24.3122088 255.838251,46.407134 C256.717967,50.7369471 253.92111,54.9601045 249.591297,55.83982 C245.261484,56.7195356 241.038327,53.922679 240.158611,49.592866 C237.195711,35.0099629 223.489823,24 207.998431,24 C190.325319,24 175.998431,38.326888 175.998431,56 L175.998431,80 L208,80 C216.836556,80 224,87.163444 224,96 L224,208 C224,216.836556 216.836556,224 208,224 L48,224 C39.163444,224 32,216.836556 32,208 L32,96 C32,87.163444 39.163444,80 48,80 L159.998431,80 L159.998431,56 C159.998431,29.490332 181.488763,8 207.998431,8 Z M208,96 L48,96 L48,208 L208,208 L208,96 Z"/>
|
||||
<path d="M48,8 C74.509668,8 96,29.490332 96,56 L95.9994315,80 L208,80 C216.836556,80 224,87.163444 224,96 L224,208 C224,216.836556 216.836556,224 208,224 L48,224 C39.163444,224 32,216.836556 32,208 L32,96 C32,87.163444 39.163444,80 48,80 L79.9994315,80 L80,56 C80,38.5036191 65.9582171,24.2868724 48.5291785,24.0042871 L48,24 C32.5086083,24 18.8027209,35.0099629 15.83982,49.592866 C14.9601045,53.922679 10.7369471,56.7195356 6.40713405,55.83982 C2.077321,54.9601045 -0.719535601,50.7369471 0.160179973,46.407134 C4.64934606,24.3122088 24.9557992,8 48,8 Z M208,96 L48,96 L48,208 L208,208 L208,96 Z"/>
|
||||
</symbol>
|
||||
|
||||
<symbol id="magnifying-glass" fill="currentcolor" viewBox="0 0 256 256">
|
||||
|
||||
|
Before Width: | Height: | Size: 56 KiB After Width: | Height: | Size: 56 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 818 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
@@ -2529,7 +2529,7 @@ __metadata:
|
||||
lodash: "npm:^4.17.21"
|
||||
mark-loader: "npm:^0.1.6"
|
||||
marky: "npm:^1.2.5"
|
||||
mini-css-extract-plugin: "npm:^2.9.4"
|
||||
mini-css-extract-plugin: "npm:^1.6.2"
|
||||
mkdirp: "npm:^3.0.1"
|
||||
npmlog: "npm:^7.0.1"
|
||||
path-complete-extname: "npm:^1.0.0"
|
||||
@@ -10950,15 +10950,16 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"mini-css-extract-plugin@npm:^2.9.4":
|
||||
version: 2.9.4
|
||||
resolution: "mini-css-extract-plugin@npm:2.9.4"
|
||||
"mini-css-extract-plugin@npm:^1.6.2":
|
||||
version: 1.6.2
|
||||
resolution: "mini-css-extract-plugin@npm:1.6.2"
|
||||
dependencies:
|
||||
schema-utils: "npm:^4.0.0"
|
||||
tapable: "npm:^2.2.1"
|
||||
loader-utils: "npm:^2.0.0"
|
||||
schema-utils: "npm:^3.0.0"
|
||||
webpack-sources: "npm:^1.1.0"
|
||||
peerDependencies:
|
||||
webpack: ^5.0.0
|
||||
checksum: 10c0/76f9e471784d52435ea766ce576ad23d37d0ea51c32ddc56414c8fdf14f7de44202dbc772cdf7549b7e54a5e56f569af93cfbd036d62d13ff8fd9571e53353b7
|
||||
webpack: ^4.4.0 || ^5.0.0
|
||||
checksum: 10c0/138c008f8a510012266d2834227e75181feeffd09e89e9cde0a63f17be3d64ea3ddbba01036aac9c8a969462c0142285659a20c294e8d01ba948aa1124affdc2
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@@ -15997,7 +15998,7 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"webpack-sources@npm:^1.4.3":
|
||||
"webpack-sources@npm:^1.1.0, webpack-sources@npm:^1.4.3":
|
||||
version: 1.4.3
|
||||
resolution: "webpack-sources@npm:1.4.3"
|
||||
dependencies:
|
||||
|
||||
Reference in New Issue
Block a user