Scope opacity and transition rules to non-first children in NavigationSection module

- navigation item section should never get dimmed, continue dimming 'navigation item groups'

├── apps
│   └── editor
│       └── src
│           ├── commands
│           │   └── select-referencing-files-commands
│           │       ├── index.ts
│           │       ├── select-referencing-files-commands.ts
│           │       └── utils
│           │           ├── get-referencing-files-for-position.ts
│           │           ├── get-referencing-files-for-uris.ts
│           │           └── prompt-for-referencing-files.ts
│           └── views
│               └── settings
│                   └── frontend
│                       ├── Home
│                       │   ├── Home.tsx
│                       │   └── sections
│                       │       ├── ApiConfigurationsSection.tsx
│                       │       ├── GeneralSection.tsx
│                       │       ├── ModelProvidersSection.tsx
│                       │       └── WebConfigurationsSection.tsx
│                       └── Settings.tsx
└── packages
    └── ui
        └── src
            └── components
                └── editor
                    └── settings
                        ├── DefaultConfigurationSelector
                        │   ├── DefaultConfigurationSelector.module.scss
                        │   ├── DefaultConfigurationSelector.tsx
                        │   └── index.ts
                        ├── Group
                        │   ├── Group.module.scss
                        │   ├── Group.tsx
                        │   └── use-last-group-padding.ts
                        ├── Item
                        │   ├── Item.module.scss
                        │   ├── Item.stories.tsx
                        │   ├── Item.tsx
                        │   └── index.ts
                        ├── Layout
                        │   ├── Layout.module.scss
                        │   ├── Layout.tsx
                        │   └── index.ts
                        ├── Modal
                        │   ├── Form
                        │   │   ├── Form.module.scss
                        │   │   ├── Form.tsx
                        │   │   └── index.ts
                        │   ├── Modal.module.scss
                        │   ├── Modal.tsx
                        │   └── index.ts
                        ├── NavigationItemGroup
                        │   ├── NavigationItemGroup.module.scss
                        │   ├── NavigationItemGroup.tsx
                        │   └── index.ts
                        ├── NavigationItemSection
                        │   ├── NavigationItemSection.module.scss
                        │   ├── NavigationItemSection.tsx
                        │   └── index.ts
                        ├── NavigationSection
                        │   ├── NavigationSection.module.scss
                        │   ├── NavigationSection.tsx
                        │   └── index.ts
                        ├── Notice
                        │   ├── Notice.module.scss
                        │   ├── Notice.tsx
                        │   └── index.ts
                        ├── Section
                        │   ├── Section.module.scss
                        │   ├── Section.tsx
                        │   └── index.ts
                        ├── SortableList
                        │   ├── SortableList.module.scss
                        │   ├── SortableList.stories.tsx
                        │   ├── SortableList.tsx
                        │   └── index.ts
                        └── Templates
                            ├── Templates.module.scss
                            ├── Templates.tsx
                            └── index.ts

Author: robertpiosik

packages/ui/src/components/editor/settings/NavigationSection/NavigationSection.module.scss

@@ -1,14 +1,17 @@
 .container {
-  opacity: var(--dimmed-opacity);
-  transition: opacity var(--transition-duration-250);
   display: flex;
   flex-direction: column;
 
-  &--active {
+  > :not(:first-child) {
+    opacity: var(--dimmed-opacity);
+    transition: opacity var(--transition-duration-250);
+  }
+
+  &--active > :not(:first-child) {
     opacity: 1;
   }
 
-  &:hover {
+  &:hover > :not(:first-child) {
     opacity: 1;
   }
 }