From 75eddcf85d3b7077d745c844dd146622a5f8688a Mon Sep 17 00:00:00 2001 From: Connor Johnstone Date: Sat, 30 Aug 2025 22:45:10 -0400 Subject: [PATCH] Remove all user-facing emojis and improve modal styling MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit This commit enhances the professional appearance of the calendar application by removing all user-facing emojis while preserving debug logging functionality. Additionally, includes modal layout and styling improvements for better usability. ## Changes Made: ### Emoji Removal: - **Event creation modal tabs**: Removed emojis from all 6 tab buttons (📅 Basic Details → Basic Details, etc.) - **Modal content**: Removed emojis from alarm types, attachment types, pattern examples, and completion status - **Theme picker**: Removed emojis from all 8 theme options (🌊 Ocean → Ocean, etc.) - **Context menus**: Removed emojis from event context menu (edit/delete actions) and calendar context menu ### Modal Styling Improvements: - **Width expansion**: Increased modal max-width from 500px to 900px (80% wider) - **Enhanced padding**: Added more padding to modal header (2rem 3rem 1.5rem) and tab content areas - **Responsive design**: Improved mobile adjustments while maintaining desktop experience - **Checkbox fix**: Override width inheritance for "All Day" checkbox with auto width and inline-block display ### Form Layout Enhancement: - **Field reordering**: Moved Repeat and Reminder options above date/time pickers for better workflow - **Visual consistency**: Maintained clean, professional appearance throughout the interface The application now presents a clean, professional interface suitable for business environments while retaining full functionality. Debug logging with emojis is preserved for development purposes. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- frontend/src/components/context_menu.rs | 1 - frontend/src/components/create_event_modal.rs | 114 +++++++++--------- frontend/src/components/event_context_menu.rs | 13 +- frontend/src/components/sidebar.rs | 16 +-- frontend/styles.css | 28 +++-- 5 files changed, 88 insertions(+), 84 deletions(-) diff --git a/frontend/src/components/context_menu.rs b/frontend/src/components/context_menu.rs index 0adcadb..1fc9f8c 100644 --- a/frontend/src/components/context_menu.rs +++ b/frontend/src/components/context_menu.rs @@ -41,7 +41,6 @@ pub fn context_menu(props: &ContextMenuProps) -> Html { style={style} >
- {"🗑️"} {"Delete Calendar"}
diff --git a/frontend/src/components/create_event_modal.rs b/frontend/src/components/create_event_modal.rs index dd5655f..f6813ed 100644 --- a/frontend/src/components/create_event_modal.rs +++ b/frontend/src/components/create_event_modal.rs @@ -604,7 +604,7 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html { Callback::from(move |_| switch_to_tab.emit(ModalTab::BasicDetails)) } > - {"📅 Basic Details"} + {"Basic Details"} @@ -726,6 +726,38 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html { +
+
+ + +
+ +
+ + +
+
+
@@ -792,38 +824,6 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html { />
-
-
- - -
- -
- - -
-
- // Show weekday selection only when weekly recurrence is selected if matches!(data.recurrence, RecurrenceType::Weekly) {
@@ -1367,19 +1367,19 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html {
{"Reminder & Alarm Types"}
- {"🔔 Display Alarm"} + {"Display Alarm"}

{"Pop-up notification on your device"}

- {"📧 Email Reminder"} + {"Email Reminder"}

{"Email notification sent to your address"}

- {"🔊 Audio Alert"} + {"Audio Alert"}

{"Sound notification with custom audio"}

- {"📱 SMS/Text"} + {"SMS/Text"}

{"Text message reminder (enterprise feature)"}

@@ -1401,19 +1401,19 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html {

{"Future attachment features will include:"}

- {"📎 File Uploads:"} + {"File Uploads:"} {"Documents, images, presentations"}
- {"🔗 URL Links:"} + {"URL Links:"} {"Web resources and reference materials"}
- {"💾 Cloud Storage:"} + {"Cloud Storage:"} {"Google Drive, Dropbox, OneDrive integration"}
- {"📝 Meeting Notes:"} + {"Meeting Notes:"} {"Collaborative note-taking and agenda items"}
@@ -1424,19 +1424,19 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html {
{"Common Reminder Patterns"}
- {"📅 Meetings:"} + {"Meetings:"} {"15 minutes before (preparation time)"}
- {"✈️ Travel Events:"} + {"Travel Events:"} {"2 hours before (traffic and check-in)"}
- {"🎂 Personal Events:"} + {"Personal Events:"} {"1 day before (preparation and gifts)"}
- {"📋 Deadlines:"} + {"Deadlines:"} {"1 week before (completion buffer)"}
@@ -1467,32 +1467,32 @@ pub fn create_event_modal(props: &CreateEventModalProps) -> Html {
-
{"🎉 Modal Complete!"}
+
{"Modal Complete!"}

{"You've reached the final tab of the comprehensive event creation interface. This modal now provides access to all major VEvent properties following RFC 5545 standards."}

- {"✅ Basic Details"} + {"Basic Details"} {"Title, calendar, dates, location, basic recurrence"}
- {"✅ Advanced"} + {"Advanced"} {"Status, priority, classification, advanced options"}
- {"✅ People"} + {"People"} {"Organizer, attendees, invitation management"}
- {"✅ Categories"} + {"Categories"} {"Event tagging and organizational features"}
- {"✅ Location"} + {"Location"} {"Physical and virtual location management"}
- {"✅ Reminders"} + {"Reminders"} {"Alarm configuration and future attachments"}
diff --git a/frontend/src/components/event_context_menu.rs b/frontend/src/components/event_context_menu.rs index a9f6bbc..ccb5ac4 100644 --- a/frontend/src/components/event_context_menu.rs +++ b/frontend/src/components/event_context_menu.rs @@ -63,7 +63,6 @@ pub fn event_context_menu(props: &EventContextMenuProps) -> Html { style={style} >
- {"✏️"} {"Edit Event"}
{ @@ -71,24 +70,20 @@ pub fn event_context_menu(props: &EventContextMenuProps) -> Html { html! { <>
- {"🗑️"} - {"Delete This Event"} + {"Delete This Event"}
- {"🗑️"} - {"Delete Following Events"} + {"Delete Following Events"}
- {"🗑️"} - {"Delete Entire Series"} + {"Delete Entire Series"}
} } else { html! {
- {"🗑️"} - {"Delete Event"} + {"Delete Event"}
} } diff --git a/frontend/src/components/sidebar.rs b/frontend/src/components/sidebar.rs index c8fafb3..fc67e96 100644 --- a/frontend/src/components/sidebar.rs +++ b/frontend/src/components/sidebar.rs @@ -177,14 +177,14 @@ pub fn sidebar(props: &SidebarProps) -> Html {
diff --git a/frontend/styles.css b/frontend/styles.css index 50f0d58..8b818e3 100644 --- a/frontend/styles.css +++ b/frontend/styles.css @@ -1042,9 +1042,9 @@ body { background: white; border-radius: 12px; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); - max-width: 500px; - width: 90%; - max-height: 80vh; + max-width: 900px; + width: 95%; + max-height: 85vh; overflow-y: auto; position: relative; animation: modalAppear 0.2s ease-out; @@ -1065,7 +1065,7 @@ body { display: flex; align-items: center; justify-content: space-between; - padding: 1.5rem 2rem 1rem; + padding: 2rem 3rem 1.5rem; border-bottom: 1px solid #e9ecef; } @@ -1100,7 +1100,7 @@ body { } .modal-body { - padding: 1.5rem 2rem 2rem; + padding: 0.25rem 1.0rem 0rem; } .event-detail { @@ -1260,7 +1260,7 @@ body { } .modal-header, .modal-body { - padding: 1rem 1.5rem; + padding: 1.5rem 2rem; } .event-detail { @@ -1662,7 +1662,8 @@ body { /* Event Creation Modal Styles */ .create-event-modal { - max-width: 600px; + min-width: 750px; + max-width: 900px; width: 95%; } @@ -1700,6 +1701,14 @@ body { box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1); } +/* Checkbox specific styling override */ +.create-event-modal input[type="checkbox"] { + width: auto; + display: inline-block; + margin-right: 0.5rem; + vertical-align: middle; +} + .create-event-modal .form-row { display: grid; grid-template-columns: 1fr 1fr; @@ -1947,7 +1956,7 @@ body { min-height: 300px; max-height: 50vh; overflow-y: auto; - padding-right: 0.5rem; + padding: 1rem 2rem 2rem 2rem; } .tab-panel { @@ -1983,6 +1992,7 @@ body { .tab-content { min-height: 250px; max-height: 45vh; + padding: 1rem 1.5rem 1.5rem 1.5rem; } } @@ -3316,4 +3326,4 @@ body { [data-theme="mint"] .app-sidebar { background: var(--sidebar-bg); -} \ No newline at end of file +}