Update UI padding and text in donation panel and header components

Author: robertpiosik

packages/ui/src/components/editor/panel/Donations/Donations.tsx

@@ -156,7 +156,7 @@ export const Donations: React.FC<DonationsProps> = (props) => {
               }
             >
               Hi there! Your donation supports my mission to make AI coding a
-              mindful practice, with highly capable tooling freely accessible to
+              mindful practice, with highly capable tooling freely available to
               everyone. Thank you.
             </Fieldset>
           </div>

packages/ui/src/components/editor/panel/Page/Page.module.scss

@@ -10,7 +10,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  margin: 5px 12px 6px 12px;
+  margin: 6px 12px;
   position: relative;
   height: 20px;
 

packages/ui/src/components/editor/panel/PromptField/PromptField.tsx

@@ -10,7 +10,7 @@ import { use_drag_drop } from './hooks/use-drag-drop'
 import { use_keyboard_shortcuts } from './hooks/use-keyboard-shortcuts'
 import { use_edit_format_compacting } from './hooks/use-edit-format-compacting'
 import { DropdownMenu } from '../../common/DropdownMenu'
-import { use_is_narrow_viewport, use_is_mac } from '@shared/hooks'
+import { use_is_mac } from '@shared/hooks'
 import {
   get_caret_position_from_div,
   set_caret_position_for_div
@@ -64,7 +64,6 @@ export const PromptField: React.FC<PromptFieldProps> = (props) => {
   const [is_focused, set_is_focused] = useState(false)
   const [hovered_edit_format, set_hovered_edit_format] =
     useState<EditFormat | null>(null)
-  const is_narrow_viewport = use_is_narrow_viewport(330)
   const { is_alt_pressed, handle_container_key_down } = use_keyboard_shortcuts({
     show_edit_format_selector: props.show_edit_format_selector,
     on_edit_format_change: props.on_edit_format_change,

packages/vscode/src/views/panel/frontend/Home/Home.module.scss

@@ -4,7 +4,7 @@
   justify-content: space-between;
   gap: 4px;
   width: 100%;
-  padding: 3px 12px 4px 12px;
+  padding: 4px 12px;
 
   &__left {
     display: flex;

packages/vscode/src/views/panel/frontend/Main/MainView/components/Header/Header.module.scss

@@ -2,7 +2,7 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
-  padding: 3px 12px 4px 12px;
+  padding: 4px 12px;
   gap: 14px;
 
   &__left {