Refactor Styles into separate CSS

.gitignore

@@ -6,11 +6,8 @@ yarn-debug.log*
 yarn-error.log*
 
 # Webpack
-dist
-
 # Babel
 lib
-dist
 
 # Runtime data
 pids

README.md

@@ -1,3 +1,14 @@
 # meeting-pane
 
 Bring together schedule, people, materials, discussion around a meeting. 
+
+## Genertive AI usage
+The SolidOS team is using GitHub Copilot integrated in Visual Studio Code. 
+We have added comments in the code to make it explicit which parts are 100% written by AI.
+Example: 
+* Some code was generated by the GPT-5.3-Codex model in GitHub Copilot based on the following prompt:
+* I have these classes meetingToolIcon, meetingToolIcon-visible, meetingToolIconAddButton, meetingToolIcon-disabled, meetingToolIcon-yellow.  I want to toggle the visibility of the icons by adding or removing the class meetingToolIcon-visible.  Write a function that takes a boolean showIcons and toggles the class on all the icons in iconArray accordingly. 
+* the icons are way too big and they are lined up vertically
+instead of horizontally. Can you fix that? 
+* also icon sizing - the icons should be about an inch big 
+

declarations.d.ts

@@ -1,4 +1,17 @@
 declare module '*.ttl' {
   const content: string;
   export default content;
-}
+}
+
+export interface PaneDefinition {
+  icon: string
+  name: string
+  audience: unknown[]
+  label: (subject: unknown, context: unknown) => string | null
+  render: (subject: unknown, context: { dom: Document }) => HTMLElement
+  mintClass?: unknown
+  mintNew?: (context: unknown, options: unknown) => Promise<unknown>
+}
+
+declare const meetingPane: PaneDefinition
+export default meetingPane