* Created different sizes of toolbar buttons.

* Made the toolbar auto-resize based on browser window size.

NEWS

@@ -1,3 +1,7 @@
+1.3.24: May 12, 2008
+ * Created different sizes of toolbar buttons.
+ * Made the toolbar auto-resize based on browser window size.
+
 1.3.23: May 9, 2008
  * Fixed tools/release.sh to include an empty session directory in the
    produced tarball. Without a session directory, installing and running 

static/css/product.css

@@ -1,55 +1,61 @@
 #new_note_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/new_note_button.png);
+  background-image: url(/static/images/toolbar/new_note_button.png);
 }
 
 #link_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/link_button.png);
+  background-image: url(/static/images/toolbar/link_button.png);
 }
 
 #attach_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/attach_button.png);
+  background-image: url(/static/images/toolbar/attach_button.png);
 }
 
 #bold_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bold_button.png);
+  background-image: url(/static/images/toolbar/bold_button.png);
 }
 
 #italic_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/italic_button.png);
+  background-image: url(/static/images/toolbar/italic_button.png);
 }
 
 #underline_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/underline_button.png);
+  background-image: url(/static/images/toolbar/underline_button.png);
 }
 
 #title_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/title_button.png);
+  background-image: url(/static/images/toolbar/title_button.png);
 }
 
 #bullet_list_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bullet_list_button.png);
+  background-image: url(/static/images/toolbar/bullet_list_button.png);
 }
 
 #numbered_list_button_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/numbered_list_button.png);
+  background-image: url(/static/images/toolbar/numbered_list_button.png);
+}
+
+#note_icon_preload {
+  height: 0;
+  overflow: hidden;
+  background-image: url(/static/images/note_icon.png);
 }
 
 .hook_area {

static/css/style.css

@@ -53,181 +53,181 @@ img {
 }
 
 #toolbar div {
-  margin-bottom: 0.25em;
+  margin-bottom: 0.1em;
 }
 
 #new_note_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/new_note_button_hover.png);
+  background-image: url(/static/images/toolbar/new_note_button_hover.png);
 }
 
 #link_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/link_button_hover.png);
+  background-image: url(/static/images/toolbar/link_button_hover.png);
 }
 
 #attach_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/attach_button_hover.png);
+  background-image: url(/static/images/toolbar/attach_button_hover.png);
 }
 
 #bold_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bold_button_hover.png);
+  background-image: url(/static/images/toolbar/bold_button_hover.png);
 }
 
 #italic_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/italic_button_hover.png);
+  background-image: url(/static/images/toolbar/italic_button_hover.png);
 }
 
 #underline_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/underline_button_hover.png);
+  background-image: url(/static/images/toolbar/underline_button_hover.png);
 }
 
 #title_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/title_button_hover.png);
+  background-image: url(/static/images/toolbar/title_button_hover.png);
 }
 
 #bullet_list_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bullet_list_button_hover.png);
+  background-image: url(/static/images/toolbar/bullet_list_button_hover.png);
 }
 
 #numbered_list_button_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/numbered_list_button_hover.png);
+  background-image: url(/static/images/toolbar/numbered_list_button_hover.png);
 }
 
 #new_note_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/new_note_button_down_hover.png);
+  background-image: url(/static/images/toolbar/new_note_button_down_hover.png);
 }
 
 #link_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/link_button_down_hover.png);
+  background-image: url(/static/images/toolbar/link_button_down_hover.png);
 }
 
 #attach_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/attach_button_down_hover.png);
+  background-image: url(/static/images/toolbar/attach_button_down_hover.png);
 }
 
 #bold_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bold_button_down_hover.png);
+  background-image: url(/static/images/toolbar/bold_button_down_hover.png);
 }
 
 #italic_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/italic_button_down_hover.png);
+  background-image: url(/static/images/toolbar/italic_button_down_hover.png);
 }
 
 #underline_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/underline_button_down_hover.png);
+  background-image: url(/static/images/toolbar/underline_button_down_hover.png);
 }
 
 #title_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/title_button_down_hover.png);
+  background-image: url(/static/images/toolbar/title_button_down_hover.png);
 }
 
 #bullet_list_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bullet_list_button_down_hover.png);
+  background-image: url(/static/images/toolbar/bullet_list_button_down_hover.png);
 }
 
 #numbered_list_button_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/numbered_list_button_down_hover.png);
+  background-image: url(/static/images/toolbar/numbered_list_button_down_hover.png);
 }
 
 #new_note_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/new_note_button_down.png);
+  background-image: url(/static/images/toolbar/new_note_button_down.png);
 }
 
 #link_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/link_button_down.png);
+  background-image: url(/static/images/toolbar/link_button_down.png);
 }
 
 #attach_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/attach_button_down.png);
+  background-image: url(/static/images/toolbar/attach_button_down.png);
 }
 
 #bold_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bold_button_down.png);
+  background-image: url(/static/images/toolbar/bold_button_down.png);
 }
 
 #italic_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/italic_button_down.png);
+  background-image: url(/static/images/toolbar/italic_button_down.png);
 }
 
 #underline_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/underline_button_down.png);
+  background-image: url(/static/images/toolbar/underline_button_down.png);
 }
 
 #title_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/title_button_down.png);
+  background-image: url(/static/images/toolbar/title_button_down.png);
 }
 
 #bullet_list_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/bullet_list_button_down.png);
+  background-image: url(/static/images/toolbar/bullet_list_button_down.png);
 }
 
 #numbered_list_button_down_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/numbered_list_button_down.png);
+  background-image: url(/static/images/toolbar/numbered_list_button_down.png);
 }
 
 #current_notebook_up_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/arrow_up_hover.png);
+  background-image: url(/static/images/toolbar/arrow_up_hover.png);
 }
 
 #current_notebook_down_hover_preload {
   height: 0;
   overflow: hidden;
-  background-image: url(/static/images/arrow_down_hover.png);
+  background-image: url(/static/images/toolbar/arrow_down_hover.png);
 }
 
 #tree_arrow_hover_preload {
@@ -248,12 +248,6 @@ img {
   background-image: url(/static/images/tree_arrow_down_hover.png);
 }
 
-#note_icon_preload {
-  height: 0;
-  overflow: hidden;
-  background-image: url(/static/images/note_icon.png);
-}
-
 #note_tree_area {
   position: fixed;
   width: 17em;

static/images/images.txt

@@ -1,9 +1,14 @@
-Button dimensions are 40x40 pixels.
+For the large toolbar, button dimensions are 40x40 pixels. Button fonts are
+Bitstream Vera Sans (regular, bold, and mono oblique). Most buttons are at 22
+pt. The link button is at 12 pt. The list buttons are at 10 pt with a -4 pixel
+line spacing. Down (pressed) buttons have their text offset two pixels down
+and two pixels to the right.
 
+For the small version of the toolbar, button dimensions are 20x20 pixels.
 Button fonts are Bitstream Vera Sans (regular, bold, and mono oblique). Most
-buttons are at 22 pt. The link button is at 12 pt. The list buttons are at 10
-pt with a -4 pixel line spacing. Down (pressed) buttons have their text offset
-two pixels down and two pixels to the right.
+buttons are at 14 pt. The link button is at 8 pt. The list buttons are at 6
+pt with a -3 pixel line spacing. Down (pressed) buttons have their text offset
+by one pixel down and one pixel right.
 
 To make the white glowing effect (which isn't present on any buttons
 currently), start with black text on a transparent background in the Gimp.