parvion/laravel-accessibility
最新稳定版本:v1.1.0
Composer 安装命令:
composer require parvion/laravel-accessibility
包简介
A customizable floating accessibility toolbar for web projects with font size control, high contrast mode, dyslexia support, and more.
关键字:
README 文档
README
A floating accessibility toolbar for Laravel. Helps users adjust font size, colors, and use screen reader. No external dependencies - uses inline SVG icons.
Quick Start
composer require parvion/laravel-accessibility
Add this in your layout:
<div id="accessibility-toolbar"></div>
Done! 🎉
Features
| Category | Features |
|---|---|
| Font | Font Size, Dyslexia Font, Text Spacing, Line Height |
| Colors | High Contrast, Grayscale, Invert Colors |
| Content | Highlight Links, Highlight Headings, Big Cursor, Hide Images |
| Screen Reader | Read Page, Read Selected, Hover Speech, Stop |
Requirements
- PHP ^7.4 or ^8.0+
- Laravel 8.0+
Installation
composer require parvion/laravel-accessibility
That's it! The package auto-injects CSS and JS when it finds the div.
Usage
Add this empty div where you want the toolbar to appear:
<div id="accessibility-toolbar"></div>
The package automatically handles everything.
Customization (Optional)
Want to change colors or disable features?
Step 1: Publish Config
php artisan vendor:publish --provider="Parvion\LaravelAccessibility\AccessibilityServiceProvider" --tag=accessibility-config
Step 2: Edit Config
Edit config/accessibility.php:
<?php return [ // Customize toolbar colors 'colors' => [ 'primary' => '#00205b', // Header color 'secondary' => '#ff7402', // Button color 'background' => '#ffffff', // Panel background ], // Enable/disable features 'features' => [ 'font_size' => true, 'high_contrast' => true, 'grayscale' => true, 'invert_colors' => true, 'dyslexia_font' => true, 'text_spacing' => true, 'line_height' => true, 'underline_links' => true, 'highlight_links' => true, 'highlight_headings' => true, 'big_cursor' => true, 'hide_images' => true, 'screen_reader' => true, ], ];
How It Works
- Add
<div id="accessibility-toolbar"></div>in your layout - Middleware detects the div and injects:
- CSS in
<head> - JavaScript before
</body>
- CSS in
- JavaScript renders the toolbar with all features
License
MIT License
统计信息
- 总下载量: 0
- 月度下载量: 0
- 日度下载量: 0
- 收藏数: 0
- 点击次数: 12
- 依赖项目数: 0
- 推荐数: 0
其他信息
- 授权协议: MIT
- 更新时间: 2026-05-14