Improve markup in cygnet theme

Created on 16 January 2024, 10 months ago
Updated 18 January 2024, 10 months ago

Problem/Motivation

The Cygnet theme CSS contains long chained selectors that are confusing and difficult to maintain. Changing the markup to indicate the particular level will enable us to simplify the CSS, make the code more maintainable, and allow us to provide future enhancements more easily.

Steps to reproduce

Go here: patternkit/css/cygnet/cygnet--prefixed-for-drupal.css. Beginning at around line 81, you will see the styles for the nested elements in Cygnet.

Proposed resolution

Set a class for the "level" of the element so that we can remove some of the chained selectors. There are two files that need to be updated:
- patternkit.jsoneditor.editor.object.es6.js
- patternkit.jsoneditor.editor.array.es6.js

Remaining tasks

- Update the two JS files for objects and arrays
- simplify the CSS files

User interface changes

N/A

API changes

N/A

Data model changes

N/A

✨ Feature request
Status

Active

Version

9.1

Component

Module Core

Created by

πŸ‡ΊπŸ‡ΈUnited States christopherdoherty

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Merge Requests

Comments & Activities

Production build 0.71.5 2024