sdga-ui 1.0.4 → 1.0.6

package/demo-angular/angular.json

@@ -34,8 +34,11 @@
               "src/styles.scss"
             ],
             "preserveSymlinks": true,
-            "watch": true,
-            "poll": 2000
+            "stylePreprocessorOptions": {
+              "includePaths": [
+                "../../node_modules"
+              ]
+            }
           },
           "configurations": {
             "production": {

package/demo-angular/package-lock.json

@@ -16,9 +16,10 @@
         "@angular/router": "^21.0.0",
         "@ngx-translate/core": "^17.0.0",
         "@ngx-translate/http-loader": "^17.0.0",
+        "bootstrap": "^5.3.8",
         "highlight.js": "^11.11.1",
         "rxjs": "~7.8.0",
-        "sdga-ui": "^1.0.3",
+        "sdga-ui": "file:..",
         "tslib": "^2.3.0"
       },
       "devDependencies": {
@@ -31,6 +32,21 @@
         "vitest": "^4.0.8"
       }
     },
+    "..": {
+      "name": "sdga-ui",
+      "version": "1.0.5",
+      "license": "MIT",
+      "devDependencies": {
+        "autoprefixer": "^10.4.19",
+        "bootstrap": "^5.3.8",
+        "postcss": "^8.4.38",
+        "prettier": "^3.7.3",
+        "sass": "^1.69.5"
+      },
+      "peerDependencies": {
+        "bootstrap": "^5.3.8"
+      }
+    },
     "node_modules/@acemir/cssom": {
       "version": "0.9.24",
       "resolved": "https://registry.npmjs.org/@acemir/cssom/-/cssom-0.9.24.tgz",
@@ -465,6 +481,7 @@
       "resolved": "https://registry.npmjs.org/@angular/common/-/common-21.0.1.tgz",
       "integrity": "sha512-EqdTGpFp7PVdTVztO7TB6+QxdzUbYXKKT2jwG2Gg+PIQZ2A8XrLPRmGXyH/DLlc5IhnoJlLbngmBRCLCO4xWog==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -481,6 +498,7 @@
       "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-21.0.1.tgz",
       "integrity": "sha512-YRzHpThgCaC9b3xzK1Wx859ePeHEPR7ewQklUB5TYbpzVacvnJo38PcSAx/nzOmgX9y4mgyros6LzECmBb8d8w==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -494,6 +512,7 @@
       "integrity": "sha512-BxGLtL5bxlaaAs/kSN4oyXhMfvzqsj1Gc4Jauz39R4xtgOF5cIvjBtj6dJ9mD3PK0s6zaFi7WYd0YwWkxhjgMA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/core": "7.28.4",
         "@jridgewell/sourcemap-codec": "^1.4.14",
@@ -526,6 +545,7 @@
       "resolved": "https://registry.npmjs.org/@angular/core/-/core-21.0.1.tgz",
       "integrity": "sha512-z0G9Bwzgqr0fQVbtMgqwl+SbbiqtJD7I2xT6U5p45LetKHojcfigH29dxi/vqALPwEdgb2nSIx7RqVhoyynraQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -570,6 +590,7 @@
       "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-21.0.1.tgz",
       "integrity": "sha512-68StH9HILKUqNhQKz6KKNHzpgk1n88CIusWlmJvnb0l6iWGf3ydq5lTMKAKiZQmSDAVP5unTGfNvIkh59GRyVg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "tslib": "^2.3.0"
       },
@@ -691,6 +712,7 @@
       "integrity": "sha512-2BCOP7TN8M+gVDj7/ht3hsaO/B/n5oDbiAyyvnRlNOs+u1o+JWNYTQrmpuNp1/Wq2gcFrI01JAW+paEKDMx/CA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.3",
@@ -1041,6 +1063,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       },
@@ -1084,6 +1107,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=18"
       }
@@ -1800,6 +1824,7 @@
       "integrity": "sha512-X7/+dG9SLpSzRkwgG5/xiIzW0oMrV3C0HOa7YHG1WnrLK+vCQHfte4k/T80059YBdei29RBC3s+pSMvPJDU9/A==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@inquirer/checkbox": "^4.3.0",
         "@inquirer/confirm": "^5.1.19",
@@ -3927,7 +3952,8 @@
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.0.0.tgz",
       "integrity": "sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/@tufjs/canonical-json": {
       "version": "2.0.0",
@@ -4557,6 +4583,34 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/angular-cli-ghpages/node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/angular-cli-ghpages/node_modules/readdirp/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/angular-cli-ghpages/node_modules/restore-cursor": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz",
@@ -4653,6 +4707,35 @@
         "url": "https://github.com/chalk/ansi-styles?sponsor=1"
       }
     },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "license": "ISC",
+      "optional": true,
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/anymatch/node_modules/picomatch": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz",
+      "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
     "node_modules/array-union": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
@@ -4764,6 +4847,20 @@
         "require-from-string": "^2.0.2"
       }
     },
+    "node_modules/binary-extensions": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/bl": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
@@ -4823,7 +4920,6 @@
         }
       ],
       "license": "MIT",
-      "peer": true,
       "peerDependencies": {
         "@popperjs/core": "^2.11.8"
       }
@@ -4872,6 +4968,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.8.25",
         "caniuse-lite": "^1.0.30001754",
@@ -5062,6 +5159,7 @@
       "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "readdirp": "^4.0.1"
       },
@@ -5821,6 +5919,7 @@
       "integrity": "sha512-DT9ck5YIRU+8GYzzU5kT3eHGA5iL+1Zd0EutOmTE9Dtk+Tvuzd23VBU+ec7HPNSTxXYO55gPV/hq4pSBJDjFpA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "accepts": "^2.0.0",
         "body-parser": "^2.2.0",
@@ -6250,6 +6349,20 @@
         "url": "https://github.com/sponsors/isaacs"
       }
     },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "license": "ISC",
+      "optional": true,
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
     "node_modules/glob-to-regexp": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
@@ -6627,6 +6740,20 @@
         "node": ">= 0.10"
       }
     },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
     "node_modules/is-core-module": {
       "version": "2.16.1",
       "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.16.1.tgz",
@@ -6782,6 +6909,7 @@
       "integrity": "sha512-454TI39PeRDW1LgpyLPyURtB4Zx1tklSr6+OFOipsxGUH1WMTvk6C65JQdrj455+DP2uJ1+veBEHTGFKWVLFoA==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@acemir/cssom": "^0.9.23",
         "@asamuzakjp/dom-selector": "^6.7.4",
@@ -6895,6 +7023,7 @@
       "integrity": "sha512-ME4Fb83LgEgwNw96RKNvKV4VTLuXfoKudAmm2lP8Kk87KaMK0/Xrx/aAkMWmT8mDb+3MlFDspfbCs7adjRxA2g==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "cli-truncate": "^5.0.0",
         "colorette": "^2.0.20",
@@ -7642,6 +7771,17 @@
         "node": "^20.17.0 || >=22.9.0"
       }
     },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/npm-bundled": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-4.0.0.tgz",
@@ -8548,6 +8688,7 @@
       "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
       "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
       "license": "Apache-2.0",
+      "peer": true,
       "dependencies": {
         "tslib": "^2.1.0"
       }
@@ -8615,13 +8756,8 @@
       }
     },
     "node_modules/sdga-ui": {
-      "version": "1.0.3",
-      "resolved": "https://registry.npmjs.org/sdga-ui/-/sdga-ui-1.0.3.tgz",
-      "integrity": "sha512-9WTnr7Tu37mxPH1TxHIknmNx/imH09MOGuef4z2UL0akiJzdsy7jNDjc1XXYZhdWBpuyvJntbKbSwzqQxPGlNg==",
-      "license": "MIT",
-      "peerDependencies": {
-        "bootstrap": "^5.3.8"
-      }
+      "resolved": "..",
+      "link": true
     },
     "node_modules/semver": {
       "version": "7.7.3",
@@ -9248,7 +9384,8 @@
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
       "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
-      "license": "0BSD"
+      "license": "0BSD",
+      "peer": true
     },
     "node_modules/tuf-js": {
       "version": "4.0.0",
@@ -9286,6 +9423,7 @@
       "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
       "dev": true,
       "license": "Apache-2.0",
+      "peer": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
@@ -9435,6 +9573,7 @@
       "integrity": "sha512-BxAKBWmIbrDgrokdGZH1IgkIk/5mMHDreLDmCJ0qpyJaAteP8NvMhkwr/ZCQNqNH97bw/dANTE9PDzqwJghfMQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "esbuild": "^0.25.0",
         "fdir": "^6.5.0",
@@ -9994,6 +10133,7 @@
       "integrity": "sha512-d9B2J9Cm9dN9+6nxMnnNJKJCtcyKfnHj15N6YNJfaFHRLua/d3sRKU9RuKmO9mB0XdFtUizlxfz/VPbd3OxGhw==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@vitest/expect": "4.0.14",
         "@vitest/mocker": "4.0.14",
@@ -10441,6 +10581,7 @@
       "integrity": "sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==",
       "dev": true,
       "license": "MIT",
+      "peer": true,
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }

package/demo-angular/package.json

@@ -3,12 +3,14 @@
   "version": "0.0.0",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve -o",
+    "start": "npm run use:local && ng serve -o",
     "build": "ng build",
-    "build:prod": "ng build --configuration production",
+    "build:prod": "npm run use:npm && ng build --configuration production",
     "deploy": "ng deploy --base-href=/dga-ui/",
     "watch": "ng build --watch --configuration development",
-    "test": "ng test"
+    "test": "ng test",
+    "use:local": "npm install --no-save file:.. && echo Using local sdga-ui",
+    "use:npm": "node -e \"const fs=require('fs');const pkg=JSON.parse(fs.readFileSync('package.json'));const version=pkg.dependencies['sdga-ui'];console.log('Installing sdga-ui@'+version);\" && npm install && echo Using npm sdga-ui"
   },
   "prettier": {
     "printWidth": 100,
@@ -33,9 +35,10 @@
     "@angular/router": "^21.0.0",
     "@ngx-translate/core": "^17.0.0",
     "@ngx-translate/http-loader": "^17.0.0",
+    "bootstrap": "^5.3.8",
     "highlight.js": "^11.11.1",
     "rxjs": "~7.8.0",
-    "sdga-ui": "^1.0.3",
+    "sdga-ui": "^1.0.6",
     "tslib": "^2.3.0"
   },
   "devDependencies": {

package/demo-angular/public/i18n/ar.json

@@ -209,6 +209,9 @@
     "danger_link": "رابط خطر",
     "warning_link": "رابط تحذير",
     "info_link": "رابط معلومات",
+    "neutral_link": "رابط محايد",
+    "oncolor_link": "رابط على لون خلفية",
+    "disabled_link": "رابط معطل",
     "underline_link": "رابط مع تسطير",
     "no_underline": "رابط بدون تسطير",
     "underline_25": "رابط مع شفافية تسطير 25%",

package/demo-angular/public/i18n/en.json

@@ -209,6 +209,9 @@
     "danger_link": "Danger link",
     "warning_link": "Warning link",
     "info_link": "Info link",
+    "neutral_link": "Neutral link",
+    "oncolor_link": "Link on colored background",
+    "disabled_link": "Disabled link",
     "underline_link": "Link with underline",
     "no_underline": "Link without underline",
     "underline_25": "Link with 25% underline opacity",

package/demo-angular/src/app/views/links/links.component.html

@@ -4,137 +4,18 @@
 
   <section class="demo-section mb-5">
     <h2>{{ 'links.section_basic' | translate }}</h2>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-primary">{{ 'links.primary_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-secondary">{{ 'links.secondary_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-success">{{ 'links.success_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-danger">{{ 'links.danger_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-warning">{{ 'links.warning_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-info">{{ 'links.info_link' | translate }}</a>
-      </div>
+    <div class="d-flex flex-column gap-3 component-showcase">
+      <!-- Primary link -->
+      <a href="javascript:void(0);" class="link-primary link-offset-2">{{ 'links.primary_link' | translate }}</a>
+      <!-- Neutral link -->
+      <a href="javascript:void(0);" class="link-neutral link-offset-2">{{ 'links.neutral_link' | translate }}</a>
+      <!-- On-color link displayed on a primary background -->
+      <div class="p-3 bg-primary rounded-2" style="width:max-content;">
+        <a href="javascript:void(0);" class="link-oncolor link-offset-2">{{ 'links.oncolor_link' | translate }}</a>
+      </div>
+      <!-- Disabled link (non-interactive) -->
+      <a href="javascript:void(0);" class="link-primary disabled link-offset-2" aria-disabled="true" tabindex="-1">{{ 'links.disabled_link' | translate }}</a>
     </div>
     <app-code-example [htmlCode]="basicLinksCode"></app-code-example>
   </section>
-
-  <section class="demo-section mb-5">
-    <h2>{{ 'links.section_underline' | translate }}</h2>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-underline">{{ 'links.underline_link' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-underline-opacity-0">{{ 'links.no_underline' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-underline-opacity-25">{{ 'links.underline_25' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-underline-opacity-50">{{ 'links.underline_50' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-underline-opacity-75">{{ 'links.underline_75' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-underline-opacity-100">{{ 'links.underline_100' | translate }}</a>
-      </div>
-    </div>
-    <app-code-example [htmlCode]="underlineLinksCode"></app-code-example>
-  </section>
-
-  <section class="demo-section mb-5">
-    <h2>{{ 'links.section_hover' | translate }}</h2>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-primary link-underline-opacity-0 link-underline-opacity-100-hover">{{ 'links.hover_underline' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-secondary link-underline-opacity-100 link-underline-opacity-0-hover">{{ 'links.hover_remove' | translate }}</a>
-      </div>
-    </div>
-    <app-code-example [htmlCode]="hoverLinksCode"></app-code-example>
-  </section>
-
-  <section class="demo-section mb-5">
-    <h2>{{ 'links.section_offset' | translate }}</h2>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-offset-1">{{ 'links.offset_1' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-offset-2">{{ 'links.offset_2' | translate }}</a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-offset-3">{{ 'links.offset_3' | translate }}</a>
-      </div>
-    </div>
-    <app-code-example [htmlCode]="offsetLinksCode"></app-code-example>
-    
-    <h3 class="mt-4 mb-3">Combining Offset with Hover Effects</h3>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-offset-2 link-offset-3-hover link-underline link-underline-opacity-0 link-underline-opacity-75-hover">
-          Link with changing offset on hover
-        </a>
-      </div>
-    </div>
-    <app-code-example [htmlCode]="offsetHoverCode"></app-code-example>
-  </section>
-
-  <section class="demo-section mb-5">
-    <h2>{{ 'links.section_icons' | translate }}</h2>
-    <div class="d-flex flex-column gap-3">
-      <div>
-        <a href="javascript:void(0);" class="link-primary">
-          <i class="hgi hgi-stroke hgi-link-01 me-2"></i>
-          {{ 'links.link_with_icon' | translate }}
-        </a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-secondary">
-          {{ 'links.external_link' | translate }}
-          <i class="hgi hgi-stroke hgi-link-external-01 ms-2"></i>
-        </a>
-      </div>
-      <div>
-        <a href="javascript:void(0);" class="link-success">
-          <i class="hgi hgi-stroke hgi-arrow-right-01 me-2"></i>
-          {{ 'links.arrow_link' | translate }}
-        </a>
-      </div>
-    </div>
-    <app-code-example [htmlCode]="iconLinksCode"></app-code-example>
-  </section>
-
-  <section class="demo-section">
-    <h2>{{ 'links.section_custom' | translate }}</h2>
-    
-    <h3 class="h5 mb-3">Subtle Link</h3>
-    <div class="mb-3">
-      <a href="javascript:void(0);" class="custom-link-subtle">{{ 'links.subtle_link' | translate }}</a>
-    </div>
-    <app-code-example [htmlCode]="subtleLinkCode" [scssCode]="subtleLinkScss"></app-code-example>
-    
-    <h3 class="h5 mb-3 mt-4">Bold Link</h3>
-    <div class="mb-3">
-      <a href="javascript:void(0);" class="custom-link-bold">{{ 'links.bold_link' | translate }}</a>
-    </div>
-    <app-code-example [htmlCode]="boldLinkCode" [scssCode]="boldLinkScss"></app-code-example>
-    
-    <h3 class="h5 mb-3 mt-4">Decorated Link</h3>
-    <div class="mb-3">
-      <a href="javascript:void(0);" class="custom-link-decorated">{{ 'links.decorated_link' | translate }}</a>
-    </div>
-    <app-code-example [htmlCode]="decoratedLinkCode" [scssCode]="decoratedLinkScss"></app-code-example>
-  </section>
 </div>

package/demo-angular/src/app/views/links/links.component.scss

@@ -8,53 +8,4 @@
     padding-bottom: 0.5rem;
     border-bottom: 1px solid var(--dga-border-color);
   }
-
-  a {
-    font-size: 1rem;
-    transition: all 0.2s ease;
-  }
-}
-
-// Custom link styles
-.custom-link-subtle {
-  color: var(--dga-neutral-600);
-  text-decoration: none;
-  
-  &:hover {
-    color: var(--dga-primary);
-    text-decoration: underline;
-  }
-}
-
-.custom-link-bold {
-  color: var(--dga-primary);
-  font-weight: 600;
-  text-decoration: none;
-  
-  &:hover {
-    color: var(--dga-primary-dark);
-    text-decoration: underline;
-  }
-}
-
-.custom-link-decorated {
-  color: var(--dga-secondary);
-  text-decoration: none;
-  position: relative;
-  padding-bottom: 2px;
-  
-  &::after {
-    content: '';
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    width: 0;
-    height: 2px;
-    background-color: var(--dga-secondary);
-    transition: width 0.3s ease;
-  }
-  
-  &:hover::after {
-    width: 100%;
-  }
-}
+}