Hook up small-icon mode for Sunbird's customizable toolbars

bug 257456, p=sipaq, r=mvl
This commit is contained in:
mvl%exedo.nl 2004-08-31 13:02:27 +00:00
parent 2f6b6efc04
commit 8c04dd59b1
2 changed files with 344 additions and 10 deletions

View File

@ -58,16 +58,6 @@
max-height: 33px;
}
/*--------------------------------------------------------------------
* Primary toolbar buttons
*-------------------------------------------------------------------*/
.toolbarbutton-1 {
-moz-box-orient: vertical;
min-width: 0px;
list-style-image: url("chrome://calendar/skin/toolbar-large.png");
}
/*--------------------------------------------------------------------
* Icons-only and text-only mode
*-------------------------------------------------------------------*/
@ -86,6 +76,26 @@ toolbar[mode="text"] .toolbarbutton-text {
margin: 3px 5px !important;
}
/*--------------------------------------------------------------------
* Primary toolbar buttons
*-------------------------------------------------------------------*/
.toolbarbutton-1 {
-moz-box-orient: vertical;
min-width: 0px;
list-style-image: url("chrome://calendar/skin/toolbar-large.png");
}
/*--------------------------------------------------------------------
* Primary toolbar buttons - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] .toolbarbutton-1 {
-moz-box-orient: vertical;
min-width: 0px;
list-style-image: url("chrome://calendar/skin/toolbar-small.png");
}
/*--------------------------------------------------------------------
* new event button
*-------------------------------------------------------------------*/
@ -104,6 +114,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-new-event-button:hover:active {
}
/*--------------------------------------------------------------------
* new event button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-new-event-button {
-moz-image-region: rect(0px 16px 16px 0px);
}
toolbar[iconsize="small"] #calendar-new-event-button[disabled="true"],
toolbar[iconsize="small"] #calendar-new-event-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-new-event-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 16px 48px 0px);
}
toolbar[iconsize="small"] #calendar-new-event-button:hover {
-moz-image-region: rect(16px 16px 32px 0px);
}
toolbar[iconsize="small"] #calendar-new-event-button:hover:active {
}
/*--------------------------------------------------------------------
* edit event button
*-------------------------------------------------------------------*/
@ -122,6 +150,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-edit-event-button:hover:active {
}
/*--------------------------------------------------------------------
* edit event button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-edit-event-button {
-moz-image-region: rect(0px 32px 16px 16px);
}
toolbar[iconsize="small"] #calendar-edit-event-button[disabled="true"],
toolbar[iconsize="small"] #calendar-edit-event-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-edit-event-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 32px 48px 16px);
}
toolbar[iconsize="small"] #calendar-edit-event-button:hover {
-moz-image-region: rect(16px 32px 32px 16px);
}
toolbar[iconsize="small"] #calendar-edit-event-button:hover:active {
}
/*--------------------------------------------------------------------
* delete event button
*-------------------------------------------------------------------*/
@ -140,6 +186,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-delete-event-button:hover:active {
}
/*--------------------------------------------------------------------
* delete event button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-delete-event-button {
-moz-image-region: rect(0px 48px 16px 32px);
}
toolbar[iconsize="small"] #calendar-delete-event-button[disabled="true"],
toolbar[iconsize="small"] #calendar-delete-event-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-delete-event-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 48px 48px 32px);
}
toolbar[iconsize="small"] #calendar-delete-event-button:hover {
-moz-image-region: rect(16px 48px 32px 32px);
}
toolbar[iconsize="small"] #calendar-delete-event-button:hover:active {
}
/*--------------------------------------------------------------------
* Go To Today button
*-------------------------------------------------------------------*/
@ -158,6 +222,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-go-to-today-button:hover:active {
}
/*--------------------------------------------------------------------
* Go To Today button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-go-to-today-button {
-moz-image-region: rect(0px 272px 16px 256px);
}
toolbar[iconsize="small"] #calendar-go-to-today-button[disabled="true"],
toolbar[iconsize="small"] #calendar-go-to-today-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-go-to-today-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 272px 48px 256px);
}
toolbar[iconsize="small"] #calendar-go-to-today-button:hover {
-moz-image-region: rect(16px 272px 32px 256px);
}
toolbar[iconsize="small"] #calendar-go-to-today-button:hover:active {
}
/*--------------------------------------------------------------------
* Choose date button
*-------------------------------------------------------------------*/
@ -176,6 +258,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-choose-date-button:hover:active {
}
/*--------------------------------------------------------------------
* Choose date button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-choose-date-button {
-moz-image-region: rect(0px 288px 16px 272px);
}
toolbar[iconsize="small"] #calendar-choose-date-button[disabled="true"],
toolbar[iconsize="small"] #calendar-choose-date-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-choose-date-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 288px 48px 272px);
}
toolbar[iconsize="small"] #calendar-choose-date-button:hover {
-moz-image-region: rect(16px 288px 32px 272px);
}
toolbar[iconsize="small"] #calendar-choose-date-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to multiweek view button
*-------------------------------------------------------------------*/
@ -193,6 +293,23 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-multiweek-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to multiweek view button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-multiweek-view-button {
-moz-image-region: rect(0px 96px 16px 80px);
}
toolbar[iconsize="small"] #calendar-multiweek-view-button[disabled="true"],
toolbar[iconsize="small"] #calendar-multiweek-view-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-multiweek-view-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 96px 48px 80px);
}
toolbar[iconsize="small"] #calendar-multiweek-view-button:hover {
-moz-image-region: rect(16px 96px 32px 80px);
}
toolbar[iconsize="small"] #calendar-multiweek-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to month view button
*-------------------------------------------------------------------*/
@ -211,6 +328,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-month-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to month view button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-month-view-button {
-moz-image-region: rect(0px 112px 16px 96px);
}
toolbar[iconsize="small"] #calendar-month-view-button[disabled="true"],
toolbar[iconsize="small"] #calendar-month-view-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-month-view-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 112px 48px 96px);
}
toolbar[iconsize="small"] #calendar-month-view-button:hover {
-moz-image-region: rect(16px 112px 32px 96px);
}
toolbar[iconsize="small"] #calendar-month-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to week view button
*-------------------------------------------------------------------*/
@ -229,6 +364,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-week-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to week view button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-week-view-button {
-moz-image-region: rect(0px 80px 16px 64px);
}
toolbar[iconsize="small"] #calendar-week-view-button[disabled="true"],
toolbar[iconsize="small"] #calendar-week-view-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-week-view-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 80px 48px 64px);
}
toolbar[iconsize="small"] #calendar-week-view-button:hover {
-moz-image-region: rect(16px 80px 32px 64px);
}
toolbar[iconsize="small"] #calendar-week-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to day view button
*-------------------------------------------------------------------*/
@ -247,6 +400,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-day-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Change to day view button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-day-view-button {
-moz-image-region: rect(0px 64px 16px 48px);
}
toolbar[iconsize="small"] #calendar-day-view-button[disabled="true"],
toolbar[iconsize="small"] #calendar-day-view-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-day-view-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 64px 48px 48px);
}
toolbar[iconsize="small"] #calendar-day-view-button:hover {
-moz-image-region: rect(16px 64px 32px 48px);
}
toolbar[iconsize="small"] #calendar-day-view-button:hover:active {
}
/*--------------------------------------------------------------------
* Cut button
*-------------------------------------------------------------------*/
@ -265,6 +436,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-cut-button:hover:active {
}
/*--------------------------------------------------------------------
* Cut button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-cut-button {
-moz-image-region: rect(0px 128px 16px 112px);
}
toolbar[iconsize="small"] #calendar-cut-button[disabled="true"],
toolbar[iconsize="small"] #calendar-cut-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-cut-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 128px 48px 112px);
}
toolbar[iconsize="small"] #calendar-cut-button:hover {
-moz-image-region: rect(16px 128px 32px 112px);
}
toolbar[iconsize="small"] #calendar-cut-button:hover:active {
}
/*--------------------------------------------------------------------
* Copy button
*-------------------------------------------------------------------*/
@ -283,6 +472,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-copy-button:hover:active {
}
/*--------------------------------------------------------------------
* Copy button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-copy-button {
-moz-image-region: rect(0px 144px 16px 128px);
}
toolbar[iconsize="small"] #calendar-copy-button[disabled="true"],
toolbar[iconsize="small"] #calendar-copy-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-copy-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 144px 48px 128px);
}
toolbar[iconsize="small"] #calendar-copy-button:hover {
-moz-image-region: rect(16px 144px 32px 128px);
}
toolbar[iconsize="small"] #calendar-copy-button:hover:active {
}
/*--------------------------------------------------------------------
* Paste button
*-------------------------------------------------------------------*/
@ -301,6 +508,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-paste-button:hover:active {
}
/*--------------------------------------------------------------------
* Paste button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-paste-button {
-moz-image-region: rect(0px 160px 16px 144px);
}
toolbar[iconsize="small"] #calendar-paste-button[disabled="true"],
toolbar[iconsize="small"] #calendar-paste-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-paste-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 160px 48px 144px);
}
toolbar[iconsize="small"] #calendar-paste-button:hover {
-moz-image-region: rect(16px 160px 32px 144px);
}
toolbar[iconsize="small"] #calendar-paste-button:hover:active {
}
/*--------------------------------------------------------------------
* Import button
*-------------------------------------------------------------------*/
@ -319,6 +544,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-import-button:hover:active {
}
/*--------------------------------------------------------------------
* Import button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-import-button {
-moz-image-region: rect(0px 176px 16px 160px);
}
toolbar[iconsize="small"] #calendar-import-button[disabled="true"],
toolbar[iconsize="small"] #calendar-import-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-import-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 176px 48px 160px);
}
toolbar[iconsize="small"] #calendar-import-button:hover {
-moz-image-region: rect(16px 176px 32px 160px);
}
toolbar[iconsize="small"] #calendar-import-button:hover:active {
}
/*--------------------------------------------------------------------
* Export button
*-------------------------------------------------------------------*/
@ -337,6 +580,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-export-button:hover:active {
}
/*--------------------------------------------------------------------
* Export button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-export-button {
-moz-image-region: rect(0px 192px 16px 176px);
}
toolbar[iconsize="small"] #calendar-export-button[disabled="true"],
toolbar[iconsize="small"] #calendar-export-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-export-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 192px 48px 176px);
}
toolbar[iconsize="small"] #calendar-export-button:hover {
-moz-image-region: rect(16px 192px 32px 176px);
}
toolbar[iconsize="small"] #calendar-export-button:hover:active {
}
/*--------------------------------------------------------------------
* Subscribe button
*-------------------------------------------------------------------*/
@ -355,6 +616,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-subscribe-button:hover:active {
}
/*--------------------------------------------------------------------
* Subscribe button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-subscribe-button {
-moz-image-region: rect(0px 208px 16px 192px);
}
toolbar[iconsize="small"] #calendar-subscribe-button[disabled="true"],
toolbar[iconsize="small"] #calendar-subscribe-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-subscribe-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 208px 48px 192px);
}
toolbar[iconsize="small"] #calendar-subscribe-button:hover {
-moz-image-region: rect(16px 208px 32px 192px);
}
toolbar[iconsize="small"] #calendar-subscribe-button:hover:active {
}
/*--------------------------------------------------------------------
* Publish button
*-------------------------------------------------------------------*/
@ -373,6 +652,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-publish-button:hover:active {
}
/*--------------------------------------------------------------------
* Publish button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-publish-button {
-moz-image-region: rect(0px 224px 16px 208px);
}
toolbar[iconsize="small"] #calendar-publish-button[disabled="true"],
toolbar[iconsize="small"] #calendar-publish-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-publish-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 224px 48px 208px);
}
toolbar[iconsize="small"] #calendar-publish-button:hover {
-moz-image-region: rect(16px 224px 32px 208px);
}
toolbar[iconsize="small"] #calendar-publish-button:hover:active {
}
/*--------------------------------------------------------------------
* Print button
*-------------------------------------------------------------------*/
@ -391,6 +688,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-print-button:hover:active {
}
/*--------------------------------------------------------------------
* Print button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-print-button {
-moz-image-region: rect(0px 240px 16px 224px);
}
toolbar[iconsize="small"] #calendar-print-button[disabled="true"],
toolbar[iconsize="small"] #calendar-print-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-print-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 240px 48px 224px);
}
toolbar[iconsize="small"] #calendar-print-button:hover {
-moz-image-region: rect(16px 240px 32px 224px);
}
toolbar[iconsize="small"] #calendar-print-button:hover:active {
}
/*--------------------------------------------------------------------
* New Task button
*-------------------------------------------------------------------*/
@ -409,6 +724,24 @@ toolbar[mode="text"] .toolbarbutton-text {
#calendar-new-task-button:hover:active {
}
/*--------------------------------------------------------------------
* New Task button - small
*-------------------------------------------------------------------*/
toolbar[iconsize="small"] #calendar-new-task-button {
-moz-image-region: rect(0px 256px 16px 240px);
}
toolbar[iconsize="small"] #calendar-new-task-button[disabled="true"],
toolbar[iconsize="small"] #calendar-new-task-button[disabled="true"]:hover,
toolbar[iconsize="small"] #calendar-new-task-button[disabled="true"]:hover:active {
-moz-image-region: rect(32px 256px 48px 240px);
}
toolbar[iconsize="small"] #calendar-new-task-button:hover {
-moz-image-region: rect(16px 256px 32px 240px);
}
toolbar[iconsize="small"] #calendar-new-task-button:hover:active {
}
/*--------------------------------------------------------------------
* Throbber button
*-------------------------------------------------------------------*/

View File

@ -1,6 +1,7 @@
calendar.jar:
skin/classic/calendar/calendar.css
skin/classic/calendar/toolbar-large.png
skin/classic/calendar/toolbar-small.png
skin/classic/calendar/pageupdown.png
skin/classic/calendar/prevnextarrow.png
skin/classic/calendar/pref/Options.png (pref/Options.png)