mirror of
https://github.com/kovidgoyal/calibre.git
synced 2025-07-08 02:34:06 -04:00
Use a link tag instead of a button tag for buttons
There are various rendering artifacts when trying to override the rendering of buttons on different browsers
This commit is contained in:
parent
72a9cafdb5
commit
b45a6366cb
@ -6,7 +6,7 @@ from ajax import ajax
|
||||
from dom import clear, set_css, build_rule, svgicon
|
||||
from elementmaker import E
|
||||
from gettext import gettext as _
|
||||
from widgets import create_button, BUTTON_VPADDING, create_spinner, Breadcrumbs
|
||||
from widgets import create_button, create_spinner, Breadcrumbs
|
||||
from modals import show_modal
|
||||
from book_list.globals import get_boss, get_session_data
|
||||
from book_list.theme import get_color, get_font_size
|
||||
@ -51,7 +51,7 @@ class SearchPanel:
|
||||
E.input(
|
||||
type='search', name='search-books',
|
||||
title=_('Search for books'), placeholder=_('Enter the search query'),
|
||||
style="flex-grow: 10; padding: {} 0.5em; margin-right: 0.5em".format(BUTTON_VPADDING), onkeydown=self.on_input_keydown.bind(self),
|
||||
style="flex-grow: 10; margin-right: 0.5em", onkeydown=self.on_input_keydown.bind(self),
|
||||
),
|
||||
search_button
|
||||
))
|
||||
|
@ -48,7 +48,7 @@ class BooksView:
|
||||
))
|
||||
more.lastChild.setAttribute('rel', 'next')
|
||||
set_css(more.firstChild, display='block', margin_left='auto', margin_right='auto')
|
||||
set_css(more, font_size='1.5rem', padding_top='1.5rem', margin_bottom='1.5rem', width='100%', text_align='center')
|
||||
set_css(more, font_size='1.5rem', padding_top='1.5rem', margin_bottom='1.5rem', text_align='center', display='flex')
|
||||
more.appendChild(E.div(
|
||||
create_spinner(), '\xa0' + _('Fetching metadata for more books, please wait') + '…',
|
||||
style='margin-left:auto; margin-right:auto; display:none')
|
||||
|
@ -8,27 +8,27 @@ from elementmaker import E
|
||||
from book_list.theme import get_color
|
||||
|
||||
# Button {{{
|
||||
BUTTON_VPADDING = '0.5ex'
|
||||
|
||||
def create_button(text, icon=None, action=None, tooltip=None, highlight=False):
|
||||
ic = ''
|
||||
if icon:
|
||||
ic = svgicon(icon)
|
||||
text = '\xa0' + text
|
||||
ans = E.button(ic, text, class_='calibre-push-button', type='button', title=tooltip or '')
|
||||
ans = E.a(ic, E.span(text), class_='calibre-push-button', href='javascript: void(0)', title=tooltip or '')
|
||||
if action is not None:
|
||||
ans.addEventListener('click', def(event): event.preventDefault(), action(event);)
|
||||
if highlight:
|
||||
set_css(ans, font_size='larger', font_weight='bold')
|
||||
return ans
|
||||
|
||||
create_button.style = build_rule('button.calibre-push-button',
|
||||
create_button.style = build_rule('a.calibre-push-button',
|
||||
border_radius='1em', background_clip='padding-box', background_color=get_color('button-start'),
|
||||
background_image='linear-gradient(to bottom, {}, {})'.format(get_color('button-start'), get_color('button-end')),
|
||||
padding=BUTTON_VPADDING + ' 1em', color=get_color('button-text'), cursor='pointer', font_size='inherit'
|
||||
padding='0.5ex 1em', color=get_color('button-text'), cursor='pointer', font_size='inherit', display='inline-flex', align_items='center',
|
||||
box_shadow='0px 2px 1px rgba(50, 50, 50, 0.75)',
|
||||
)
|
||||
create_button.style += build_rule('button.calibre-push-button:hover', transform='scale(1.2)')
|
||||
create_button.style += build_rule('button.calibre-push-button:active', transform='scale(2)')
|
||||
create_button.style += build_rule('a.calibre-push-button:hover', transform='scale(1.2)')
|
||||
create_button.style += build_rule('a.calibre-push-button:active', transform='scale(2)')
|
||||
# }}}
|
||||
|
||||
# Spinner {{{
|
||||
|
Loading…
x
Reference in New Issue
Block a user