remove .github
This commit is contained in:
6
.github/FUNDING.yml
vendored
6
.github/FUNDING.yml
vendored
@@ -1,6 +0,0 @@
|
|||||||
# These are supported funding model platforms
|
|
||||||
|
|
||||||
github: sethcottle
|
|
||||||
patreon: sethcottle
|
|
||||||
ko_fi: sethcottle
|
|
||||||
custom: ["https://buymeacoffee.com/seth", "https://paypal.me/sethcottle"]
|
|
||||||
42
.github/PULL_REQUEST_TEMPLATE.md
vendored
42
.github/PULL_REQUEST_TEMPLATE.md
vendored
@@ -1,42 +0,0 @@
|
|||||||
## 📄 Description
|
|
||||||
<!-- Provide a short description of the brand you're adding or the changes you're making. Include context about why this is a valuable addition. -->
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## ✅ Contribution Checklist
|
|
||||||
Please confirm that you've met the following criteria before submitting your contribution:
|
|
||||||
|
|
||||||
- [ ] **Widespread Recognition:** The brand has widespread recognition and is suitable for the core LittleLink repository (most additions belong in [LittleLink Extended](https://github.com/sethcottle/littlelink-extended)).
|
|
||||||
- [ ] **Brand Styling Guidelines:** You’ve followed the brand's official styling guidelines (if available).
|
|
||||||
- [ ] **Consistent Styling:** If no guidelines exist, the button style is consistent with the brand's public image (e.g., website, social media).
|
|
||||||
- [ ] **Icon Clarity:** The brand's logo/icon is clear and recognizable in a 24x24px format.
|
|
||||||
- [ ] If the primary logo doesn’t scale well, you’ve adapted it using the brand’s social media avatar or favicon while maintaining the essence of the original logo.
|
|
||||||
- [ ] The icon is provided in `.svg` format.
|
|
||||||
- [ ] **Theme Testing:** You've tested the button against both light and dark themes:
|
|
||||||
- [ ] Manually swapped `theme-auto.css` with `theme-light.css` and `theme-dark.css` in `index.html` to check contrast or used [LittleLink Button Builder](https://builder.littlelink.io) contrast checker.
|
|
||||||
- [ ] Added a `#000000`/`#FFFFFF` stroke if necessary to improve contrast and accessibility. [LittleLink Button Builder](https://builder.littlelink.io) will automatically recommend when to add a stroke.
|
|
||||||
- [ ] **Accessibility Compliance:** The button's background and text colors meet visual accessibility standards (unless it contradicts brand guidelines).
|
|
||||||
- [ ] **Alphabetical Order:** Your contribution is alphabetically organized in `brands.css` and `index.html`.
|
|
||||||
- [ ] **Button Preview:** You've added a button preview in `index.html`.
|
|
||||||
- [ ] **Variant Naming Schema:** If adding a variant button (e.g., inverted color scheme):
|
|
||||||
- [ ] Naming follows the existing pattern (`[Brand Name] Alt` and `.button-brandname-alt`).
|
|
||||||
- [ ] Any additional icons are named according to `brandname-alt.svg` schema.
|
|
||||||
- [ ] **Proper Capitalization:**
|
|
||||||
- [ ] In `brands.css`, the brand name comment follows `/* Brand Name */` format.
|
|
||||||
- [ ] Code uses lowercase for `.button.button-brandname`.
|
|
||||||
- [ ] In `index.html`, comments reflect `<!-- Brand Name -->` format.
|
|
||||||
- [ ] Button text and `alt` attributes match the brand’s official capitalization.
|
|
||||||
- [ ] **PR Details:**
|
|
||||||
- [ ] Included a brief description of the brand addition.
|
|
||||||
- [ ] Included a screenshot of the new button(s).
|
|
||||||
- [ ] Provided relevant information on the brand’s global/regional reach or usage stats.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 📸 Screenshot
|
|
||||||
<!-- Attach a screenshot of the new button(s) to ensure consistency and clarity. -->
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 🚀 Additional Notes
|
|
||||||
<!-- Add any other information that might help the reviewer understand the changes better (e.g., source of logo, special handling, etc.). -->
|
|
||||||
242
.github/workflows/contrast-check.yml
vendored
242
.github/workflows/contrast-check.yml
vendored
@@ -1,242 +0,0 @@
|
|||||||
name: "Contrast Check"
|
|
||||||
on:
|
|
||||||
pull_request:
|
|
||||||
paths:
|
|
||||||
- 'css/brands.css'
|
|
||||||
workflow_dispatch: # Manual trigger for testing
|
|
||||||
|
|
||||||
jobs:
|
|
||||||
contrast-check:
|
|
||||||
runs-on: ubuntu-latest
|
|
||||||
steps:
|
|
||||||
- name: Checkout code
|
|
||||||
uses: actions/checkout@v3
|
|
||||||
with:
|
|
||||||
fetch-depth: 0
|
|
||||||
|
|
||||||
- name: Setup for PR comparison
|
|
||||||
run: |
|
|
||||||
echo "Fetching base branch for comparison"
|
|
||||||
git fetch origin ${{ github.base_ref }}
|
|
||||||
|
|
||||||
- name: Contrast Check (Review Me)
|
|
||||||
run: |
|
|
||||||
cat > contrast-check.sh << 'EOF'
|
|
||||||
#!/bin/bash
|
|
||||||
|
|
||||||
# WCAG Minimum Contrast Ratio
|
|
||||||
MIN_CONTRAST=4.5
|
|
||||||
|
|
||||||
FAILED=0
|
|
||||||
ALL_RESOLVED=1
|
|
||||||
NEEDS_MANUAL_REVIEW=0
|
|
||||||
|
|
||||||
# Only get buttons that were modified in the PR
|
|
||||||
echo "Finding changed button styles..."
|
|
||||||
BUTTON_CLASSES=$(git diff origin/$GITHUB_BASE_REF -- css/brands.css | grep -E "^\+.*\.button-[a-zA-Z0-9]+" | sed -E 's/.*\.button-([a-zA-Z0-9]+).*/\1/' | sort -u)
|
|
||||||
|
|
||||||
if [[ -z "$BUTTON_CLASSES" ]]; then
|
|
||||||
echo "✅ No button changes to check."
|
|
||||||
exit 0
|
|
||||||
fi
|
|
||||||
|
|
||||||
echo "Found button classes to check: $BUTTON_CLASSES"
|
|
||||||
echo "🔍 Auditing CSS for contrast issues..."
|
|
||||||
|
|
||||||
# Function to normalize hex colors to lowercase
|
|
||||||
normalize_color() {
|
|
||||||
local color="$1"
|
|
||||||
if [[ -n "$color" ]]; then
|
|
||||||
echo "$color" | tr '[:upper:]' '[:lower:]'
|
|
||||||
else
|
|
||||||
echo ""
|
|
||||||
fi
|
|
||||||
}
|
|
||||||
|
|
||||||
# Function to calculate luminance
|
|
||||||
get_luminance() {
|
|
||||||
local color="$1"
|
|
||||||
|
|
||||||
if [[ -z "$color" || "$color" == "#" ]]; then
|
|
||||||
echo 0
|
|
||||||
return
|
|
||||||
fi
|
|
||||||
|
|
||||||
color="${color#'#'}"
|
|
||||||
|
|
||||||
if [[ ${#color} -ne 6 ]]; then
|
|
||||||
echo 0
|
|
||||||
return
|
|
||||||
fi
|
|
||||||
|
|
||||||
r=$(printf "%d" 0x${color:0:2} 2>/dev/null || echo 0)
|
|
||||||
g=$(printf "%d" 0x${color:2:2} 2>/dev/null || echo 0)
|
|
||||||
b=$(printf "%d" 0x${color:4:2} 2>/dev/null || echo 0)
|
|
||||||
|
|
||||||
r=$(awk "BEGIN { print ($r/255 <= 0.03928) ? ($r/255)/12.92 : ((($r/255) + 0.055)/1.055) ^ 2.4 }")
|
|
||||||
g=$(awk "BEGIN { print ($g/255 <= 0.03928) ? ($g/255)/12.92 : ((($g/255) + 0.055)/1.055) ^ 2.4 }")
|
|
||||||
b=$(awk "BEGIN { print ($b/255 <= 0.03928) ? ($b/255)/12.92 : ((($b/255) + 0.055)/1.055) ^ 2.4 }")
|
|
||||||
|
|
||||||
echo $(awk "BEGIN { print (0.2126 * $r) + (0.7152 * $g) + (0.0722 * $b) }")
|
|
||||||
}
|
|
||||||
|
|
||||||
# Function to calculate contrast ratio
|
|
||||||
get_contrast_ratio() {
|
|
||||||
local lum1=$(get_luminance "$1")
|
|
||||||
local lum2=$(get_luminance "$2")
|
|
||||||
|
|
||||||
if [[ -z "$lum1" || -z "$lum2" ]]; then
|
|
||||||
echo 0
|
|
||||||
return
|
|
||||||
fi
|
|
||||||
|
|
||||||
if (( $(awk "BEGIN { print ($lum1 > $lum2) ? 1 : 0 }") )); then
|
|
||||||
awk "BEGIN { printf \"%.5f\", ($lum1 + 0.05) / ($lum2 + 0.05) }"
|
|
||||||
else
|
|
||||||
awk "BEGIN { printf \"%.5f\", ($lum2 + 0.05) / ($lum1 + 0.05) }"
|
|
||||||
fi
|
|
||||||
}
|
|
||||||
|
|
||||||
# Function to extract hex color
|
|
||||||
extract_color() {
|
|
||||||
local input="$1"
|
|
||||||
local color=""
|
|
||||||
|
|
||||||
if [[ "$input" =~ "#[0-9a-fA-F]{6}" ]]; then
|
|
||||||
color=$(echo "$input" | grep -o "#[0-9a-fA-F]\{6\}")
|
|
||||||
elif [[ "$input" =~ "1px solid #" ]]; then
|
|
||||||
color=$(echo "$input" | sed -E 's/.*1px solid (#[0-9a-fA-F]{6}).*/\1/')
|
|
||||||
elif [[ "$input" =~ "solid #" ]]; then
|
|
||||||
color=$(echo "$input" | sed -E 's/.*solid (#[0-9a-fA-F]{6}).*/\1/')
|
|
||||||
elif [[ "$input" =~ "#" ]]; then
|
|
||||||
color=$(echo "$input" | grep -o "#[0-9a-fA-F]*" | head -1)
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Return normalized (lowercase) hex color
|
|
||||||
normalize_color "$color"
|
|
||||||
}
|
|
||||||
|
|
||||||
# Check contrast
|
|
||||||
check_contrast() {
|
|
||||||
local text_color="$1"
|
|
||||||
local background_color="$2"
|
|
||||||
local context="$3"
|
|
||||||
local border_color="$4"
|
|
||||||
local recommend_stroke="$5"
|
|
||||||
local is_background_check="$6"
|
|
||||||
local button_name="$7"
|
|
||||||
local check_failed=0
|
|
||||||
|
|
||||||
# Normalize all colors to lowercase for comparison
|
|
||||||
text_color=$(normalize_color "$text_color")
|
|
||||||
background_color=$(normalize_color "$background_color")
|
|
||||||
border_color=$(normalize_color "$border_color")
|
|
||||||
recommend_stroke=$(normalize_color "$recommend_stroke")
|
|
||||||
|
|
||||||
if [[ -z "$text_color" || -z "$background_color" ]]; then
|
|
||||||
return 0
|
|
||||||
fi
|
|
||||||
|
|
||||||
local contrast_ratio=$(get_contrast_ratio "$text_color" "$background_color")
|
|
||||||
|
|
||||||
if [[ -z "$contrast_ratio" ]]; then
|
|
||||||
contrast_ratio=0
|
|
||||||
fi
|
|
||||||
|
|
||||||
contrast_ratio=$(printf "%.2f" "$contrast_ratio")
|
|
||||||
|
|
||||||
# Case-insensitive comparison for hex colors
|
|
||||||
if (( $(awk "BEGIN { print ($contrast_ratio < $MIN_CONTRAST) ? 1 : 0 }") )); then
|
|
||||||
if [[ -n "$border_color" && "$border_color" == "$recommend_stroke" && "$is_background_check" -eq 1 ]]; then
|
|
||||||
echo "✅ [$context → $button_name] Contrast ratio $contrast_ratio fails WCAG but has a $recommend_stroke border → Treated as passing."
|
|
||||||
echo "✅ [$context → $button_name] Issue resolved by stroke → Fully passing."
|
|
||||||
check_failed=0
|
|
||||||
else
|
|
||||||
echo "❌ [$context → $button_name] Contrast ratio $contrast_ratio fails WCAG — Recommend adding a $recommend_stroke stroke."
|
|
||||||
check_failed=1
|
|
||||||
fi
|
|
||||||
else
|
|
||||||
echo "✅ [$context → $button_name] Contrast ratio $contrast_ratio passes WCAG"
|
|
||||||
check_failed=0
|
|
||||||
fi
|
|
||||||
|
|
||||||
return $check_failed
|
|
||||||
}
|
|
||||||
|
|
||||||
# For each button class, check its properties
|
|
||||||
for button_class in $BUTTON_CLASSES; do
|
|
||||||
echo "Checking button: $button_class"
|
|
||||||
|
|
||||||
# Extract button section
|
|
||||||
# Avoid partial matches
|
|
||||||
button_start=$(grep -n "\.button-$button_class\( \|{\)" css/brands.css | cut -d: -f1)
|
|
||||||
if [[ -z "$button_start" ]]; then
|
|
||||||
button_start=$(grep -n "\.button-$button_class$" css/brands.css | cut -d: -f1)
|
|
||||||
fi
|
|
||||||
|
|
||||||
if [[ -z "$button_start" ]]; then
|
|
||||||
echo "Could not find button-$button_class in css/brands.css"
|
|
||||||
continue
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Look for the next closing bracket
|
|
||||||
button_end=$(tail -n +$button_start css/brands.css | grep -n "}" | head -1 | cut -d: -f1)
|
|
||||||
if [[ -z "$button_end" ]]; then
|
|
||||||
button_end=10
|
|
||||||
fi
|
|
||||||
|
|
||||||
button_section=$(tail -n +$button_start css/brands.css | head -n $button_end)
|
|
||||||
|
|
||||||
# Check for gradient
|
|
||||||
if echo "$button_section" | grep -q "background-image"; then
|
|
||||||
echo "🚩 [./css/brands.css → $button_class] Detected gradient background → Flagging for manual review."
|
|
||||||
NEEDS_MANUAL_REVIEW=1
|
|
||||||
continue
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Extract colors
|
|
||||||
text_color=$(echo "$button_section" | grep "button-text" | grep -o "#[0-9A-Fa-f]*")
|
|
||||||
bg_color=$(echo "$button_section" | grep "button-background" | grep -o "#[0-9A-Fa-f]*")
|
|
||||||
border_color=$(extract_color "$(echo "$button_section" | grep "button-border")")
|
|
||||||
|
|
||||||
button_failed=0
|
|
||||||
|
|
||||||
# Check text vs background
|
|
||||||
if [[ -n "$text_color" && -n "$bg_color" ]]; then
|
|
||||||
check_contrast "$text_color" "$bg_color" "TEXT vs BUTTON" "$border_color" "" 0 "$button_class"
|
|
||||||
button_failed=$((button_failed | $?))
|
|
||||||
fi
|
|
||||||
|
|
||||||
# Check button vs light theme
|
|
||||||
if [[ -n "$bg_color" ]]; then
|
|
||||||
check_contrast "#ffffff" "$bg_color" "BUTTON vs LIGHT THEME" "$border_color" "#000000" 1 "$button_class"
|
|
||||||
button_failed=$((button_failed | $?))
|
|
||||||
|
|
||||||
# Check button vs dark theme
|
|
||||||
check_contrast "#121212" "$bg_color" "BUTTON vs DARK THEME" "$border_color" "#ffffff" 1 "$button_class"
|
|
||||||
button_failed=$((button_failed | $?))
|
|
||||||
fi
|
|
||||||
|
|
||||||
if [[ $button_failed -eq 1 ]]; then
|
|
||||||
FAILED=1
|
|
||||||
ALL_RESOLVED=0
|
|
||||||
fi
|
|
||||||
done
|
|
||||||
|
|
||||||
# Final report
|
|
||||||
if [[ "$NEEDS_MANUAL_REVIEW" -eq 1 ]]; then
|
|
||||||
echo "⚠️ Manual review required for gradients!"
|
|
||||||
exit 1
|
|
||||||
elif [[ "$ALL_RESOLVED" -eq 1 ]]; then
|
|
||||||
echo "✅ All contrast checks passed!"
|
|
||||||
exit 0
|
|
||||||
else
|
|
||||||
echo "❌ Contrast issues found!"
|
|
||||||
exit 1
|
|
||||||
fi
|
|
||||||
EOF
|
|
||||||
|
|
||||||
chmod +x contrast-check.sh
|
|
||||||
./contrast-check.sh
|
|
||||||
env:
|
|
||||||
GITHUB_BASE_REF: ${{ github.base_ref }}
|
|
||||||
Reference in New Issue
Block a user