diff --git a/static/resources_list.txt b/static/resources_list.txt index 71ebe6760..e339a31a4 100644 --- a/static/resources_list.txt +++ b/static/resources_list.txt @@ -10,6 +10,7 @@ skin/iso6391To3.js skin/isotope.pkgd.min.js skin/index.js skin/autoComplete.min.js +skin/kiwix.css skin/taskbar.css skin/index.css skin/fonts/Poppins.ttf diff --git a/static/skin/index.css b/static/skin/index.css index 407fb7746..bfe6dc1f3 100644 --- a/static/skin/index.css +++ b/static/skin/index.css @@ -1,29 +1,7 @@ -*, -*::after, -*::before { - margin: 0; - padding: 0; - box-sizing: inherit; -} - -html { - font-size: 62.5%; -} - -body { - position: relative; - box-sizing: border-box; -} - -::selection { - background-color: #00b4e4; - color: white; -} - .kiwixNav { background-color: #f4f6f8; width: 100%; - padding: 20px; + padding: 10px 20px; position: sticky; top: 0; z-index: 3; @@ -59,10 +37,10 @@ body { background-image: none; border-radius: 1px; width: 195px; - height: 35px; + height: 30px; flex: 1; color: black; - padding: 7px 10px 10px; + padding: 0px 10px 0px 10px; cursor: pointer; } @@ -74,7 +52,7 @@ body { position: relative; display: flex; width: 231px; - height: 35px; + height: 30px; line-height: 3; background: #909090; overflow: hidden; @@ -104,7 +82,7 @@ body { } .kiwixSearch { - height: 35px; + height: 30px; width: 231px; border-radius: 10px; border: solid 1px #b5b2b2; @@ -118,7 +96,7 @@ body { .kiwixButton { margin: 0 17px; - height: 35px; + height: 30px; width: 100px; border-radius: 10px; color: white; @@ -162,29 +140,6 @@ body { font-weight: bolder; } -#uiLanguageSelector { - display: none; -} - -#uiLanguageSelector .modal { - height: 140px; -} - -#uiLanguageSelector .modal-heading { - height: 40%; -} - -#uiLanguageSelector .modal-content #ui_language { - font-size: 1.6rem; - width: 100%; -} - -#uiLanguageSelectorButton { - margin: 0 12px 0 0; - float: right; - cursor: pointer; -} - .book__list { position: relative; margin: 0 auto; @@ -325,58 +280,6 @@ body { -webkit-box-orient: vertical; } -.modal-wrapper { - position: fixed; - z-index: 100; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - display: flex; - justify-content: center; - align-items: center; - align-content: center; - background-color: rgba(0, 0, 0, 30%); -} - -.modal { - color: #444343; - height: 280px; - width: 250px; - margin: 15px; - background-color: #f7f7f7; - border: 1px solid #ececec; - border-radius: 3px; -} - -.modal-heading { - background-color: #f0f0f0; - height: 20%; - width: 100%; - border-bottom: 1px solid #ececec; - display: grid; - grid-template-columns: 3fr 1fr; -} - -.modal-title { - display: flex; - font-size: 15px; - align-items: center; - padding-left: 20px; - font-family: poppins; -} - -.modal-close-button { - cursor: pointer; - display: flex; - justify-content: center; - align-items: center; -} - -.modal-content { - padding: 20px; -} - .modal-content div { width: 100%; height: 40px; @@ -469,7 +372,7 @@ body { width: auto; } -.feedLogo, #uiLanguageSelectorButton { +.feedLogo { height: 30px; float: right; } diff --git a/static/skin/kiwix.css b/static/skin/kiwix.css new file mode 100644 index 000000000..32b2a8d6e --- /dev/null +++ b/static/skin/kiwix.css @@ -0,0 +1,107 @@ +*, +*::after, +*::before { + margin: 0; + padding: 0; + box-sizing: inherit; +} + +html { + font-size: 62.5%; +} + +body { + position: relative; + box-sizing: border-box; +} + +::selection { + background-color: #00b4e4; + color: white; +} + +.modal-wrapper { + position: fixed; + z-index: 100; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + align-content: center; + background-color: rgba(0, 0, 0, 30%); +} + +.modal { + color: #444343; + height: 280px; + width: 250px; + margin: 15px; + background-color: #f7f7f7; + border: 1px solid #ececec; + border-radius: 3px; +} + +.modal-heading { + background-color: #f0f0f0; + height: 20%; + width: 100%; + border-bottom: 1px solid #ececec; + display: grid; + grid-template-columns: 3fr 1fr; +} + +.modal-title { + display: flex; + font-size: 15px; + align-items: center; + padding-left: 20px; + font-family: poppins; +} + +.modal-close-button { + cursor: pointer; + display: flex; + justify-content: center; + align-items: center; +} + +.modal-content { + padding: 20px; +} + +#uiLanguageSelector { + display: none; +} + +#uiLanguageSelector .modal { + height: 140px; +} + +#uiLanguageSelector .modal-heading { + height: 40%; +} + +#uiLanguageSelector .modal-content #ui_language { + font-size: 1.6rem; + width: 100%; +} + +#uiLanguageSelectorButton { + margin: 0px 12px 6px 12px; + float: right; + cursor: pointer; + height: 30px; +} + +@font-face { + font-family: "poppins"; + src: url("../skin/fonts/Poppins.ttf?KIWIXCACHEID") format("truetype"); +} + +@font-face { + font-family: "roboto"; + src: url("../skin/fonts/Roboto.ttf?KIWIXCACHEID") format("truetype"); +} diff --git a/static/skin/taskbar.css b/static/skin/taskbar.css index 865c8c6f9..81e8f6160 100644 --- a/static/skin/taskbar.css +++ b/static/skin/taskbar.css @@ -3,7 +3,7 @@ transition: 0.3s; width: 100%; box-sizing: border-box; - background: #e3e3e3; + background: #f4f6f8; border-bottom: 1px solid #aaa; } @@ -21,6 +21,7 @@ } .kiwixsearch { + font-size: 1.6rem; position: relative; height: 26px; width: 100%; @@ -87,7 +88,7 @@ label[for="kiwix_button_show_toggle"], line-height: 20px !important; margin-right: 5px !important; padding: 2px 6px !important; - border: 1px solid #999 !important; + border: 1px solid #b5b2b2 !important; border-radius: 3px !important; background-color: #ededed !important; font-weight: normal !important; @@ -101,7 +102,7 @@ label[for="kiwix_button_show_toggle"], width: 100%; height: 26px !important; line-height: 20px !important; - border: 1px solid #999 !important; + border: 1px solid #b5b2b2 !important; border-radius: 3px !important; background-color: #fff !important; padding: 2px 2px 2px 27px !important; @@ -119,6 +120,7 @@ label[for=kiwixsearchbox] { } a.suggest, a.suggest:visited, a.suggest:hover, a.suggest:active { + font-size: 1.6rem; display: block; text-decoration: none; color: inherit; @@ -129,82 +131,6 @@ a.suggest, a.suggest:visited, a.suggest:hover, a.suggest:active { column-count: 1 !important; } -.modal-wrapper { - position: fixed; - z-index: 100; - top: 0; - left: 0; - width: 100vw; - height: 100vh; - display: flex; - justify-content: center; - align-items: center; - align-content: center; - background-color: rgba(0, 0, 0, 30%); -} - -.modal { - color: #444343; - height: 280px; - width: 250px; - margin: 15px; - background-color: #f7f7f7; - border: 1px solid #ececec; - border-radius: 3px; -} - -.modal-heading { - background-color: #f0f0f0; - height: 20%; - width: 100%; - border-bottom: 1px solid #ececec; - display: grid; - grid-template-columns: 3fr 1fr; -} - -.modal-title { - display: flex; - font-size: 15px; - align-items: center; - padding-left: 20px; - font-family: poppins; -} - -.modal-close-button { - cursor: pointer; - display: flex; - justify-content: center; - align-items: center; -} - -.modal-content { - padding: 20px; -} - -#uiLanguageSelector { - display: none; -} - -#uiLanguageSelector .modal { - height: 140px; -} - -#uiLanguageSelector .modal-heading { - height: 40%; -} - -#uiLanguageSelector .modal-content #ui_language { - font-size: 1rem; - width: 100%; -} - -#uiLanguageSelectorButton { - margin: 0px 12px 6px 12px; - float: right; - cursor: pointer; - height: 30px; -} - @media(min-width:420px) { .kiwix_button_cont { display: inline-block !important; @@ -256,13 +182,3 @@ a.suggest, a.suggest:visited, a.suggest:hover, a.suggest:active { width: 80%; } } - -@font-face { - font-family: "poppins"; - src: url("../skin/fonts/Poppins.ttf?KIWIXCACHEID") format("truetype"); -} - -@font-face { - font-family: "roboto"; - src: url("../skin/fonts/Roboto.ttf?KIWIXCACHEID") format("truetype"); -} diff --git a/static/templates/index.html b/static/templates/index.html index ec887ab55..46be2d7f9 100644 --- a/static/templates/index.html +++ b/static/templates/index.html @@ -5,6 +5,11 @@ Welcome to Kiwix Server + - diff --git a/static/templates/no_js_library_page.html b/static/templates/no_js_library_page.html index edab66fc6..71c7ab6d6 100644 --- a/static/templates/no_js_library_page.html +++ b/static/templates/no_js_library_page.html @@ -5,6 +5,11 @@ {{translations.welcome-to-kiwix-server}} + {{translations.count-of-matching-books}}
{{{translations.powered-by-kiwix-html}}}
- \ No newline at end of file + diff --git a/static/viewer.html b/static/viewer.html index 392e26243..49899723a 100644 --- a/static/viewer.html +++ b/static/viewer.html @@ -8,6 +8,7 @@ object-src 'none';"> ZIM Viewer + diff --git a/test/library_server.cpp b/test/library_server.cpp index c9c34e367..0a52ef0b1 100644 --- a/test/library_server.cpp +++ b/test/library_server.cpp @@ -1028,7 +1028,12 @@ TEST_F(LibraryServerTest, no_name_mapper_catalog_v2_individual_entry_access) " Welcome to Kiwix Server\n" \ " \n" \ + " \n" \ " \n" \ @@ -1145,7 +1150,7 @@ TEST_F(LibraryServerTest, no_name_mapper_catalog_v2_individual_entry_access) " \n" \ "
Powered by Kiwix
\n" \ " \n" \ - "" + "\n" #define FILTERS_HTML(SELECTED_ENG) \ "
\n" \ diff --git a/test/server.cpp b/test/server.cpp index cc42c4ae6..93d6bf71e 100644 --- a/test/server.cpp +++ b/test/server.cpp @@ -61,17 +61,19 @@ const ResourceCollection resources200Compressible{ { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/i18n.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/i18n.js?cacheid=6a8c6fb2" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/index.css" }, - { STATIC_CONTENT, "/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" }, + { STATIC_CONTENT, "/ROOT%23%3F/skin/index.css?cacheid=1e78e7cf" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/index.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/index.js?cacheid=ce19da2a" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/iso6391To3.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/iso6391To3.js?cacheid=ecde2bb3" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/isotope.pkgd.min.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/isotope.pkgd.min.js?cacheid=2e48d392" }, + { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/kiwix.css" }, + { STATIC_CONTENT, "/ROOT%23%3F/skin/kiwix.css?cacheid=9b1b089f" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/mustache.min.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/mustache.min.js?cacheid=bd23c4fb" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css" }, - { STATIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css?cacheid=5ab04b5a" }, + { STATIC_CONTENT, "/ROOT%23%3F/skin/taskbar.css?cacheid=a1200d6b" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/viewer.js" }, { STATIC_CONTENT, "/ROOT%23%3F/skin/viewer.js?cacheid=201653b8" }, { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/fonts/Poppins.ttf" }, @@ -274,7 +276,8 @@ TEST_F(ServerTest, CacheIdsOfStaticResources) const std::vector testData{ { /* url */ "/ROOT%23%3F/", -R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" +R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/kiwix.css?cacheid=9b1b089f" + href="/ROOT%23%3F/skin/index.css?cacheid=1e78e7cf" @@ -282,8 +285,6 @@ R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" - src: url("/ROOT%23%3F/skin/fonts/Poppins.ttf?cacheid=af705837") format("truetype"); - src: url("/ROOT%23%3F/skin/fonts/Roboto.ttf?cacheid=84d10248") format("truetype"); @@ -291,6 +292,12 @@ R"EXPECTEDRESULT( href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16" +R"EXPECTEDRESULT( +