witten
/
luminotes
Archived
1
0
Fork 0

Toolbar buttons are now more clearer, e.g. list buttons look like little lists.

This commit is contained in:
Dan Helfman 2007-09-28 05:07:14 +00:00
parent 9673d84c3f
commit 781683cc6f
4 changed files with 93 additions and 24 deletions

View File

@ -9,7 +9,7 @@
top: expression( eval( document.compatMode && document.compatMode == 'CSS1Compat' ) ? documentElement.scrollTop + 20 : document.body.scrollTop + 20 ); top: expression( eval( document.compatMode && document.compatMode == 'CSS1Compat' ) ? documentElement.scrollTop + 20 : document.body.scrollTop + 20 );
margin-left:expression( margin-left:expression(
document.body.clientWidth < ( 900 / 12 ) * document.body.clientWidth < ( 900 / 12 ) *
parseInt( document.body.currentStyle.fontSize ) ? "-4em": "0em" parseInt( document.body.currentStyle.fontSize ) ? "-2em": "2em"
); );
} }
@ -58,3 +58,18 @@
height: expression( this.scrollHeight > 200 ? "200px" : "auto" ); height: expression( this.scrollHeight > 200 ? "200px" : "auto" );
width: expression( this.scrollHeight > 200 ? "12em" : "auto" ); width: expression( this.scrollHeight > 200 ? "12em" : "auto" );
} }
#toolbar .button_wrapper {
position: absolute;
}
.toolbar_text {
position: relative;
top: 0.375em;
}
.toolbar_list_text {
position: relative;
top: -0.625em;
line-height: 50%;
}

View File

@ -15,3 +15,15 @@
#link_area { #link_area {
margin-left: 1.5em; margin-left: 1.5em;
} }
.toolbar_text {
position: relative;
top: 0.375em;
height: 2em;
}
.toolbar_list_text {
position: relative;
top: -0.625em;
line-height: 50%;
}

View File

@ -43,7 +43,6 @@ ol li {
} }
#toolbar { #toolbar {
float: left;
width: 15em; width: 15em;
max-width: 18%; max-width: 18%;
position: fixed; position: fixed;
@ -52,14 +51,8 @@ ol li {
z-index: 1; z-index: 1;
} }
#toolbar ul li { #toolbar .button_wrapper {
list-style: none; float: right;
text-indent: -2.5em;
margin-top: 0em;
margin-left: 0em;
margin-bottom: 0.25em;
padding-top: 0em;
padding-left: 0em;
} }
#toolbar .button { #toolbar .button {
@ -69,11 +62,18 @@ ol li {
height: 2em; height: 2em;
width: 2em; width: 2em;
font-size: 125%; font-size: 125%;
text-align: center;
vertical-align: middle;
display: table-cell;
outline: none; outline: none;
-moz-border-radius: 0.5em; -moz-border-radius: 0.5em;
-webkit-border-radius: 0.5em; -webkit-border-radius: 0.5em;
} }
#toolbar div {
margin-bottom: 0.25em;
}
#toolbar .button:hover { #toolbar .button:hover {
background-color: #ffcc66; background-color: #ffcc66;
} }
@ -88,6 +88,21 @@ ol li {
background-color: #ffbb55; background-color: #ffbb55;
} }
.toolbar_link_button {
font-size: 60%;
}
.toolbar_list_text {
font-size: 50%;
line-height: 90%;
}
#createLink {
color: blue;
font-weight: bold;
text-decoration: underline;
}
#bold { #bold {
font-weight: bold; font-weight: bold;
} }

View File

@ -1,23 +1,50 @@
from Tags import Div, Ul, Li, A, Input from Tags import P, Div, A, Input, Span, Br
class Toolbar( Div ): class Toolbar( Div ):
def __init__( self ): def __init__( self ):
Div.__init__( Div.__init__(
self, self,
Ul( Div(
Li( Input( type = u"button", value = u"+", id = u"newNote", title = u"new note [ctrl-N]", class_ = u"button" ) ), P(
Li( Input( type = u"button", value = u"&#8594", id = u"createLink", title = u"note link [ctrl-L]", class_ = u"button" ) ), Div( Div( Span( u"+", class_ = u"toolbar_text" ), id = u"newNote", title = u"new note [ctrl-N]", class_ = u"button" ) ),
), Div( Div(
Ul( Span(
Li( Input( type = u"button", value = u"B", id = u"bold", title = u"bold [ctrl-B]", class_ = u"button" ) ), u"link",
Li( Input( type = u"button", value = u"I", id = u"italic", title = u"italic [ctrl-I]", class_ = u"button" ) ), class_ = u"toolbar_text toolbar_link_button",
Li( Input( type = u"button", value = u"U", id = u"underline", title = u"underline [ctrl-U]", class_ = u"button" ) ), ),
Li( Input( type = u"button", value = u"T", id = u"title", title = u"title [ctrl-T]", class_ = u"button" ) ), id = u"createLink", title = u"link [ctrl-L]", class_ = u"button"
), ) ),
Ul( ),
Li( Input( type = u"button", value = u"&#149;", id = u"insertUnorderedList", title = u"bullet list [ctrl-period]", class_ = u"button" ) ), P(
Li( Input( type = u"button", value = u"1.", id = u"insertOrderedList", title = u"numbered list [ctrl-1]", class_ = u"button" ) ), Div( Div( Span( u"B", class_ = u"toolbar_text" ), id = u"bold", title = u"bold [ctrl-B]", class_ = u"button" ) ),
Div( Div( Span( u"I", class_ = u"toolbar_text" ), id = u"italic", title = u"italic [ctrl-I]", class_ = u"button" ) ),
Div( Div( Span( u"U", class_ = u"toolbar_text" ), id = u"underline", title = u"underline [ctrl-U]", class_ = u"button" ) ),
Div( Div( Span( u"T", class_ = u"toolbar_text" ), id = u"title", title = u"title [ctrl-T]", class_ = u"button" ) ),
),
P(
Div( Div(
Span(
u"&#149; &#8213;", Br(),
u"&#149; &#8213;", Br(),
u"&#149; &#8213;", Br(),
Br( class_ = "undisplayed" ), # to make IE 6 happy. without this, the last list element is truncated
class_ = u"toolbar_list_text",
),
id = u"insertUnorderedList", title = u"bullet list [ctrl-period]", class_ = u"button",
) ),
Div( Div(
Span(
u"1.&#8213;", Br(),
u"2.&#8213;", Br(),
u"3.&#8213;", Br(),
Br( class_ = "undisplayed" ),
class_ = u"toolbar_list_text",
),
id = u"insertOrderedList", title = u"numbered list [ctrl-1]", class_ = u"button",
) ),
),
class_ = u"button_wrapper",
), ),
id = u"toolbar", id = u"toolbar",
class_ = u"undisplayed", # start out as hidden, and then shown in the browser if the current notebook is read-write class_ = u"undisplayed", # start out as hidden, and then shown in the browser if the current notebook is read-write