Skip to content

summary.outline buttons: arrow unreadable for .contrast #62

Description

@elenes

Describe the issue

Current Behavior

An accordion like

<details>
  <summary role="button" class="outline contrast"></summary>
</details>

will render the arrow in the wrong color because this css rule

[data-theme=dark] details summary.contrast[role=button]::after {
  filter: brightness(100) invert(0);
}

does not account for .outline

Expected Behavior

The arrow should render correctly (un-inverted for darkmode, inverted for light mode).

It may make sense to simply use --pico-[color] for all outline arrows. This will also make the appearance of the arrows consistent with the border color.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions