diff --git a/src/pyj/book_list/search.pyj b/src/pyj/book_list/search.pyj index 64c5247ade..6898e735da 100644 --- a/src/pyj/book_list/search.pyj +++ b/src/pyj/book_list/search.pyj @@ -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 )) diff --git a/src/pyj/book_list/views.pyj b/src/pyj/book_list/views.pyj index 5163291c34..2c1538584f 100644 --- a/src/pyj/book_list/views.pyj +++ b/src/pyj/book_list/views.pyj @@ -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') diff --git a/src/pyj/widgets.pyj b/src/pyj/widgets.pyj index 749c713865..a6481e7e89 100644 --- a/src/pyj/widgets.pyj +++ b/src/pyj/widgets.pyj @@ -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 {{{