|
|
@@ -2,8 +2,9 @@
|
|
|
use Knuckles\Scribe\Tools\WritingUtils as u;
|
|
|
@endphp
|
|
|
|
|
|
- <!doctype html>
|
|
|
+<!doctype html>
|
|
|
<html lang="en">
|
|
|
+
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
|
|
|
@@ -16,27 +17,32 @@
|
|
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.10/lodash.min.js"></script>
|
|
|
|
|
|
- <link rel="stylesheet"
|
|
|
- href="https://unpkg.com/@highlightjs/cdn-assets@11.6.0/styles/docco.min.css">
|
|
|
+ <link rel="stylesheet" href="https://unpkg.com/@highlightjs/cdn-assets@11.6.0/styles/docco.min.css">
|
|
|
<script src="https://unpkg.com/@highlightjs/cdn-assets@11.6.0/highlight.min.js"></script>
|
|
|
- <script>hljs.highlightAll();</script>
|
|
|
+ <script>
|
|
|
+ hljs.highlightAll();
|
|
|
+ </script>
|
|
|
<script type="module">
|
|
|
- import {CodeJar} from 'https://medv.io/codejar/codejar.js'
|
|
|
+ import {
|
|
|
+ CodeJar
|
|
|
+ } from 'https://medv.io/codejar/codejar.js'
|
|
|
window.CodeJar = CodeJar;
|
|
|
</script>
|
|
|
|
|
|
- @if($tryItOut['enabled'] ?? true)
|
|
|
+ @if ($tryItOut['enabled'] ?? true)
|
|
|
<script>
|
|
|
var tryItOutBaseUrl = "{{ $tryItOut['base_url'] ?? config('app.url') }}";
|
|
|
var useCsrf = Boolean({{ $tryItOut['use_csrf'] ?? null }});
|
|
|
var csrfUrl = "{{ $tryItOut['csrf_url'] ?? null }}";
|
|
|
</script>
|
|
|
- <script src="{{ u::getVersionedAsset($assetPathPrefix.'js/tryitout.js') }}"></script>
|
|
|
+ <script src="{{ u::getVersionedAsset($assetPathPrefix . 'js/tryitout.js') }}"></script>
|
|
|
<style>
|
|
|
- .code-editor, .response-content {
|
|
|
+ .code-editor,
|
|
|
+ .resp-content {
|
|
|
color: whitesmoke;
|
|
|
background-color: transparent;
|
|
|
}
|
|
|
+
|
|
|
/*
|
|
|
Problem: we want syntax highlighting for the Try It Out JSON body code editor
|
|
|
However, the Try It Out area uses a dark background, while request and response samples
|
|
|
@@ -48,19 +54,21 @@
|
|
|
Since it's only JSON, we only need a few styles anyway.
|
|
|
Styles taken from the Nord theme: https://github.com/highlightjs/highlight.js/blob/3997c9b430a568d5ad46d96693b90a74fc01ea7f/src/styles/nord.css#L2
|
|
|
*/
|
|
|
- .code-editor > .hljs-attr {
|
|
|
+ .code-editor>.hljs-attr {
|
|
|
color: #8FBCBB;
|
|
|
}
|
|
|
- .code-editor > .hljs-string {
|
|
|
+
|
|
|
+ .code-editor>.hljs-string {
|
|
|
color: #A3BE8C;
|
|
|
}
|
|
|
- .code-editor > .hljs-number {
|
|
|
+
|
|
|
+ .code-editor>.hljs-number {
|
|
|
color: #B48EAD;
|
|
|
}
|
|
|
- .code-editor > .hljs-literal{
|
|
|
+
|
|
|
+ .code-editor>.hljs-literal {
|
|
|
color: #81A1C1;
|
|
|
}
|
|
|
-
|
|
|
</style>
|
|
|
|
|
|
<script>
|
|
|
@@ -75,7 +83,11 @@
|
|
|
responsePanel.hidden = true;
|
|
|
|
|
|
let form = btnElement.form;
|
|
|
- let { method, path, hasjsonbody: hasJsonBody} = form.dataset;
|
|
|
+ let {
|
|
|
+ method,
|
|
|
+ path,
|
|
|
+ hasjsonbody: hasJsonBody
|
|
|
+ } = form.dataset;
|
|
|
let body = {};
|
|
|
if (hasJsonBody === "1") {
|
|
|
body = form.querySelector('.code-editor').textContent;
|
|
|
@@ -121,7 +133,7 @@
|
|
|
.catch(err => {
|
|
|
console.error('API调用失败:', err);
|
|
|
errorPanel.hidden = false;
|
|
|
- errorPanel.querySelector('.error-message').textContent =
|
|
|
+ errorPanel.querySelector('.error-message').textContent =
|
|
|
`请求失败: ${err.message}\n请确保服务器正在运行且配置正确`;
|
|
|
})
|
|
|
.finally(() => {
|
|
|
@@ -141,197 +153,199 @@
|
|
|
|
|
|
<body>
|
|
|
|
|
|
-@if($metadata['example_languages'])
|
|
|
+ @if ($metadata['example_languages'])
|
|
|
+ <script>
|
|
|
+ function switchExampleLanguage(lang) {
|
|
|
+ document.querySelectorAll(`.example-request`).forEach(el => el.style.display = 'none');
|
|
|
+ document.querySelectorAll(`.example-request-${lang}`).forEach(el => el.style.display = 'initial');
|
|
|
+ document.querySelectorAll(`.example-request-lang-toggle`).forEach(el => el.value = lang);
|
|
|
+ }
|
|
|
+ </script>
|
|
|
+ @endif
|
|
|
+
|
|
|
<script>
|
|
|
- function switchExampleLanguage(lang) {
|
|
|
- document.querySelectorAll(`.example-request`).forEach(el => el.style.display = 'none');
|
|
|
- document.querySelectorAll(`.example-request-${lang}`).forEach(el => el.style.display = 'initial');
|
|
|
- document.querySelectorAll(`.example-request-lang-toggle`).forEach(el => el.value = lang);
|
|
|
+ function switchExampleResponse(endpointId, index) {
|
|
|
+ document.querySelectorAll(`.example-response-${endpointId}`).forEach(el => el.style.display = 'none');
|
|
|
+ document.querySelectorAll(`.example-response-${endpointId}-${index}`).forEach(el => el.style.display =
|
|
|
+ 'initial');
|
|
|
+ document.querySelectorAll(`.example-response-${endpointId}-toggle`).forEach(el => el.value = index);
|
|
|
}
|
|
|
- </script>
|
|
|
-@endif
|
|
|
-
|
|
|
-<script>
|
|
|
- function switchExampleResponse(endpointId, index) {
|
|
|
- document.querySelectorAll(`.example-response-${endpointId}`).forEach(el => el.style.display = 'none');
|
|
|
- document.querySelectorAll(`.example-response-${endpointId}-${index}`).forEach(el => el.style.display = 'initial');
|
|
|
- document.querySelectorAll(`.example-response-${endpointId}-toggle`).forEach(el => el.value = index);
|
|
|
- }
|
|
|
-
|
|
|
-
|
|
|
- /*
|
|
|
- * Requirement: a div with class `expansion-chevrons`
|
|
|
- * (or `expansion-chevrons-solid` to use the solid version).
|
|
|
- * Also add the `expanded` class if your div is expanded by default.
|
|
|
- */
|
|
|
- function toggleExpansionChevrons(evt) {
|
|
|
- let elem = evt.currentTarget;
|
|
|
-
|
|
|
- let chevronsArea = elem.querySelector('.expansion-chevrons');
|
|
|
- const solid = chevronsArea.classList.contains('expansion-chevrons-solid');
|
|
|
- const newState = chevronsArea.classList.contains('expanded') ? 'expand' : 'expanded';
|
|
|
- if (newState === 'expanded') {
|
|
|
- const selector = solid ? '#expanded-chevron-solid' : '#expanded-chevron';
|
|
|
- const template = document.querySelector(selector);
|
|
|
- const chevron = template.content.cloneNode(true);
|
|
|
- chevronsArea.replaceChildren(chevron);
|
|
|
- chevronsArea.classList.add('expanded');
|
|
|
- } else {
|
|
|
- const selector = solid ? '#expand-chevron-solid' : '#expand-chevron';
|
|
|
- const template = document.querySelector(selector);
|
|
|
- const chevron = template.content.cloneNode(true);
|
|
|
- chevronsArea.replaceChildren(chevron);
|
|
|
- chevronsArea.classList.remove('expanded');
|
|
|
+
|
|
|
+
|
|
|
+ /*
|
|
|
+ * Requirement: a div with class `expansion-chevrons`
|
|
|
+ * (or `expansion-chevrons-solid` to use the solid version).
|
|
|
+ * Also add the `expanded` class if your div is expanded by default.
|
|
|
+ */
|
|
|
+ function toggleExpansionChevrons(evt) {
|
|
|
+ let elem = evt.currentTarget;
|
|
|
+
|
|
|
+ let chevronsArea = elem.querySelector('.expansion-chevrons');
|
|
|
+ const solid = chevronsArea.classList.contains('expansion-chevrons-solid');
|
|
|
+ const newState = chevronsArea.classList.contains('expanded') ? 'expand' : 'expanded';
|
|
|
+ if (newState === 'expanded') {
|
|
|
+ const selector = solid ? '#expanded-chevron-solid' : '#expanded-chevron';
|
|
|
+ const template = document.querySelector(selector);
|
|
|
+ const chevron = template.content.cloneNode(true);
|
|
|
+ chevronsArea.replaceChildren(chevron);
|
|
|
+ chevronsArea.classList.add('expanded');
|
|
|
+ } else {
|
|
|
+ const selector = solid ? '#expand-chevron-solid' : '#expand-chevron';
|
|
|
+ const template = document.querySelector(selector);
|
|
|
+ const chevron = template.content.cloneNode(true);
|
|
|
+ chevronsArea.replaceChildren(chevron);
|
|
|
+ chevronsArea.classList.remove('expanded');
|
|
|
+ }
|
|
|
+
|
|
|
}
|
|
|
|
|
|
- }
|
|
|
-
|
|
|
- /**
|
|
|
- * 1. Make sure the children are inside the parent element
|
|
|
- * 2. Add `expandable` class to the parent
|
|
|
- * 3. Add `children` class to the children.
|
|
|
- * 4. Wrap the default chevron SVG in a div with class `expansion-chevrons`
|
|
|
- * (or `expansion-chevrons-solid` to use the solid version).
|
|
|
- * Also add the `expanded` class if your div is expanded by default.
|
|
|
- */
|
|
|
- function toggleElementChildren(evt) {
|
|
|
- let elem = evt.currentTarget;
|
|
|
- let children = elem.querySelector(`.children`);
|
|
|
- if (!children) return;
|
|
|
-
|
|
|
- if (children.contains(event.target)) return;
|
|
|
-
|
|
|
- let oldState = children.style.display
|
|
|
- if (oldState === 'none') {
|
|
|
- children.style.removeProperty('display');
|
|
|
- toggleExpansionChevrons(evt);
|
|
|
- } else {
|
|
|
- children.style.display = 'none';
|
|
|
- toggleExpansionChevrons(evt);
|
|
|
+ /**
|
|
|
+ * 1. Make sure the children are inside the parent element
|
|
|
+ * 2. Add `expandable` class to the parent
|
|
|
+ * 3. Add `children` class to the children.
|
|
|
+ * 4. Wrap the default chevron SVG in a div with class `expansion-chevrons`
|
|
|
+ * (or `expansion-chevrons-solid` to use the solid version).
|
|
|
+ * Also add the `expanded` class if your div is expanded by default.
|
|
|
+ */
|
|
|
+ function toggleElementChildren(evt) {
|
|
|
+ let elem = evt.currentTarget;
|
|
|
+ let children = elem.querySelector(`.children`);
|
|
|
+ if (!children) return;
|
|
|
+
|
|
|
+ if (children.contains(event.target)) return;
|
|
|
+
|
|
|
+ let oldState = children.style.display
|
|
|
+ if (oldState === 'none') {
|
|
|
+ children.style.removeProperty('display');
|
|
|
+ toggleExpansionChevrons(evt);
|
|
|
+ } else {
|
|
|
+ children.style.display = 'none';
|
|
|
+ toggleExpansionChevrons(evt);
|
|
|
+ }
|
|
|
+
|
|
|
+ evt.stopPropagation();
|
|
|
}
|
|
|
|
|
|
- evt.stopPropagation();
|
|
|
- }
|
|
|
+ function highlightSidebarItem(evt = null) {
|
|
|
+ if (evt && evt.oldURL) {
|
|
|
+ let oldHash = new URL(evt.oldURL).hash.slice(1);
|
|
|
+ if (oldHash) {
|
|
|
+ let previousItem = window['sidebar'].querySelector(`#toc-item-${oldHash}`);
|
|
|
+ previousItem.classList.remove('sl-bg-primary-tint');
|
|
|
+ previousItem.classList.add('sl-bg-canvas-100');
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- function highlightSidebarItem(evt = null) {
|
|
|
- if (evt && evt.oldURL) {
|
|
|
- let oldHash = new URL(evt.oldURL).hash.slice(1);
|
|
|
- if (oldHash) {
|
|
|
- let previousItem = window['sidebar'].querySelector(`#toc-item-${oldHash}`);
|
|
|
- previousItem.classList.remove('sl-bg-primary-tint');
|
|
|
- previousItem.classList.add('sl-bg-canvas-100');
|
|
|
+ let newHash = location.hash.slice(1);
|
|
|
+ if (newHash) {
|
|
|
+ let item = window['sidebar'].querySelector(`#toc-item-${newHash}`);
|
|
|
+ item.classList.remove('sl-bg-canvas-100');
|
|
|
+ item.classList.add('sl-bg-primary-tint');
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- let newHash = location.hash.slice(1);
|
|
|
- if (newHash) {
|
|
|
- let item = window['sidebar'].querySelector(`#toc-item-${newHash}`);
|
|
|
- item.classList.remove('sl-bg-canvas-100');
|
|
|
- item.classList.add('sl-bg-primary-tint');
|
|
|
- }
|
|
|
- }
|
|
|
+ addEventListener('DOMContentLoaded', () => {
|
|
|
+ highlightSidebarItem();
|
|
|
|
|
|
- addEventListener('DOMContentLoaded', () => {
|
|
|
- highlightSidebarItem();
|
|
|
+ document.querySelectorAll('.code-editor').forEach(elem => CodeJar(elem, (editor) => {
|
|
|
+ // highlight.js does not trim old tags,
|
|
|
+ // which means highlighting doesn't update on type (only on paste)
|
|
|
+ // See https://github.com/antonmedv/codejar/issues/18
|
|
|
+ editor.textContent = editor.textContent
|
|
|
+ return hljs.highlightElement(editor)
|
|
|
+ }));
|
|
|
|
|
|
- document.querySelectorAll('.code-editor').forEach(elem => CodeJar(elem, (editor) => {
|
|
|
- // highlight.js does not trim old tags,
|
|
|
- // which means highlighting doesn't update on type (only on paste)
|
|
|
- // See https://github.com/antonmedv/codejar/issues/18
|
|
|
- editor.textContent = editor.textContent
|
|
|
- return hljs.highlightElement(editor)
|
|
|
- }));
|
|
|
+ document.querySelectorAll('.expandable').forEach(el => {
|
|
|
+ el.addEventListener('click', toggleElementChildren);
|
|
|
+ });
|
|
|
|
|
|
- document.querySelectorAll('.expandable').forEach(el => {
|
|
|
- el.addEventListener('click', toggleElementChildren);
|
|
|
+ document.querySelectorAll('details').forEach(el => {
|
|
|
+ el.addEventListener('toggle', toggleExpansionChevrons);
|
|
|
+ });
|
|
|
});
|
|
|
|
|
|
- document.querySelectorAll('details').forEach(el => {
|
|
|
- el.addEventListener('toggle', toggleExpansionChevrons);
|
|
|
- });
|
|
|
- });
|
|
|
-
|
|
|
- addEventListener('hashchange', highlightSidebarItem);
|
|
|
-</script>
|
|
|
-
|
|
|
-<div class="sl-elements sl-antialiased sl-h-full sl-text-base sl-font-ui sl-text-body sl-flex sl-inset-0">
|
|
|
-
|
|
|
- @include("scribe::themes.elements.sidebar")
|
|
|
-
|
|
|
- <div class="sl-overflow-y-auto sl-flex-1 sl-w-full sl-px-16 sl-bg-canvas sl-py-16" style="max-width: 1500px;">
|
|
|
-
|
|
|
- <div class="sl-mb-10">
|
|
|
- <div class="sl-mb-4">
|
|
|
- <h1 class="sl-text-5xl sl-leading-tight sl-font-prose sl-font-semibold sl-text-heading">
|
|
|
- {!! $metadata['title'] !!}
|
|
|
- </h1>
|
|
|
- @if($metadata['postman_collection_url'])
|
|
|
- <a title="Download Postman collection" class="sl-mx-1"
|
|
|
- href="{!! $metadata['postman_collection_url'] !!}" target="_blank">
|
|
|
- <small>Postman collection →</small>
|
|
|
- </a>
|
|
|
- @endif
|
|
|
- @if($metadata['openapi_spec_url'])
|
|
|
- <a title="Download OpenAPI spec" class="sl-mx-1"
|
|
|
- href="{!! $metadata['openapi_spec_url'] !!}" target="_blank">
|
|
|
- <small>OpenAPI spec →</small>
|
|
|
- </a>
|
|
|
- @endif
|
|
|
+ addEventListener('hashchange', highlightSidebarItem);
|
|
|
+ </script>
|
|
|
+
|
|
|
+ <div class="sl-elements sl-antialiased sl-h-full sl-text-base sl-font-ui sl-text-body sl-flex sl-inset-0">
|
|
|
+
|
|
|
+ @include('scribe::themes.elements.sidebar')
|
|
|
+
|
|
|
+ <div class="sl-overflow-y-auto sl-flex-1 sl-w-full sl-px-16 sl-bg-canvas sl-py-16" style="max-width: 1500px;">
|
|
|
+
|
|
|
+ <div class="sl-mb-10">
|
|
|
+ <div class="sl-mb-4">
|
|
|
+ <h1 class="sl-text-5xl sl-leading-tight sl-font-prose sl-font-semibold sl-text-heading">
|
|
|
+ {!! $metadata['title'] !!}
|
|
|
+ </h1>
|
|
|
+ @if ($metadata['postman_collection_url'])
|
|
|
+ <a title="Download Postman collection" class="sl-mx-1" href="{!! $metadata['postman_collection_url'] !!}"
|
|
|
+ target="_blank">
|
|
|
+ <small>Postman collection →</small>
|
|
|
+ </a>
|
|
|
+ @endif
|
|
|
+ @if ($metadata['openapi_spec_url'])
|
|
|
+ <a title="Download OpenAPI spec" class="sl-mx-1" href="{!! $metadata['openapi_spec_url'] !!}" target="_blank">
|
|
|
+ <small>OpenAPI spec →</small>
|
|
|
+ </a>
|
|
|
+ @endif
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="sl-prose sl-markdown-viewer sl-my-4">
|
|
|
+ {!! $intro !!}
|
|
|
+
|
|
|
+ {!! $auth !!}
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
- <div class="sl-prose sl-markdown-viewer sl-my-4">
|
|
|
- {!! $intro !!}
|
|
|
+ @include('scribe::themes.elements.groups')
|
|
|
|
|
|
- {!! $auth !!}
|
|
|
+ <div class="sl-prose sl-markdown-viewer sl-my-5">
|
|
|
+ {!! $append !!}
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
- @include("scribe::themes.elements.groups")
|
|
|
-
|
|
|
- <div class="sl-prose sl-markdown-viewer sl-my-5">
|
|
|
- {!! $append !!}
|
|
|
- </div>
|
|
|
</div>
|
|
|
|
|
|
-</div>
|
|
|
-
|
|
|
-<template id="expand-chevron">
|
|
|
- <svg aria-hidden="true" focusable="false" data-prefix="fas"
|
|
|
- data-icon="chevron-right"
|
|
|
- class="svg-inline--fa fa-chevron-right fa-fw sl-icon sl-text-muted"
|
|
|
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
|
|
- <path fill="currentColor"
|
|
|
- d="M96 480c-8.188 0-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L242.8 256L73.38 86.63c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l192 192c12.5 12.5 12.5 32.75 0 45.25l-192 192C112.4 476.9 104.2 480 96 480z"></path>
|
|
|
- </svg>
|
|
|
-</template>
|
|
|
-
|
|
|
-<template id="expanded-chevron">
|
|
|
- <svg aria-hidden="true" focusable="false" data-prefix="fas"
|
|
|
- data-icon="chevron-down"
|
|
|
- class="svg-inline--fa fa-chevron-down fa-fw sl-icon sl-text-muted"
|
|
|
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512">
|
|
|
- <path fill="currentColor"
|
|
|
- d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"></path>
|
|
|
- </svg>
|
|
|
-</template>
|
|
|
-
|
|
|
-<template id="expand-chevron-solid">
|
|
|
- <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="caret-right"
|
|
|
- class="svg-inline--fa fa-caret-right fa-fw sl-icon" role="img" xmlns="http://www.w3.org/2000/svg"
|
|
|
- viewBox="0 0 256 512">
|
|
|
- <path fill="currentColor"
|
|
|
- d="M118.6 105.4l128 127.1C252.9 239.6 256 247.8 256 255.1s-3.125 16.38-9.375 22.63l-128 127.1c-9.156 9.156-22.91 11.9-34.88 6.943S64 396.9 64 383.1V128c0-12.94 7.781-24.62 19.75-29.58S109.5 96.23 118.6 105.4z"></path>
|
|
|
- </svg>
|
|
|
-</template>
|
|
|
-
|
|
|
-<template id="expanded-chevron-solid">
|
|
|
- <svg aria-hidden="true" focusable="false" data-prefix="fas"
|
|
|
- data-icon="caret-down"
|
|
|
- class="svg-inline--fa fa-caret-down fa-fw sl-icon" role="img"
|
|
|
- xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512">
|
|
|
- <path fill="currentColor"
|
|
|
- d="M310.6 246.6l-127.1 128C176.4 380.9 168.2 384 160 384s-16.38-3.125-22.63-9.375l-127.1-128C.2244 237.5-2.516 223.7 2.438 211.8S19.07 192 32 192h255.1c12.94 0 24.62 7.781 29.58 19.75S319.8 237.5 310.6 246.6z"></path>
|
|
|
- </svg>
|
|
|
-</template>
|
|
|
+ <template id="expand-chevron">
|
|
|
+ <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-right"
|
|
|
+ class="svg-inline--fa fa-chevron-right fa-fw sl-icon sl-text-muted" xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 320 512">
|
|
|
+ <path fill="currentColor"
|
|
|
+ d="M96 480c-8.188 0-16.38-3.125-22.62-9.375c-12.5-12.5-12.5-32.75 0-45.25L242.8 256L73.38 86.63c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0l192 192c12.5 12.5 12.5 32.75 0 45.25l-192 192C112.4 476.9 104.2 480 96 480z">
|
|
|
+ </path>
|
|
|
+ </svg>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template id="expanded-chevron">
|
|
|
+ <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="chevron-down"
|
|
|
+ class="svg-inline--fa fa-chevron-down fa-fw sl-icon sl-text-muted" xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 448 512">
|
|
|
+ <path fill="currentColor"
|
|
|
+ d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z">
|
|
|
+ </path>
|
|
|
+ </svg>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template id="expand-chevron-solid">
|
|
|
+ <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="caret-right"
|
|
|
+ class="svg-inline--fa fa-caret-right fa-fw sl-icon" role="img" xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 256 512">
|
|
|
+ <path fill="currentColor"
|
|
|
+ d="M118.6 105.4l128 127.1C252.9 239.6 256 247.8 256 255.1s-3.125 16.38-9.375 22.63l-128 127.1c-9.156 9.156-22.91 11.9-34.88 6.943S64 396.9 64 383.1V128c0-12.94 7.781-24.62 19.75-29.58S109.5 96.23 118.6 105.4z">
|
|
|
+ </path>
|
|
|
+ </svg>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template id="expanded-chevron-solid">
|
|
|
+ <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="caret-down"
|
|
|
+ class="svg-inline--fa fa-caret-down fa-fw sl-icon" role="img" xmlns="http://www.w3.org/2000/svg"
|
|
|
+ viewBox="0 0 320 512">
|
|
|
+ <path fill="currentColor"
|
|
|
+ d="M310.6 246.6l-127.1 128C176.4 380.9 168.2 384 160 384s-16.38-3.125-22.63-9.375l-127.1-128C.2244 237.5-2.516 223.7 2.438 211.8S19.07 192 32 192h255.1c12.94 0 24.62 7.781 29.58 19.75S319.8 237.5 310.6 246.6z">
|
|
|
+ </path>
|
|
|
+ </svg>
|
|
|
+ </template>
|
|
|
</body>
|
|
|
+
|
|
|
</html>
|
