[mercury] Remove elevation-1 default border and background (#682)

* `[showcase][general]` Add "content-slot" class/styles for better displaying slotted content

* `[showcase][general]` Add "show-boundary" UI helper class

* `[showcase][tab]` Apply "show-boundary" class on tab cases

* `[mercury][tab]` Update spacing-body and reorder selectors

* `[mercury][tab]` Format html on save

* `[mercury][tab]` Add mixins for "tab-filled-list" and "tab-outlined"

* `[mercury][tab]` Comment out tab-list border

(Should only apply for "tab-list-outlined")

* `[mercury][showcase][tab]` Add "tab-filled-list" and "tab-outlined"

* `[mercury][tab]` Rename "extend" to "variant"

* `[mercury][tokens]` Update tab token value

* `[mercury][tab]` Comment out "filled-list" and "outlined" cases

This cases have not been discused yet. Keeping them commented in case design decides to keep them.

* `[showcase][general]` ]Remove border from `.background-color-container`

* `[mercury][tab]` Comment out include's for tab variantants

These variants are hidden because they have not been discussed yet.

* `[showcase][general]` Remove ".show-boundary" class selector

This helper border was included to show the component boundary, when it has not a visible border. This feature for the showcase was not approved.

* `[mercury][tab]` Fix elevation cases

Elevation classes should be applied on the tab itself

* `[mercury][tab]` Apply a default surface background on the `tab-list`

* `[design-systems]` Update bun.lock

* `[showcase]` Update index.html - remove line

* `[showcase][tab]` Update tab showcase metadata/cases

* `[mercury][tab]` Remove spacing body from host

* `[showcase][general]` Make elevation-box padding bigger

* `[showcase][common-snippets]` Format on save

* [showcase][common-snippets]` Fix typo

* `[mercury][tab]` Apply  "elevation" or "surface" bg-color to sortable button

* `[showcase][tab]` Remove since it is not required with new tab style

* `[showcase][copy-code-component]` Format on save

* `[showcase]` Recover `blockquote-info` inline-start border color

* `[mercury][tab]` Remove "outlnied" and "filled-list" variants

- The mentioned variants were not approved. The only tab style is the default, that has no background and no border

* `[mercury]` Update bundles tests

* Update bun.lock

* `[mercury][tab]` Fix tab button "selected" background and border color on drag

* `[mercury][tests]` Update bundles tests

* `[mercury][tab]` Refactor: Simplify token system and apply DRY principles

- Remove 18 --tab-caption tokens
- Apply CSS properties directly in mixins
- Consolidate duplicate hover/active states
- Remove ~41 lines of duplicate code

* Update bun.lock

* `[showcase][copy-code]` Fix ch-tab-render elevation color

* `[mercury][tab][flexible-layout]` Update bundles tests

Author: bsastregx

bun.lock

@@ -72,6 +72,7 @@
       "version": "0.1.0",
       "dependencies": {
         "oxc-resolver": "~11.10.0",
+        "sass": "~1.86.3",
       },
       "devDependencies": {
         "@eslint/js": "*",

packages/common/src/html.ts

@@ -86,7 +86,9 @@ export const CSS_CLASSES = {
   },
   TAB: {
     TAG: "ch-tab-render",
-    SELECTOR: "tab"
+    SELECTOR: "tab",
+    FILLED_LIST_SELECTOR: "tab-filled-list",
+    OUTLINED_SELECTOR: "tab-outlined"
   },
   TOOLTIP: {
     TAG: "ch-tooltip",
@@ -134,3 +136,16 @@ export const CUSTOM_CSS_ONLY_FOR_PREVIEW_LAYOUT = `.layout {
   font-size: var(--mer-font__size--xs);
   justify-content: center;
 }`;
+
+export const CONTENT_SLOT = {
+  /* Diagonal hatch pattern used as a visual placeholder for empty content areas */
+  SELECTOR: "content-slot",
+  CSS: `
+    background-color: transparent;
+    background-image: var(--content-slot-background-image);
+    block-size: 200px;
+    display: grid;
+    place-content: center;
+    margin: 0 !important;
+  `
+};