> For the complete documentation index, see [llms.txt](https://docs.nickarce.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.nickarce.com/getting-started/changelog.md).

# Changelog

## v1.3 - June 18th, 2026

### Changes

1. added overlay mode for the header. Docs here.&#x20;
2. added ability to offset the hero section of a page to leave room for overlay headers
3. added the ability for a header to be overlay and sticky at the same time
4. added stripe like dropdown animation using the 'desktop dropdown animation mode' prop on the menu wrapper component set to 'morph'
5. added the ability to set the a 'menu link' component to open in a new tab
6. reorganized component properties to utilize groups and conditions
7. upgraded the css comments in the 'header wrapper' css to use the etch comment navigation
8. Upgraded the dropdowns to use safety triangle logic for moving between the dropdown triggers and the content instead of just time outs. this means you can move slowly from the trigger and the content and it will keep the content open. [see X post about this](https://x.com/nickarceco/status/2067371464957825157?s=20)

### Upgrade v1.2 -> v1.3

1. import the new header.json into a local install or blank install
2. turn on 'overwrite on paste' in the etch settings on your active install
3. from the blank install, copy and paste the 'menu wrapper', 'menu link', and 'menu dropdown' components and paste them into your active install anywhere. Click save, then delete the components you just pasted in. this should update those components props and internal code.
4. add these attributes to the 'header wrapper' element `data-overlay-header="false" data-overlay-header-offset="false"`
5. Copy the new overlay and sticky header css from your blank install on the 'header wrapper' component and replace the current' data-sticky-header' code with what should look like this.

```css
&[data-overlay-header='true'],
  &[data-sticky-header='true'] {
    inset-block-start: var(--wp-admin--admin-bar--height, 0px);
  }

  &[data-overlay-header='true'] {
    position: absolute;
  }

  &[data-sticky-header='true'] {
    position: sticky;
  }

  &[data-sticky-header='true'][data-overlay-header='true'] {
    position: fixed;
  }

  &[data-overlay-header='true'][data-overlay-header-offset='true'] + main > :first-child > :first-child {
    margin-block-start: var(--header-height);
  }
```

5. turn off 'overwrite on paste' in the etch settings on your active install

***

## v1.2 - March 17th, 2026

### Changes

1. updated the header wrapper JS to close any open dropdowns when the user scrolls down when the header is in sticky mode.
2. added two new dropdowns: dropdown perseus and dropdown vega

### Upgrade v1.1.1 -> v1.2

1. import the new header.json into a local install or blank install
2. copy the javascript from the header wrapper in the blank install
3. paste the javascript into your header wrapper javascript area inside of etch

***

## v1.1.1 - February 20th, 2026

### Changes

1. Resolved an issue where --dropdown-border-color was referrencing itself
2. Added new dropdown link variables to quickly change some styling for links inside a standard dropdown
3. Resolved an issue where --link-font-weight wasnt being used
4. Fixed an issue where dropdowns were using an old --dropdown-border variable which has recently been split into --dropdown-border-width and --dropdown-border-color

### Upgrade Video - v1.1 -> v1.1.1

Video: <https://magnified-web.neetorecord.com/watch/078ee495d144c0064511>

***

## v1.1 - February 16th, 2026

### Changes

1. Moved the custom CSS from the 'Menu Wrapper' -> 'Header Wrapper'. this accomplishes a few things.
   1. makes it easier if the menu wrapper needs a component change the new version can just be dropped in (assuming no changes were made on on the sites instance)
   2. allows for all custom css to be found at a higher level instead of needing to edit the menu wrapper to see it
2. Added some combo selector css to free up some additional lines

***

## v1.0.3 - February 10th, 2026

### Changes

1. did a pass for all the dropdown patterns so that they don't use --radius-s because ACSS does not have these on by default.&#x20;
2. Tightened up spacing on mobile for dropdown's so they werent so all over the place
3. While doing a pass I found a better way to apply padding for more compatibility. Padding for dropdown content has been moved from the .menu-dropdown\_\_content-wrapper -> .menu-dropdown\_\_content. This was moved to make it easier to use overflow: hidden; on the content like in dropdown Lyra

***

## V1.0.2 - February 10th, 2026

### Changes

1. Added the ability to target links within the nav that are are linked to the current page the visitor is on.&#x20;
   1. Current active link gets a class of .active-link
   2. \--link-color-active and --link-bg-active to change the color and background of the active links. You can also search for these variables inside the menu wrapper component to find where to add additional styling
2. Refined Dropdowns
   1. broke --dropdown-border into&#x20;
      1. \--dropdown-border-width
      2. \--dropdown-border-color
   2. added --dropdown-link-min-radius so that the links inside standard dropdowns have a minimum radius before they abide by a concentric radius from the dropdown content
   3. added better alignment for nested dropdowns

      <figure><img src="/files/GCHGUOqokGN1GbB5AHZj" alt=""><figcaption></figcaption></figure>
3. ACSS V4 added padding to the header by default. Added CSS to remove that
4. Removed more found duplicate CSS
5. set .nav\_\_list to have align-items: center; by default to resolve nav items falling out of alignment

***

## V1.0.1 - February 5th, 2026

### Changes

1. Fixed backdrop animation for off canvas mobile menu. Was instantly disappearing on close
2. Updated accordion mode logic so when you open a dropdown in accordion mode it will make sure it stays in view
3. Updated logic so that if menu is open on mobile and user resizes to desktop mode, the mobile menu closes
4. Removed some duplicate CSS
5. Renamed Etch Layer 'Header' -> 'Header Wrapper'&#x20;
6. Renamed Etch Layer 'Header Inner' -> 'Header'

***

## V1 Release - Feb 4th, 2026


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.nickarce.com/getting-started/changelog.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
