Properly position speed dial close and show on hover

This commit is contained in:
Paweł Forysiuk 2011-10-11 01:52:39 +02:00 committed by Christian Dywan
parent 8a8e59b598
commit a5ea7607d4
2 changed files with 23 additions and 10 deletions

View file

@ -47,6 +47,13 @@
from(#f6f6f6), to(#e3e3e3)); from(#f6f6f6), to(#e3e3e3));
border: 1px solid #bebebe; border: 1px solid #bebebe;
border-bottom-color: #a0a0a0; border-bottom-color: #a0a0a0;
position: relative;
}
div.shortcut .preview img {
width: 100%;
height: 98%;
cursor: pointer;
} }
div.shortcut .preview.new .add { div.shortcut .preview.new .add {
@ -73,8 +80,17 @@
top: -14px; top: -14px;
left: -14px; left: -14px;
background: url(res://close.png); background: url(res://close.png);
position: relative; position: absolute;
cursor: pointer; cursor: pointer;
visibility: hidden;
opacity: 0;
-webkit-transition: opacity 0.15s;
}
div.shortcut:hover .cross {
visibility: visible;
opacity: 1;
-webkit-transition-delay: 0.5s;
} }
.box.added { .box.added {

View file

@ -3771,12 +3771,10 @@ prepare_speed_dial_html (MidoriView* view)
g_string_append_printf (markup, g_string_append_printf (markup,
"<div class=\"shortcut\" id=\"s%d\"><div class=\"preview\">" "<div class=\"shortcut\" id=\"s%d\"><div class=\"preview\">"
"<a href=\"%s\"><img style=\"width: 100%%;\" " "<a class=\"cross\" href=\"#\" onclick='clearShortcut(\"s%d\");'></a>"
"src=\"data:image/png;base64,%s\"></a><a class=\"cross\" " "<a href=\"%s\"><img src=\"data:image/png;base64,%s\"></a>"
"href=\"#\" onclick='javascript:clearShortcut(\"s%d\");' ></a>" "</div><div class=\"title\" onclick='renameShortcut(\"s%d\");'>%s</div></div>\n",
"</div><div class=\"title\" " slot, slot, uri, encoded, slot, title);
"onclick='javascript:renameShortcut(\"s%d\");'>%s</div></div>\n",
slot, uri, encoded, slot, slot, title);
g_free (title); g_free (title);
g_free (encoded); g_free (encoded);
@ -3785,9 +3783,8 @@ prepare_speed_dial_html (MidoriView* view)
{ {
g_string_append_printf (markup, g_string_append_printf (markup,
"<div class=\"shortcut\" id=\"s%d\"><div class=\"preview new\">" "<div class=\"shortcut\" id=\"s%d\"><div class=\"preview new\">"
"<a class=\"add\" href=\"#\" onclick='javascript:return " "<a class=\"add\" href=\"#\" onclick='return getAction(\"s%d\");'></a>"
" getAction(\"s%d\");'></a></div>" "</div><div class=\"title\">%s</div></div>\n",
"<div class=\"title\">%s</div></div>\n",
slot, slot, _("Click to add a shortcut")); slot, slot, _("Click to add a shortcut"));
} }