diff --git a/resources/js/code.mjs b/resources/js/code.mjs index 5d4186dd0..eca941f1c 100644 --- a/resources/js/code.mjs +++ b/resources/js/code.mjs @@ -39,6 +39,7 @@ import 'codemirror/addon/scroll/scrollpastend'; // Value can be a mode string or a function that will receive the code content & return the mode string. // The function option is used in the event the exact mode could be dynamic depending on the code. const modeMap = { + bash: 'shell', css: 'css', c: 'text/x-csrc', java: 'text/x-java', @@ -88,7 +89,6 @@ const modeMap = { shell: 'shell', sh: 'shell', stext: 'text/x-stex', - bash: 'shell', toml: 'toml', ts: 'text/typescript', typescript: 'text/typescript', diff --git a/resources/js/components/code-editor.js b/resources/js/components/code-editor.js index 27ff56395..7ed5a1cbe 100644 --- a/resources/js/components/code-editor.js +++ b/resources/js/components/code-editor.js @@ -94,15 +94,13 @@ class CodeEditor { languageInputChange(language) { this.updateEditorMode(language); const inputLang = language.toLowerCase(); - let matched = false; for (const link of this.languageLinks) { const lang = link.dataset.lang.toLowerCase().trim(); - const isMatch = inputLang && lang.startsWith(inputLang); + const isMatch = inputLang === lang; link.classList.toggle('active', isMatch); - if (isMatch && !matched) { + if (isMatch) { link.scrollIntoView({block: "center", behavior: "smooth"}); - matched = true; } } } diff --git a/resources/sass/_components.scss b/resources/sass/_components.scss index 4509c2b9a..9b6d624c1 100644 --- a/resources/sass/_components.scss +++ b/resources/sass/_components.scss @@ -666,12 +666,29 @@ body.flexbox-support #entity-selector-wrap .popup-body .form-group { text-align: left; font-family: $mono; font-size: 0.7rem; + padding-right: 24px + $-m; &:hover, &.active { background-color: var(--color-primary-light); color: var(--color-primary); } } +.code-editor button.lang-option-favorite-toggle { + position: absolute; + right: 0; + width: 28px; + font-size: 1rem; + border: 0; + line-height: 1; + padding: 2px; + z-index: 2; + height: 100%; + text-align: center; + svg { + margin: 0; + } +} + .code-editor label { background-color: var(--color-primary-light); width: 100%; diff --git a/resources/views/pages/parts/code-editor.blade.php b/resources/views/pages/parts/code-editor.blade.php index 4ac688692..93c76dc22 100644 --- a/resources/views/pages/parts/code-editor.blade.php +++ b/resources/views/pages/parts/code-editor.blade.php @@ -19,41 +19,24 @@