From f360a7affaeda0e692588f15c03d189008c57ba9 Mon Sep 17 00:00:00 2001
From: Kovid Goyal <kovid@kovidgoyal.net>
Date: Sun, 2 Oct 2016 19:44:36 +0530
Subject: [PATCH] A little more refactoring

---
 src/pyj/book_list/cover_grid.pyj | 32 +++++++++++++++++---------------
 src/pyj/book_list/views.pyj      |  8 +++-----
 2 files changed, 20 insertions(+), 20 deletions(-)

diff --git a/src/pyj/book_list/cover_grid.pyj b/src/pyj/book_list/cover_grid.pyj
index 4be4e2a932..df6384368f 100644
--- a/src/pyj/book_list/cover_grid.pyj
+++ b/src/pyj/book_list/cover_grid.pyj
@@ -11,16 +11,25 @@ THUMBNAIL_MAX_HEIGHT = 400
 
 COVER_GRID = unique_id('cover-grid')
 
-def cover_grid_css(sel):
-    ans =  build_rule(f'{sel} #{COVER_GRID} > div:hover', transform='scale(1.2)')
-    ans += build_rule(f'{sel} #{COVER_GRID} > div:active', transform='scale(2)')
+def cover_grid_css():
+    sel = '#' + COVER_GRID
+    ans = build_rule(sel, display='flex', flex_wrap='wrap', justify_content='space-around', align_items='flex-end', align_content='flex-start', user_select='none', overflow='hidden')
+
+    sel += ' > div'
+    ans += build_rule(
+        sel, margin='10px', display='flex', align_content='flex-end', align_items='flex-end', justify_content='space-around',
+        width='21vw', height='28vw', max_width=THUMBNAIL_MAX_WIDTH+'px', max_height=THUMBNAIL_MAX_HEIGHT+'px', cursor='pointer',
+        min_width=f'{THUMBNAIL_MAX_WIDTH // 2}px', min_height=f'{THUMBNAIL_MAX_HEIGHT // 2}px')
+    ans += build_rule(f'{sel}:hover', transform='scale(1.2)')
+    ans += build_rule(f'{sel}:active', transform='scale(2)')
+
+    sel += ' > img'
+    ans += build_rule(sel, max_width='100%', max_height='100%', display='block', width='auto', height='auto', border_radius='10px')
     return ans
 
 def init(container):
     clear(container)
-    div = E.div(id=COVER_GRID)
-    set_css(div, display='flex', flex_wrap='wrap', justify_content='space-around', align_items='flex-end', align_content='flex-start', user_select='none', overflow='hidden')
-    container.appendChild(div)
+    container.appendChild(E.div(id=COVER_GRID))
 
 def on_img_load_error(err):
     img = err.target
@@ -40,17 +49,10 @@ def create_item(book_id, interface_data, onclick):
     cover_url = 'get/thumb/{}/{}?sz={}x{}'.format(book_id, interface_data['library_id'], Math.ceil(THUMBNAIL_MAX_WIDTH*window.devicePixelRatio), Math.ceil(THUMBNAIL_MAX_HEIGHT*window.devicePixelRatio))
     metadata = interface_data['metadata'][book_id]
     alt = _('{} by {}').format(metadata['title'], metadata['authors'].join(' & '))
-    img = E.img(src=cover_url, alt=alt, title=alt, data_title=metadata['title'], data_authors=metadata['authors'].join(' & '),
-                style='max-width: 100%; max-height: 100%; display: block; width:auto; height:auto; border-radius: 10px')
+    img = E.img(src=cover_url, alt=alt, title=alt, data_title=metadata['title'], data_authors=metadata['authors'].join(' & '))
     img.onerror = on_img_load_error
 
-    ans = E.div(
-        style=('margin: 10px; display: flex; align-content: flex-end; align-items: flex-end; justify-content: space-around;'
-                'width: 21vw; height: 28vw; max-width: {}px; max-height: {}px; min-width: {}px; min-height: {}px; cursor:pointer').format(
-                            THUMBNAIL_MAX_WIDTH, THUMBNAIL_MAX_HEIGHT, THUMBNAIL_MAX_WIDTH // 2, THUMBNAIL_MAX_HEIGHT // 2),
-        data_book_id=str(book_id),
-        img
-    )
+    ans = E.div(img, data_book_id=str(book_id))
     ans.addEventListener('click', onclick)
     return ans
 
diff --git a/src/pyj/book_list/views.pyj b/src/pyj/book_list/views.pyj
index 81aca0f6a7..ffdfdaeead 100644
--- a/src/pyj/book_list/views.pyj
+++ b/src/pyj/book_list/views.pyj
@@ -17,12 +17,10 @@ bv_counter = 0
 
 CLASS_NAME = 'books-main-list'
 
-def widget_css():
-    ans = ''
-    sel = f'.{CLASS_NAME} '
-    ans += cover_grid_css(sel)
+add_extra_css(def():
+    ans = cover_grid_css()
     return ans
-add_extra_css(widget_css)
+)
 
 class BooksView: