witten
/
luminotes
Archived
1
0
Fork 0

Refactored toolbar code and images. Now buttons come from a single composite / sprited image.

Remaining things to complete:
  * In WebKit, the button images are offset +5 pixels down. They shouldn't be.
  * Small "+" buttons under notebooks and the note tree are broken.
  * Toolbar resizing doesn't work anymore (TODO comment).
This commit is contained in:
Dan Helfman 2009-03-29 12:23:55 -07:00
parent 190a3fa41d
commit f46e2a8fec
213 changed files with 201 additions and 334 deletions

View File

@ -258,6 +258,8 @@ data_files = [
] ) ),
( "static/images/toolbar", files( "static/images/toolbar/*.*", excludes = [ "static/images/toolbar/*.xcf" ] ) ),
( "static/images/toolbar/small", files( "static/images/toolbar/small/*.*", excludes = [ "static/images/toolbar/small/*.xcf" ] ) ),
( "static/images/toolbar/themes/*", files( "static/images/toolbar/themes/*/*.*", excludes = [ "static/images/toolbar//themes/*/*.xcf" ] ) ),
( "static/images/toolbar/themes/*/small", files( "static/images/toolbar/themes/*/small/*.*", excludes = [ "static/images/toolbar/themes/*/small/*.xcf" ] ) ),
( "static/js", files( "static/js/*.*" ) ),
( "static/js", files( "static/js/*_LICENSE" ) ),
( "model/delta", files( "model/delta/*.sqlite" ) ),

View File

@ -58,203 +58,79 @@ h1 {
}
#toolbar .image_button {
background: transparent url(/static/images/toolbar/buttons.png);
height: 40px;
width: 40px;
padding: 0px;
border-style: none;
outline: none;
position: relative;
}
#toolbar div {
margin-bottom: 0.1em;
#toolbar .button_background {
background: transparent url(/static/images/toolbar/themes/default/buttons.png);
background-position: 40px 0;
height: 40px;
width: 40px;
padding: 0px;
border-style: none;
margin-bottom: 0.25em;
}
#new_note_button_hover_preload {
#toolbar #newNote {
background-position: 200px 0;
}
#toolbar #createLink {
background-position: 240px 0;
}
#toolbar #attachFile {
background-position: 0 0;
}
#toolbar #bold {
background-position: 440px 0;
}
#toolbar #italic {
background-position: 280px 0;
}
#toolbar #underline {
background-position: 40px 0;
}
#toolbar #strikethrough {
background-position: 120px 0;
}
#toolbar #font {
background-position: 360px 0;
}
#toolbar #title {
background-position: 80px 0;
}
#toolbar #insertUnorderedList {
background-position: 400px 0;
}
#toolbar #insertOrderedList {
background-position: 160px 0;
}
#buttons_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/new_note_button_hover.png);
background-image: url(/static/images/toolbar/buttons.png);
}
#link_button_hover_preload {
#theme_default_buttons_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/link_button_hover.png);
}
#attach_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/attach_button_hover.png);
}
#bold_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/bold_button_hover.png);
}
#italic_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/italic_button_hover.png);
}
#underline_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/underline_button_hover.png);
}
#strikethrough_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/strikethrough_button_hover.png);
}
#font_button_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/font_button_hover.png);
}
#bullet_list_button_hover_preload {
height: 0;
overflow: hidden;
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/toolbar/numbered_list_button_hover.png);
}
#new_note_button_down_hover_preload {
height: 0;
overflow: hidden;
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/toolbar/link_button_down_hover.png);
}
#attach_button_down_hover_preload {
height: 0;
overflow: hidden;
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/toolbar/bold_button_down_hover.png);
}
#italic_button_down_hover_preload {
height: 0;
overflow: hidden;
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/toolbar/underline_button_down_hover.png);
}
#strikethrough_button_down_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/strikethrough_button_down_hover.png);
}
#font_button_down_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/font_button_down_hover.png);
}
#bullet_list_button_down_hover_preload {
height: 0;
overflow: hidden;
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/toolbar/numbered_list_button_down_hover.png);
}
#new_note_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/new_note_button_down.png);
}
#link_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/link_button_down.png);
}
#attach_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/attach_button_down.png);
}
#bold_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/bold_button_down.png);
}
#italic_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/italic_button_down.png);
}
#underline_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/underline_button_down.png);
}
#strikethrough_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/strikethrough_button_down.png);
}
#font_button_down_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/toolbar/font_button_down.png);
}
#bullet_list_button_down_preload {
height: 0;
overflow: hidden;
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/toolbar/numbered_list_button_down.png);
}
#current_notebook_up_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/up_arrow_hover.png);
}
#current_notebook_down_hover_preload {
height: 0;
overflow: hidden;
background-image: url(/static/images/down_arrow_hover.png);
background-image: url(/static/images/toolbar/themes/default/buttons.png);
}
#tree_arrow_hover_preload {

View File

@ -10,6 +10,9 @@ 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.
The combined toolbar buttons image is created with the "montage" ImageMagick
command. Use tools/tile_images.sh to do this.
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.
Duplicate the layer, and move that duplicate underneath the original layer.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 714 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 716 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 502 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 950 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 913 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 496 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 963 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 954 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 473 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 901 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 871 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 472 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 634 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 634 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 673 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 689 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 452 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 880 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 853 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 451 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 750 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.2 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 751 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 743 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 656 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 750 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 734 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 641 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 517 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 634 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 618 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 505 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 362 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 496 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 490 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 361 B

Some files were not shown because too many files have changed in this diff Show More