⚠ This page is served via a proxy. Original site: https://github.com
This service does not collect credentials or authentication data.
Skip to content
Merged
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
38 changes: 37 additions & 1 deletion docs/development.md
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,43 @@ Please be aware that changes to the admin backend templates can break the functi
The default CSS theme is located in the **assets/templates/default** directory and is stored in the file **theme.css**.
You can create your own CSS theme by copying the default theme and modifying it to suit your needs.
The CSS theme is based on Bootstrap’s CSS custom properties for fast and forward-looking design and development.
We support a light and a dark mode in our default theme.
phpMyFAQ officially supports three modes in the default theme: **Light**, **Dark**, and **High Contrast**.
**Accessibility Guidelines:**
The High Contrast mode is specifically engineered for users with visual impairments and features the __Atkinson Hyperlegible Next__ font to maximize character recognition.

* **Prioritize Legibility:** When customizing this mode, avoid "visual noise" such as text-shadows, transitions, or decorative gradients that could interfere with assistive technologies.
* **Contrast Standards:** Customizations **must** adhere to the [WCAG 2.2 Contrast Guidelines](https://www.w3.org/TR/WCAG22/). For the High Contrast theme, we aim for **Level AAA**, requiring a contrast ratio of at least **7:1** for normal text and **4.5:1** for large text.

**Defining Mode-Specific CSS:**
phpMyFAQ uses Bootstrap’s color mode architecture. You can target specific modes using the **data-bs-theme** attribute in your CSS:

```css
/* Default (Light) Mode */
:root {
--primary-text: #212529;
}

/* Dark Mode */
[data-bs-theme='dark'] {
--primary-text: #eceff9;
}

/* High Contrast Mode (A11y focused) */
[data-bs-theme='high-contrast'] {
/* Enforce maximum contrast ratio (WCAG AAA) */
--primary-text: #ffff00;
--primary-bg: #000000;

/*
We use !important here to ensure that accessibility-critical styles
cannot be accidentally overridden by decorative styles or third-party
plugins, maintaining the integrity of the high-contrast interface.
*/
text-shadow: none !important;
box-shadow: none !important;
}
```

For more information, check out the documentation on [Bootstrap](https://getbootstrap.com/docs/5.3/customize/css-variables/).

## 8.4 Custom CSS
Expand Down
19 changes: 16 additions & 3 deletions docs/usage.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,10 @@

The public phpMyFAQ frontend has a simple, HTML5 / CCS3-based default layout based on
[Bootstrap v5.3](https://getbootstrap.com/docs/5.3/).
To ensure the best possible user experience for everyone, phpMyFAQ supports three distinct visual modes, which can be toggled via the theme switcher in the header:
* **Light Mode:** The classic bright interface.
* **Dark Mode:** A reduced-glare interface for low-light environments.
* **High Contrast Mode:** Specifically designed for better accessibility (**A11y**). It features the __Atkinson Hyperlegible Next__ font to maximize character recognition and strictly adheres to high contrast standards (WCAG AAA).
The header has the main links for all categories, propose new FAQs, add questions, open questions, and a login.
On the left side you only see the main categories.
You can also change the current language at the bottom of the FAQ,
Expand Down Expand Up @@ -53,6 +57,10 @@ If a user is logged in, the name and e-mail address are filled automatically.
## 4.6 Ask questions

On the _Ask question_ page, it's possible for all users to add a new question without an answer.

Note for Guests:
By default, guests can only submit questions if the administrator has enabled the setting "Allow adding questions for guests" in the configuration. If this setting is disabled, guests must log in to access the form.

If the question is submitted, phpMyFAQ checks the words for the question and will do a full text search on the database
with the existing FAQs.
If we found some matches, the user will get some recommendations depending on the question he submitted.
Expand All @@ -65,9 +73,14 @@ If a user is logged in, the name and email address are filled automatically.

## 4.7 Open questions

This page displays all open questions, and it's possible for all users to add an answer for this question.
The user will be directed to the "Add FAQ" page.
If the spam protection is enabled, they have to enter the correct captcha code, too.
This page displays all open questions. Depending on the configuration and user permissions, the page offers the following options:

* **Answer question:** Users with the required permissions can add an answer. This is also available for guests if the setting **"Allow adding new FAQs for guests"** is enabled, as answering an open question technically creates a new FAQ entry. By clicking the button, the user is directed to the "Add FAQ" page, where the question and the category selected by the inquirer are automatically pre-filled into the form. If spam protection is enabled, the correct captcha code must also be entered.
* **Read answer:** If the option **"Close open question after answer?"** is enabled and an answer to a question already exists in the system, a direct link to the corresponding FAQ entry is displayed. This allows users to access the existing solution directly.

If both the "Allow adding new FAQs for guests" setting and the "Close open question after answer?" setting are disabled or a user does not have the corresponding **user permissions**, the page serves as a read-only overview. In this case, **guests and restricted users** can view the questions but are not authorized to provide answers or access existing answers through this list.

Furthermore, the **number of questions** that have not yet been approved or published by an administrator is displayed at the bottom of the list. This serves as a confirmation for inquirers that their submitted question has been successfully received by the system and is currently awaiting moderation.

## 4.8 User registration

Expand Down