mirror of
https://github.com/checktheroads/hyperglass
synced 2024-05-11 05:55:08 +00:00
improve site accessibility; add new parsing_error docs
This commit is contained in:
checktheroads
@@ -24,11 +24,12 @@ All user-facing status messages can be customized if needed.
|
||||
| `invalid_field` | String | `'{input} is an invalid {field}.'` | Displayed when a query field contains an invalid or unsupported value. `{input}` and `{field}` will be replaced with the invalid input value and corresponding field name. |
|
||||
| `invalid_input` | String | `'{target} is not a valid {query_type} target.'` | Displayed when a query target's value is invalid in relation to the corresponding query type. `{target}` and `{query_type}` will be replaced with the invalid target and corresponding query type. |
|
||||
| `no_input` | String | `'{field} must be specified.'` | Displayed when no a required field is not specified. `{field}` will be replaced with the `display_name` of the field that was omitted. |
|
||||
| `no_output` | String | `'No output.'` | Displayed when hyperglass can connect to a device and execute a query, but the response is empty. |
|
||||
| `no_output` | String | `'The query completed, but no matching results were found.'` | Displayed when hyperglass can connect to a device and execute a query, but the response is empty. |
|
||||
| `no_response` | String | `'No response.'` | Displayed when hyperglass can connect to a device, but no output is able to be read. Seeing this error may indicate a bug in hyperglass or one of its dependencies. If you see this in the wild, try enabling <Link to="/docs/configuration#global-settings"><Code>debug</Code></Link> mode and review the logs to pinpoint the source of the error. |
|
||||
| `parsing_error` | String | `'An error occurred while parsing the query output.'` | Displayed when hyperglass can connect to a device and execute a query, but the response cannot be parsed. |
|
||||
| `request_timeout` | String | `'Request timed out.'` | Displayed when the <Link to="/docs/configuration#global-settings"><Code>request_timeout</Code></Link> time expires. |
|
||||
| `vrf_not_associated` | String | `'VRF {vrf_name} is not associated with {device_name}.'` | Displayed when a query request's VRF field value contains a VRF that is not configured or associated with the corresponding location/device. The UI automatically filters out VRFs that are not configured on a selected device, so this error is most likely to appear when using the hyperglass API. `{vrf_name}` and `{device_name}` will be replaced with the VRF in question and corresponding device. |
|
||||
| `vrf_not_found` | String | `'RF {vrf_name} is not defined.'` | Displayed when a query VRF is not configured on any devices. The UI only shows configured VRFs, so this error is most likely to appear when using the hyperglass API. `{vrf_name}` will be replaced with the VRF in question. |
|
||||
| `vrf_not_found` | String | `'VRF {vrf_name} is not defined.'` | Displayed when a query VRF is not configured on any devices. The UI only shows configured VRFs, so this error is most likely to appear when using the hyperglass API. `{vrf_name}` will be replaced with the VRF in question. |
|
||||
|
||||
## Example
|
||||
|
||||
@@ -43,8 +44,9 @@ messages:
|
||||
invalid_field: "{input} is an invalid {field}."
|
||||
invalid_input: "{target} is not a valid {query_type} target."
|
||||
no_input: "{field} must be specified."
|
||||
no_output: No output.
|
||||
no_output: The query completed, but no matching results were found.
|
||||
no_response: No response.
|
||||
parsing_error: An error occurred while parsing the query output.
|
||||
request_timeout: Request timed out.
|
||||
vrf_not_associated: VRF {vrf_name} is not associated with {device_name}.
|
||||
vrf_not_found: VRF {vrf_name} is not defined.
|
||||
|
||||
@@ -37,6 +37,8 @@ export const GithubButton = ({ href, ...props }) => {
|
||||
isDarkTheme ? "button--secondary" : "button--primary",
|
||||
"button button--outline"
|
||||
)}
|
||||
aria-label="Github"
|
||||
title="Github"
|
||||
{...props}
|
||||
>
|
||||
<Icon />
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
|
||||
:root {
|
||||
--ifm-code-background: rgba(0, 0, 0, 0.04);
|
||||
--ifm-code-color: var(--ifm-color-secondary-darker);
|
||||
--ifm-code-color: var(--ifm-color-secondary-darkest);
|
||||
--ifm-footer-color: var(--ifm-secondary-lightest);
|
||||
--ifm-footer-link-color: var(--ifm-secondary-lightest);
|
||||
--ifm-footer-title-color: var(--ifm-color-emphasis-800);
|
||||
@@ -57,10 +57,11 @@ html[data-theme="dark"]:root {
|
||||
--ra-color-important: var(--ifm-color-info-darkest);
|
||||
--ra-color-note: var(--ifm-color-gray-600);
|
||||
--ra-color-warning: var(--ifm-color-danger-darker);
|
||||
--ifm-blockquote-color: var(--ifm-color-emphasis-400);
|
||||
}
|
||||
|
||||
html[data-theme="dark"] .footer.footer--dark {
|
||||
--ifm-footer-color: var(--ifm-color-emphasis-300);
|
||||
--ifm-footer-color: var(--ifm-color-emphasis-400);
|
||||
--ifm-navbar-background-color: var(--ifm-background-color);
|
||||
}
|
||||
|
||||
@@ -78,6 +79,7 @@ html[data-theme="dark"] .footer.footer--dark {
|
||||
html[data-theme="dark"] {
|
||||
--ifm-code-background: rgba(255, 255, 255, 0.08);
|
||||
--ifm-code-color: var(--ifm-color-secondary-lightest);
|
||||
--ifm-footer-link-color: ;
|
||||
/* #ace8cd
|
||||
#b6a7e2
|
||||
#dc7381
|
||||
@@ -86,10 +88,20 @@ html[data-theme="dark"] {
|
||||
|
||||
.admonition {
|
||||
--ifm-code-background: rgba(255, 255, 255, 0.5);
|
||||
--ifm-code-color: var(--ifm-color-secondary-darker);
|
||||
--ifm-code-color: var(--ifm-color-secondary-darkest);
|
||||
--ifm-link-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.admonition.alert--success .admonition-content a,
|
||||
.admonition.alert--warning .admonition-content a,
|
||||
.admonition.alert--critical .admonition-content a {
|
||||
color: var(--ifm-color-black);
|
||||
}
|
||||
|
||||
.admonition.admonition-note .admonition-content code {
|
||||
--ifm-code-color: var(--ifm-color-gray-900);
|
||||
}
|
||||
|
||||
.admonition a:hover {
|
||||
color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
@@ -14,110 +14,109 @@ import useBaseUrl from "@docusaurus/useBaseUrl";
|
||||
import styles from "./styles.module.css";
|
||||
|
||||
function FooterLink({ to, href, label, ...props }) {
|
||||
const toUrl = useBaseUrl(to);
|
||||
return (
|
||||
<Link
|
||||
className="footer__link-item"
|
||||
{...(href
|
||||
? {
|
||||
target: "_blank",
|
||||
rel: "noopener noreferrer",
|
||||
href
|
||||
}
|
||||
: {
|
||||
to: toUrl
|
||||
})}
|
||||
{...props}
|
||||
>
|
||||
{label}
|
||||
</Link>
|
||||
);
|
||||
const toUrl = useBaseUrl(to);
|
||||
return (
|
||||
<Link
|
||||
className="footer__link-item"
|
||||
{...(href
|
||||
? {
|
||||
target: "_blank",
|
||||
rel: "noopener noreferrer",
|
||||
href,
|
||||
}
|
||||
: {
|
||||
to: toUrl,
|
||||
})}
|
||||
{...props}
|
||||
>
|
||||
{label}
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
const FooterLogo = ({ url, alt }) => <img className="footer__logo" alt={alt} src={url} />;
|
||||
const FooterLogo = ({ url, alt }) => (
|
||||
<img className="footer__logo" alt={alt} src={url} />
|
||||
);
|
||||
|
||||
function Footer() {
|
||||
const context = useDocusaurusContext();
|
||||
const { siteConfig = {} } = context;
|
||||
const { themeConfig = {} } = siteConfig;
|
||||
const { footer } = themeConfig;
|
||||
const context = useDocusaurusContext();
|
||||
const { siteConfig = {} } = context;
|
||||
const { themeConfig = {} } = siteConfig;
|
||||
const { footer } = themeConfig;
|
||||
|
||||
const { copyright, links = [], logo = {} } = footer || {};
|
||||
const logoUrl = useBaseUrl(logo.src);
|
||||
const { copyright, links = [], logo = {} } = footer || {};
|
||||
const logoUrl = useBaseUrl(logo.src);
|
||||
|
||||
if (!footer) {
|
||||
return null;
|
||||
}
|
||||
if (!footer) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return (
|
||||
<footer
|
||||
className={classnames("footer", {
|
||||
"footer--dark": footer.style === "dark"
|
||||
})}
|
||||
>
|
||||
<div className="container">
|
||||
{links && links.length > 0 && (
|
||||
<div className="row footer__links">
|
||||
{links.map((linkItem, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className={classnames("col footer__col", styles.footerCol)}
|
||||
>
|
||||
{linkItem.title != null ? (
|
||||
<h4 className="footer__title">{linkItem.title}</h4>
|
||||
) : null}
|
||||
{linkItem.items != null &&
|
||||
Array.isArray(linkItem.items) &&
|
||||
linkItem.items.length > 0 ? (
|
||||
<ul className="footer__items">
|
||||
{linkItem.items.map((item, key) =>
|
||||
item.html ? (
|
||||
<li
|
||||
key={key}
|
||||
className="footer__item"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: item.html
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<li
|
||||
key={item.href || item.to}
|
||||
className="footer__item"
|
||||
>
|
||||
<FooterLink {...item} />
|
||||
</li>
|
||||
)
|
||||
)}
|
||||
</ul>
|
||||
) : null}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
return (
|
||||
<footer
|
||||
className={classnames("footer", {
|
||||
"footer--dark": footer.style === "dark",
|
||||
})}
|
||||
>
|
||||
<div className="container">
|
||||
{links && links.length > 0 && (
|
||||
<div className="row footer__links">
|
||||
{links.map((linkItem, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className={classnames("col footer__col", styles.footerCol)}
|
||||
>
|
||||
{linkItem.title != null ? (
|
||||
<h4 className="footer__title">{linkItem.title}</h4>
|
||||
) : null}
|
||||
{linkItem.items != null &&
|
||||
Array.isArray(linkItem.items) &&
|
||||
linkItem.items.length > 0 ? (
|
||||
<ul className="footer__items">
|
||||
{linkItem.items.map((item, key) =>
|
||||
item.html ? (
|
||||
<li
|
||||
key={key}
|
||||
className="footer__item"
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: item.html,
|
||||
}}
|
||||
/>
|
||||
) : (
|
||||
<li key={item.href || item.to} className="footer__item">
|
||||
<FooterLink {...item} />
|
||||
</li>
|
||||
)
|
||||
)}
|
||||
</ul>
|
||||
) : null}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
{(logo || copyright) && (
|
||||
<div className="text--center">
|
||||
{logo && logo.src && (
|
||||
<div className="margin-bottom--sm">
|
||||
{logo.href ? (
|
||||
<a
|
||||
href={logo.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className={styles.footerLogoLink}
|
||||
>
|
||||
<FooterLogo alt={logo.alt} url={logoUrl} />
|
||||
</a>
|
||||
) : (
|
||||
<FooterLogo alt={logo.alt} url={logoUrl} />
|
||||
)}
|
||||
{(logo || copyright) && (
|
||||
<div className="text--center">
|
||||
{logo && logo.src && (
|
||||
<div className="margin-bottom--sm">
|
||||
{logo.href ? (
|
||||
<a
|
||||
href={logo.href}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className={styles.footerLogoLink}
|
||||
>
|
||||
<FooterLogo alt={logo.alt} url={logoUrl} />
|
||||
</a>
|
||||
) : (
|
||||
<FooterLogo alt={logo.alt} url={logoUrl} />
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{copyright}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
</div>
|
||||
)}
|
||||
{copyright}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
|
||||
export default Footer;
|
||||
|
||||
@@ -98,7 +98,12 @@ function Navbar() {
|
||||
<div className="navbar__inner">
|
||||
<div className={classnames("navbar__items", styles.navbarItems)}>
|
||||
{!isMobile && (
|
||||
<Link className="navbar__brand" to={baseUrl}>
|
||||
<Link
|
||||
className="navbar__brand"
|
||||
to={baseUrl}
|
||||
aria-label="Home"
|
||||
title="Home"
|
||||
>
|
||||
<Logo size={32} className={styles.logo} />
|
||||
{title != null && (
|
||||
<strong
|
||||
@@ -149,7 +154,12 @@ function Navbar() {
|
||||
)}
|
||||
>
|
||||
{isMobile && (
|
||||
<Link className="navbar__brand" to={baseUrl}>
|
||||
<Link
|
||||
className="navbar__brand"
|
||||
to={baseUrl}
|
||||
aria-label="Home"
|
||||
title="Home"
|
||||
>
|
||||
<Logo size={32} className={styles.logo} />
|
||||
{title != null && (
|
||||
<strong
|
||||
@@ -190,7 +200,12 @@ function Navbar() {
|
||||
/>
|
||||
<div className="navbar-sidebar">
|
||||
<div className="navbar-sidebar__brand">
|
||||
<Link className="navbar__brand" to={baseUrl}>
|
||||
<Link
|
||||
className="navbar__brand"
|
||||
to={baseUrl}
|
||||
aria-label="Home"
|
||||
title="Home"
|
||||
>
|
||||
<Logo size={32} className={styles.logo} />
|
||||
{title != null && (
|
||||
<strong
|
||||
|
||||
Reference in New Issue
Block a user