Merge branch 'ArmDeveloperEcosystem:main' into feature/openclaw_arm_continuum

Author: odincodeshen

.github/skills/learning-path-structure-review/SKILL.md

@@ -10,7 +10,7 @@ Use this skill when a Learning Path needs a structural review. Focus on whether
 ## Workflow
 
 1. Identify the Learning Path directory and read the relevant Markdown files together.
-2. State the owned developer task in one sentence. If the task is unclear, too broad, or split across unrelated goals, flag it.
+2. Summarize the developer task owned by LP in one sentence. If the task is unclear, too broad, or split across unrelated goals, flag it.
 3. Check the required file shape:
    - The Learning Path has an `_index.md` file.
    - The Learning Path has an `_next-steps.md` file.

.github/skills/seo-geo-aeo-review/SKILL.md

@@ -23,9 +23,11 @@ For focused front matter `description` edits only, use `.github/skills/metadata-
 
 ## Workflow
 
+On any given page:
+
 1. Identify the target content type and target developer intent. 
-2. Read the title, front matter description, headings, introduction, prerequisites, main task flow, validation, conclusion, and further reading. If you've previously read a page, use context and don't re-read it unless there's a change since the last read. 
-3. State the page's owned task in one sentence. If the task is unclear or too broad, flag it.
+2. Read the title, front matter description, headings, introduction, prerequisites, main task flow, validation, conclusion, and further reading. If you've previously read the page, use context and don't re-read it unless asked to. 
+3. Summarize the page's owned task in one sentence. If the task is unclear or too broad, flag it.
 4. Review SEO signals:
    - The title is task-led and includes the main technology, platform, or tool.
    - The `description` is one concise sentence that states the task, context, and outcome.

.github/skills/writing-style-review/SKILL.md

@@ -10,10 +10,10 @@ Use this skill for granular prose, voice, readability, terminology, and style re
 ## Workflow
 
 1. Identify the target file, section, or selected text.
-2. Read surrounding context so style edits preserve the author's intent and the technical flow. If you've previously read the page, use context and don't re-read it unless there's a change since the last read. 
+2. Read surrounding context so style edits preserve the author's intent and the technical flow. If you've previously read the page, use context and don't re-read it unless asked to. 
 3. Review the target against the guidelines defined in this skill.
 4. Depending on request type, do the following:
-  - For review requests, report high-impact style issues by file and line when possible. 
+  - For review requests, report style issues by file and line when possible, ordered by severity. 
   - For edit requests, make focused rewrites, then re-open changed sections to check Markdown, shortcodes, links, and code fences.
 
 ## Voice and tone

.github/workflows/deploy.yml

@@ -68,7 +68,12 @@ jobs:
 
       # Builds arm-software-developer repo
       - name: Build
-        run: hugo --minify
+        run: |
+          if [ "${{ inputs.target }}" = "dev" ]; then
+            hugo --minify --config config.toml,config.internal.toml
+          else
+            hugo --minify
+          fi
         env:
           HUGO_LLM_API: ${{ secrets.HUGO_LLM_API }}
           HUGO_RAG_API: ${{ secrets.HUGO_RAG_API }}

assets/css/content-pages.css

@@ -88,20 +88,6 @@ html[theme='dark'] .tab-right-card > h6 {
     line-height: 1.2;
 }
 
-/* Force a 2-line clamp for masthead title */
-ads-masthead #ads-masthead-title {
-  line-height: 1.2;
-  padding-bottom: 6px;
-  box-sizing: border-box;
-  max-height: calc(1.2em * 2 + 8px); /* dyncamically calculate height depending on length of title */
-  overflow: hidden;
-  display: -webkit-box;
-  -webkit-line-clamp: 2;
-  -webkit-box-orient: vertical;
-  white-space: normal;
-}
-
-
 /* hover effects */
 a:hover {
     text-decoration: none; }
@@ -155,7 +141,7 @@ div.github-div {
 
 html[theme='dark'] div.github-div {
     border-color: rgba(163, 168, 174,0.25); /* #A3A8AE at 25% transparency */
-    background-color: rgb(23,25,27);;  /* CLOSE to this, but not due to close to gradient background. var(--arm-color-base) at 75% transparency */
+    background-color: var(--ads-ui-ink-100);
 
 }
 
@@ -185,12 +171,12 @@ ads-card.multi-install-card {
     --ads-card-box-shadow-hover: 0 3px 6px 1px rgba(0,0,0,0.16);  /* 0 1px 3px 3px rgba(0,0,0,0.25); */
 } 
 html[theme='dark'] ads-card.multi-install-card {
-    --ads-card-background-color: var(--arm-color-base);
+    --ads-card-background-color: var(--ads-ui-ink-80);
     --ads-card-border-color: #000000;
     /*--ads-card-box-shadow:  0 3px 12px rgba(0, 0, 0, 0.5);*/
 
     /* hover state */
-    --ads-card-background-color-hover: var(--arm-color-base);
+    --ads-card-background-color-hover: var(--ads-ui-ink-80);
     --ads-card-border-color-hover: transparent;
     /*--ads-card-box-shadow-hover:  0 3px 12px rgba(0, 0, 0, 0.5);*/
 

assets/css/content.css

@@ -16,6 +16,10 @@
 
 
 /* Box around content (learning paths and tools) */
+html[theme="dark"] #main {
+    background-color: var(--ads-ui-ink-90);
+}
+
 div.content-box {
     padding-left: 16px;
     padding-right: 16px;
@@ -28,7 +32,7 @@ div.content-box {
     border-radius: 5px;
 
     border-color: rgba(163, 168, 174,0.25); /* #A3A8AE at 25% transparency */
-    background-color: rgba(31,32,35,0.75);  /* var(--arm-color-base) at 75% transparency */
+    background-color: var(--ads-ui-ink-100);
 }
 html[theme="light"] div.content-box {
     background-color: white;

assets/css/cross-page.css

@@ -92,7 +92,7 @@ ads-search#search-box.install-guide{
     padding-right: 14px;
 }
 ads-search {
-    --ads-search-button-background-color: var(--arm-color-base);
+    --ads-search-button-background-color: #7233F7;
 }
 
 /* Colors of buttons & links to match DevHub styling */
@@ -166,9 +166,7 @@ table tbody td {
 /* Fix Nav Masthead Breadcrumb container */
 /*************************************/
 #nav-masthead-breadcrumbs {
-    background-image: url("/img/masthead-background.webp"); /* The image used */
-    background-color: var(--arm-color-footing);            /* Used if the image is unavailable */
-    background-size: cover;
+    background-color: var(--ads-ui-ink-100);
 }
 
 
@@ -177,12 +175,7 @@ table tbody td {
 /* CLS fix: reserve space for nav before hydration */
 arm-top-navigation:not(:defined) {
     display: block;
-    min-height: 80px;
-}
-@media (max-width: 1024px) {
-    arm-top-navigation:not(:defined) {
-        min-height: 60px;
-    }
+    min-height: 60px;
 }
 
 /* Fix global nav height */
@@ -191,28 +184,19 @@ arm-top-navigation:not(:defined) {
 /*************************************/
 #global-nav-height-fixer {
     max-width: 100vw;
-    height: 80px;
+    height: 60px;
     overflow: hidden;
     position: relative;
     top: 0;
 }
-@media (max-width: 1024px) { /* smaller screens than LG */
-        #global-nav-height-fixer {
-            height: 60px;
-        }
-}
-.nav-transparent {
-    background: transparent;
-    background-color: transparent;
-}
+.nav-transparent,
 .nav-black {
-    background: #010101;
-    background-color: #010101;  
+    background: var(--ads-ui-ink-100);
+    background-color: var(--ads-ui-ink-100);
 }
 
 /* Fix Masthead Height */
 #expanded-masthead  {
-        background-color: transparent;
         min-height: 100px;                  /* Keep baseline height for short titles */
         height: auto;                       /* Allow 2-line titles to expand */
         background-position: center; 
@@ -229,31 +213,33 @@ arm-top-navigation:not(:defined) {
 ads-masthead {
     --ads-masthead-border-bottom-color: transparent;
 }
-    
-
 
-ads-breadcrumbs {
-    --ads-breadcrumb-color: var(--lp-accent-secondary);
-    --ads-breadcrumb-current-color: white;
-    --ads-breadcrumb-hover-color: var(--lp-hover-text);
-    --ads-breadcrumbs-link-color: var(--lp-accent-secondary);
-    --ads-breadcrumbs-link-color-hover: var(--lp-hover-text);
-    --ads-breadcrumbs-link-color-visited: var(--lp-accent-secondary);
-    --ads-breadcrumbs-current-color: white;
+/* Align the alert icon with the masthead title while its surface spans the page. */
+#color-refresh-alert-container {
+    background-color: #F0F0F0;
+    overflow: hidden;
 }
 
-#breadcrumb-element ads-breadcrumb[current] {
-    --ads-breadcrumb-color: white;
-    --ads-breadcrumb-current-color: white;
-    --ads-breadcrumbs-current-color: white;
-    color: white;
+/* Bypass ADS's fixed 70% heading wrapper while retaining its typography. */
+ads-masthead #ads-masthead-title {
+    box-sizing: border-box;
+    color: var(--ads-masthead-color, #E6E6E9);
+    font-size: 32px;
+    line-height: 35px;
+    max-height: none;
+    overflow: visible;
+    overflow-wrap: anywhere;
+    white-space: normal;
+    width: calc(100% - 32px);
 }
 
-#breadcrumb-element ads-breadcrumb:not([current]):hover {
-    --ads-breadcrumb-color: var(--lp-hover-text);
-    --ads-breadcrumbs-link-color: var(--lp-hover-text);
-    color: var(--lp-hover-text);
+@media (min-width: 768px) {
+    ads-masthead #ads-masthead-title {
+        font-size: 48px;
+        line-height: 53px;
+    }
 }
+    
 
 
 /* Hide breadcrumb when small screen. */
@@ -267,7 +253,7 @@ ads-breadcrumbs {
 /* Replicate style of breadcrumb in masthead when alone. */
 #only-breadcrumb-masthead {
     width: 100%;
-    background-color: var(--arm-color-footing);
+    background-color: var(--ads-ui-ink-100);
     padding-top: 8px;
     padding-left: 15px; /* u-padding-left-2-1/2 */
     padding-bottom: 8px; 
@@ -292,9 +278,7 @@ ads-breadcrumbs {
     width: fit-content;
     height: fit-content;
 
-    background: -webkit-linear-gradient(left,var(--arm-green), var(--arm-light-blue));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
+    color: var(--lp-accent-secondary);
 }
 .beta-homepage {
     vertical-align: top;
@@ -328,7 +312,7 @@ ads-breadcrumbs {
     margin: -1px;
     z-index: -1;
     border-radius: inherit;
-    background: linear-gradient(90deg, var(--lp-accent-primary), var(--lp-accent-secondary));
+    background: #848192;
     opacity: 0;
     transition: opacity 0.3s ease; 
 }
@@ -338,48 +322,12 @@ ads-breadcrumbs {
 
 
 
-.gradient-box-tool {
-    /*display: inline-block;*/
-    position: relative;
-    border-radius: 0px;
-    z-index:1;
-  }
-
-.gradient-box-tool::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 1px;
-    left: 2px;
-    margin: -2px;
-    z-index: -1;
-    border-radius: inherit;
-    background: linear-gradient(90deg, var(--lp-accent-primary), var(--lp-accent-secondary));
-    opacity: 0;
-    transition: opacity 0.3s ease; 
-}
-.gradient-box-tool:hover::before {
-    opacity: 1;
-}
-
-
-
-
-html[theme="dark"] .orchard-breeze-text {
-    background: -webkit-linear-gradient(left,var(--arm-green), var(--arm-light-blue));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-}
-html[theme="dark"] .fullbourn-sunrise-text {
-    background: -webkit-linear-gradient(left,var(--arm-yellow), var(--arm-orange));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
-}
+html[theme="dark"] .orchard-breeze-text,
+html[theme="dark"] .fullbourn-sunrise-text,
 html[theme="dark"] .minhang-mist-text {
-    background: -webkit-linear-gradient(left,var(--arm-light-blue), var(--arm-light-grey));
-    -webkit-background-clip: text;
-    -webkit-text-fill-color: transparent;
+    background: none;
+    color: #E6E6E9;
+    -webkit-text-fill-color: currentColor;
 }
 
 
@@ -410,36 +358,9 @@ html[theme='light'] body {
 
 /* Dark Theme */
 /****************************************************/
-/* Mobile background */
-@media (max-width: 768px) {
-    html[theme='dark'] body {
-        background-image: url("/img/bg-img-736x800-purple.webp");
-        background-color: var(--arm-color-footing);      
-        background-position: 0% 100%;
-        background-attachment: fixed;
-        background-size: 100% 100%;         /* Forces smaller width; best solution for mobile sizes */
-    } 
-}
-/* Laptop background */
-@media (min-width: 768px) {
-    html[theme='dark'] body {
-        background-image: url("/img/bg-img-1920x1600-purple.webp");
-        background-color: var(--arm-color-footing);      
-        background-position: 0% 100%;
-        background-attachment: fixed;
-        background-size: cover;             /* Stretches image to fit; best solution for desktop sizes */
-    } 
-}
-
-/* Large Monitor background */
-@media (min-width: 1400px) {
-    html[theme='dark'] body {
-        background-image: url("/img/bg-img-2500x1700-purple.webp");
-        background-color: var(--arm-color-footing);      
-        background-position: 0% 100%;
-        background-attachment: fixed;
-        background-size: cover;             /* Stretches image to fit; best solution for desktop sizes */
-    } 
+html[theme='dark'] body {
+    background-color: var(--ads-ui-ink-100);
+    background-image: none;
 }