-
-
Notifications
You must be signed in to change notification settings - Fork 193
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Rebased with master Add new configuration file * Add function for formatting settings inside configuration page. Temporarily deleted settings for ramping up the new configuration page. * Clean a little bit introduction file * Introduction - Redacted basic introduction - Included gif for online tool usage. * Separated sections * Recommendation system draft - Create section where we explain each recommendation (to be redacted) - Add icons for each recommendation - Implement tooltip for when users hover the symbol * Move function to top and update fantomas version in configuration.fsx to beta * Update not recommended color to orange * Add G-Research logos * Reworded some redactions Changed <br> to two trailing spaces * Recommendation explanations * Custom tooltips when you hover on recommendation icons. * Cleanup * Better gif quality * Icons and other stylings - Resized recommendation system icons - Changed code generation to not use variables - Redaction tweaks * Deleted letters from SVG * Code result stylings * Inline icon to header * New gif * Tweaks from last feedback - Deleted repeated G-Research icon - Changed output background stylings - Deleted 'default_config' keyword - Temporal lorep ipsum that later will explain sections * Onload event for listeners * Custom Web Components - Imported Lit dependency for web components - Created 4 web componentes for each recommendation system - Changed hardcoded icons to custom web components - Changed icons stylings for allowing different stylings depending on icon location * Deleted unused class and comment * Minor visual tweaks and haunted implementation for web components. * Add settings list Temporary lorem ipsum for each setting description Temporary code generation * Tweak stylings, minor refactors, rewords - Add eval flag for readme file - Refactor code for better readability - Deleted unnecesary sass vars - Reworded settings redactions - Resize SVG icon * SVG change size for icon recommendations * Configurations with descriptions and code snippets! * Fix fsharp_space_before_parameter not rendering the right example. * Changed icons margin to inline stylings Co-authored-by: alanlomeli <[email protected]>
- Loading branch information
1 parent
bc406e2
commit b586014
Showing
10 changed files
with
817 additions
and
1,044 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,5 +1,5 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <html lang="en" data-root="{{root}}"> | ||
|
|
||
| <head> | ||
| <meta charset="utf-8"> | ||
|
|
@@ -23,7 +23,6 @@ | |
|
|
||
| <body> | ||
| <main id="main-container"> | ||
|
|
||
| <div id="sidebar-wrapper" class="bg-primary h-100 fs-5 collapse show"> | ||
| <div id="sidebar-header" class="d-flex justify-content-end mt-1"> | ||
| <button class="btn d-md-none" data-bs-toggle="collapse" data-bs-target="#sidebar-wrapper" data-bs-parent="#main-container" aria-controls="sidebar-wrapper" aria-expanded="false" aria-label="Toggle navigation"> | ||
|
|
@@ -84,9 +83,11 @@ | |
| </div> | ||
| <div id="push"></div> | ||
| </div> | ||
|
|
||
| </main> | ||
| <script type="text/javascript"> | ||
| window.addEventListener('load', (event) => { | ||
| const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]') | ||
| const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl)) | ||
| addEventListener('hide.bs.collapse', (e) => { | ||
| if (e.target && e.target.id === 'sidebar-wrapper') { | ||
| document.getElementById('main-container').classList.add('toggled'); | ||
|
|
@@ -103,6 +104,7 @@ | |
| document.getElementById(e.target.id+'-wrapper').classList.add('menu-open'); | ||
| } | ||
| }) | ||
| }); | ||
| </script> | ||
| <!-- BEGIN SEARCH BOX: this adds support for the search box --> | ||
| <link rel="stylesheet" | ||
|
|
@@ -114,6 +116,7 @@ | |
| <script type="text/javascript" src="{{root}}content/fsdocs-search.js"></script> | ||
| <!-- END SEARCH BOX: this adds support for the search box --> | ||
| <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script> | ||
| <script type="module" src="{{root}}content/fantomas-setting-icon.js"></script> | ||
| <script type="module"> | ||
| import mermaid from "https://cdn.skypack.dev/mermaid"; | ||
| mermaid.initialize({ | ||
|
|
@@ -125,5 +128,4 @@ | |
| }); | ||
| </script> | ||
| </body> | ||
|
|
||
| </html> | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| import { html } from 'https://cdn.skypack.dev/lit'; | ||
| import { component } from 'https://cdn.skypack.dev/haunted'; | ||
|
|
||
|
|
||
| function FantomasSettingIcon({ tooltip, type }) { | ||
| let settingType | ||
| switch (type) { | ||
| case 'green': | ||
| settingType = {icon: "bi-check-circle-fill", color: "green-recommendation", tooltip: tooltip?tooltip:"This setting is good to use"} | ||
| break; | ||
| case 'orange': | ||
| settingType = {icon:"bi-exclamation-circle-fill", color:"orange-recommendation", tooltip: tooltip?tooltip:"This setting is not recommended"} | ||
| break; | ||
| case 'red': | ||
| settingType = {icon: "bi-x-circle-fill", color:"red-recommendation", tooltip: tooltip?tooltip:"You shouldn't use this setting"} | ||
| break; | ||
| } | ||
| return html`<i class="bi ${settingType.icon} ${settingType.color} me-2" | ||
| data-bs-toggle="tooltip" data-bs-custom-class="${type}-tooltip" data-bs-title="${settingType.tooltip}"></i>`; | ||
| } | ||
|
|
||
| function FantomasSettingIconGResearch({ tooltip }) { | ||
| const root = document.documentElement.dataset.root | ||
| const safeTooltip = | ||
| tooltip ? tooltip : "If you use one of these you should use all G-Research settings for consistency reasons"; | ||
|
|
||
| return html`<img class="gresearch-recommendation me-2" data-bs-toggle="tooltip" data-bs-custom-class="gresearch-tooltip" | ||
| data-bs-title="${safeTooltip}" data-bs-custom-class="gresearch-tooltip" src="${root}/images/gresearch.svg" alt="G-Research logo"/>`; | ||
| } | ||
|
|
||
| customElements.define('fantomas-setting-icon', component(FantomasSettingIcon, { useShadowDOM: false, | ||
| observedAttributes: [ 'tooltip','type'] })); | ||
|
|
||
| customElements.define('fantomas-setting-icon-gresearch', component(FantomasSettingIconGResearch, { useShadowDOM: false, | ||
| observedAttributes: [ 'tooltip'] })); |
Oops, something went wrong.