close brackets for embedded CSS

Hunter
Saturday, July 12th, 2025 at 3:41 PM


index.html+4-2


sw.js+3-2
index.html
 10  		import {EditorView, keymap, placeholder} from "https://esm.sh/@codemirror/view@6"
 11  		import {EditorState} from "https://esm.sh/@codemirror/state@6"
 12  		import {defaultKeymap, indentWithTab, undo, redo, undoDepth, redoDepth, history, historyKeymap} from "https://esm.sh/@codemirror/commands@6"
 13 +		import {closeBrackets, closeBracketsKeymap} from "https://esm.sh/@codemirror/autocomplete@6"
 14  		import {html} from "https://esm.sh/@codemirror/lang-html@6"
 15  		import {githubDark} from "https://esm.sh/@fsegurai/codemirror-theme-github-dark"
 16  		import {indentUnit} from "https://esm.sh/@codemirror/language@6"
 17  		
    -		window.CodeMirror = {EditorView, EditorState, keymap, defaultKeymap, indentWithTab, html, githubDark, indentUnit, placeholder, undo, redo, undoDepth, redoDepth, history, historyKeymap};
 18 +		window.CodeMirror = {EditorView, EditorState, keymap, defaultKeymap, indentWithTab, html, githubDark, indentUnit, placeholder, undo, redo, undoDepth, redoDepth, history, historyKeymap, closeBrackets, closeBracketsKeymap};
 19  	</script>
 20  	<style>
 21  		:root {

250  				return;
251  			}
252  
    -			const {EditorView, EditorState, keymap, defaultKeymap, indentWithTab, html, githubDark, indentUnit, placeholder, undo, redo, undoDepth, redoDepth, history, historyKeymap} = window.CodeMirror;
253 +			const {EditorView, EditorState, keymap, defaultKeymap, indentWithTab, html, githubDark, indentUnit, placeholder, undo, redo, undoDepth, redoDepth, history, historyKeymap, closeBrackets, closeBracketsKeymap} = window.CodeMirror;
254  			
255  			// Load saved content
256  			const savedContent = loadFromStorage();

261  					doc: savedContent,
262  					extensions: [
263  						history(),
264 +						closeBrackets(),
265  						keymap.of([
266  							{key: "Mod-z", run: undo},
267  							{key: "Mod-y", run: redo},
sw.js
   -const CACHE_NAME = 'web-workshop-v6';
 1 +const CACHE_NAME = 'web-workshop-v7';
 2  const urlsToCache = [
 3    '/web_workshop/',
 4    '/web_workshop/index.html',

 9    'https://esm.sh/@codemirror/commands@6',
10    'https://esm.sh/@codemirror/lang-html@6',
11    'https://esm.sh/@fsegurai/codemirror-theme-github-dark',
   -  'https://esm.sh/@codemirror/language@6'
12 +  'https://esm.sh/@codemirror/language@6',
13 +  'https://esm.sh/@codemirror/autocomplete@6'
14  ];
15  
16  // Function to discover and cache all files in directories