Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 37 additions & 0 deletions docs/docs/assets/brand/logo-white.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
161 changes: 161 additions & 0 deletions docs/docs/assets/stylesheets/copy-page.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,161 @@
/* Firecrawl-style "Copy page" split-button. Themed with Material's
CSS vars so it adapts to slate/default palettes automatically. */

.ak-copy-page {
position: relative;
float: right;
display: inline-flex;
align-items: stretch;
margin: 0 0 0.75rem 1rem;
font-family: var(--md-text-font-family, inherit);
font-size: 0.7rem;
z-index: 3;
}
Comment on lines +4 to +13

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🩺 Stability & Availability | 🟠 Major | ⚡ Quick win

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Description: Confirm the copy-page control has a script and markup source.
set -euo pipefail

# Find the mkdocs config and print its JS/CSS asset registration.
fd -t f 'mkdocs.yml' | while IFS= read -r cfg; do
  echo "=== $cfg ==="
  rg -n -A 8 'extra_javascript|extra_css|custom_dir' "$cfg"
done

# Find any source that produces the ak-copy-page markup or behaviour.
rg -n -C 3 'ak-copy-page' --glob '!**/*.css'

Repository: AltimateAI/altimate-code

Length of output: 760


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "=== tracked docs-related files ==="
git ls-files 'docs/**' | sed -n '1,200p'

echo "=== copy-page stylesheet ==="
if [ -f docs/docs/assets/stylesheets/copy-page.css ]; then
  cat -n docs/docs/assets/stylesheets/copy-page.css | sed -n '1,220p'
fi

echo "=== references to copy page classes/state (all tracked files) ==="
python3 - <<'PY'
import subprocess, re, pathlib
files = subprocess.check_output(["git","ls-files"], text=True).splitlines()
needle = re.compile(r'ak-copy-page|aria-expanded|copied|copy-page')
for f in files:
    try:
        text = pathlib.Path(f).read_text(encoding='utf-8', errors='replace')
    except Exception:
        continue
    if needle.search(text):
        print(f"--- {f} ---")
        lines = text.splitlines()
        for i,l in enumerate(lines,1):
            if needle.search(l):
                start=max(1,i-4); end=min(len(lines),i+4)
                for j in range(start,end+1):
                    print(f"{j}: {lines[j-1]}")
PY

echo "=== mkdocs js/custom_dir summary ==="
python3 - <<'PY'
import pathlib, re, subprocess
mkdocs = pathlib.Path('docs/mkdocs.yml')
if mkdocs.exists():
    txt = mkdocs.read_text()
    for section in ['custom_dir','extra_javascript','extra_css']:
        print(f"{section}: {section in txt}")
PY

Repository: AltimateAI/altimate-code

Length of output: 25178


Register the copy-page script with the same override context.

docs/mkdocs.yml currently only registers extra_css and custom_dir; this stylesheet adds aria-expanded, [hidden], and copied state styles for .ak-copy-page, so add the matching extra_javascript entry for the controller that injects or controls that markup.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@docs/docs/assets/stylesheets/copy-page.css` around lines 4 - 13, Add the
copy-page controller to the existing MkDocs override configuration through an
extra_javascript entry, alongside the current extra_css and custom_dir settings.
Ensure it references the script responsible for controlling .ak-copy-page markup
and its aria-expanded, hidden, and copied states.


.ak-copy-page__main,
.ak-copy-page__toggle {
background: var(--md-default-bg-color);
color: var(--md-default-fg-color);
border: 1px solid var(--md-default-fg-color--lightest);
cursor: pointer;
display: inline-flex;
align-items: center;
font: inherit;
line-height: 1;
transition: background-color 0.15s ease, border-color 0.15s ease;
}

.ak-copy-page__main {
gap: 0.4rem;
padding: 0.45rem 0.7rem;
border-radius: 0.4rem 0 0 0.4rem;
font-weight: 500;
}

.ak-copy-page__toggle {
padding: 0.45rem 0.45rem;
border-left: none;
border-radius: 0 0.4rem 0.4rem 0;
}

.ak-copy-page__main:hover,
.ak-copy-page__toggle:hover,
.ak-copy-page__toggle[aria-expanded='true'] {
background: var(--md-default-fg-color--lightest);
border-color: var(--md-default-fg-color--lighter);
}
Comment on lines +41 to +46

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Add visible focus styles for the copy control.

The stylesheet defines :hover and [aria-expanded='true'] states, but no focus state. Keyboard users get no reliable focus indicator on .ak-copy-page__main, .ak-copy-page__toggle, or the menu buttons. The menu is a disclosure widget, so keyboard operation is expected.

♿ Proposed fix to add focus indicators
 .ak-copy-page__main:hover,
 .ak-copy-page__toggle:hover,
 .ak-copy-page__toggle[aria-expanded='true'] {
   background: var(--md-default-fg-color--lightest);
   border-color: var(--md-default-fg-color--lighter);
 }
+
+.ak-copy-page__main:focus-visible,
+.ak-copy-page__toggle:focus-visible,
+.ak-copy-page__menu button:focus-visible {
+  outline: 2px solid var(--md-accent-fg-color);
+  outline-offset: 2px;
+}
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
.ak-copy-page__main:hover,
.ak-copy-page__toggle:hover,
.ak-copy-page__toggle[aria-expanded='true'] {
background: var(--md-default-fg-color--lightest);
border-color: var(--md-default-fg-color--lighter);
}
.ak-copy-page__main:hover,
.ak-copy-page__toggle:hover,
.ak-copy-page__toggle[aria-expanded='true'] {
background: var(--md-default-fg-color--lightest);
border-color: var(--md-default-fg-color--lighter);
}
.ak-copy-page__main:focus-visible,
.ak-copy-page__toggle:focus-visible,
.ak-copy-page__menu button:focus-visible {
outline: 2px solid var(--md-accent-fg-color);
outline-offset: 2px;
}
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@docs/docs/assets/stylesheets/copy-page.css` around lines 41 - 46, Add visible
keyboard focus styles for the copy controls by extending the existing state rule
around .ak-copy-page__main and .ak-copy-page__toggle to include appropriate
focus selectors, including the menu buttons used by the disclosure widget.
Ensure focused controls have a reliable visual indicator without removing the
current hover or expanded-state styling.


.ak-copy-page__main svg,
.ak-copy-page__toggle svg {
flex: 0 0 auto;
opacity: 0.85;
}

.ak-copy-page__menu {
position: absolute;
top: calc(100% + 6px);
right: 0;
min-width: 280px;
background: var(--md-default-bg-color);
border: 1px solid var(--md-default-fg-color--lightest);
border-radius: 0.55rem;
padding: 0.3rem;
box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35),
0 2px 6px rgba(0, 0, 0, 0.18);
display: flex;
flex-direction: column;
gap: 0.1rem;
z-index: 10;
}

.ak-copy-page__menu[hidden] {
display: none;
}

[data-md-color-scheme='default'] .ak-copy-page__menu {
box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12),
0 2px 6px rgba(15, 23, 42, 0.06);
}

.ak-copy-page__menu button {
background: none;
border: none;
color: var(--md-default-fg-color);
cursor: pointer;
text-align: left;
font: inherit;
padding: 0.55rem 0.6rem;
border-radius: 0.4rem;
display: grid;
grid-template-columns: 32px 1fr;
gap: 0.7rem;
align-items: center;
width: 100%;
}

.ak-copy-page__menu button:hover {
background: var(--md-default-fg-color--lightest);
}

.ak-copy-page__menu-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: 0.4rem;
background: var(--md-default-fg-color--lightest);
}

.ak-copy-page__menu-icon svg {
opacity: 0.9;
}

.ak-copy-page__menu-text {
display: flex;
flex-direction: column;
line-height: 1.2;
min-width: 0;
}

.ak-copy-page__menu-text strong {
font-weight: 600;
font-size: 0.72rem;
display: inline-flex;
align-items: center;
gap: 0.25rem;
}

.ak-copy-page__menu-text em {
font-style: normal;
font-size: 0.6rem;
opacity: 0.65;
margin-top: 2px;
}

.ak-copy-page__ext {
font-size: 0.6rem;
opacity: 0.6;
}

/* Make sure floats inside the article don't bleed past the footer. */
.md-content__inner::after {
content: '';
display: block;
clear: both;
}

/* On narrow screens, full-width the menu so it never overflows the viewport. */
@media (max-width: 480px) {
.ak-copy-page {
float: none;
display: flex;
margin: 0 0 0.75rem 0;
}
.ak-copy-page__menu {
left: 0;
right: auto;
min-width: 0;
width: 100%;
}
}
Loading
Loading