52
edits
Calendar:Event in a Tab: Difference between revisions
→Design: Add mockup M
(→Design: Add links to date and time widgets) |
(→Design: Add mockup M) |
||
| Line 152: | Line 152: | ||
Note: The basic layout of K or L could also be used with fixed-height individually scrollable boxes for Reminders, Attachments, etc. (i.e. instead of having the expand/collapse triangles and letting the page become scrollable). (The disadvantage would be that there would not be a way to see all items at once when they become too many to fit in their box.) | Note: The basic layout of K or L could also be used with fixed-height individually scrollable boxes for Reminders, Attachments, etc. (i.e. instead of having the expand/collapse triangles and letting the page become scrollable). (The disadvantage would be that there would not be a way to see all items at once when they become too many to fit in their box.) | ||
=== Mockup M === | |||
<gallery> | |||
File:Event-in-tab-mockup-m.svg|Mockup M | |||
</gallery> | |||
* Based on mockup J. | |||
* Shows new [https://docs.google.com/presentation/d/1TqvyE31vfNZ3KTlw1N2Ga8vy3I1WMVefMJEnkAlg9iA/edit#slide=id.p Mozilla date/time picker] (which may or may not be available yet at time of implementation). | |||
* Categories, Attendees, and Attachments are more consistent with the appearance of mail tags in TB (and in the TB Conversations add-on where they have the "x" to make them easy to delete). | |||
* The width of the Category "tags" ("boxes" or "bubbles") is proportional to the length of the category name, producing a "tag cloud" style alignment that minimizes the use of space. For Attendees and Attachments, their width is adjusted so that they align in vertical columns making for easier reading (especially when there are more of them and since they are not also distinguished by color the way Categories are). | |||
* Clicking on "Add Category" will reveal a popup that is basically the same as the current one, a list of categories with checkboxes and a text field to enter new categories. | |||
* The color of the calendar is shown in a way that is more consistent with the look of categories. | |||
* When present, an event's URL property is added as "Event Link". (It is called "Related Link" in the current Lightning.) | |||
* "Show Time as Busy" is a checkbox rather than a drop down menu. | |||
* Scrolling in a tab: Categories, Reminders, Attachments, Attendees, and Description can take up as much vertical space as necessary to show all their items. In most cases, where there are only a small number of items, there will be enough room on the page to show them all without any scrolling. In less common cases where there are many items, the content of the tab will become taller than the viewport and the whole tab will become scrollable. This approach allows viewing all of the items at once when there are many of them. (This is instead of having smaller boxes around each of these elements that are independently scrollable, which does not allow you to see all of them at once when there are many of them.) (This "whole tab scrolling" approach is how it works in Google Calendar.) | |||
* The window dialog is included in the mockup. | |||
* There is no status bar for the window. | |||
* In the window, categories are added to the tabbed box for more consistent viewing of multiple items. | |||
* Scrolling in a window: when the contents of the tabbed box (Categories, Reminders, Attachments, Attendees, and Description) becomes too big to fit vertically, the tabbed box becomes scrollable. | |||
=== Design Links === | === Design Links === | ||