Shared styling of modal dialogs goes into kiwix.css

kiwix · Oct 28, 2023 · 3fa25b8 · 3fa25b8
1 parent ab439c7
commit 3fa25b8
Show file tree

Hide file tree

Showing 5 changed files with 61 additions and 113 deletions.
diff --git a/static/skin/index.css b/static/skin/index.css
@@ -325,58 +325,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;

diff --git a/static/skin/kiwix.css b/static/skin/kiwix.css
@@ -1,3 +1,55 @@
+.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;
+}
+
 @font-face {
   font-family: "poppins";
   src: url("../skin/fonts/Poppins.ttf?KIWIXCACHEID") format("truetype");

diff --git a/static/skin/taskbar.css b/static/skin/taskbar.css
@@ -129,58 +129,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;
 }

diff --git a/test/library_server.cpp b/test/library_server.cpp
@@ -1028,12 +1028,12 @@ TEST_F(LibraryServerTest, no_name_mapper_catalog_v2_individual_entry_access)
   "    <title>Welcome to Kiwix Server</title>\n" \
   "    <link\n" \
   "      type=\"text/css\"\n" \
-  "      href=\"/ROOT%23%3F/skin/kiwix.css?cacheid=27f092fb\"\n" \
+  "      href=\"/ROOT%23%3F/skin/kiwix.css?cacheid=28889647\"\n" \
   "      rel=\"Stylesheet\"\n" \
   "    />\n" \
   "    <link\n" \
   "      type=\"text/css\"\n" \
-  "      href=\"/ROOT%23%3F/skin/index.css?cacheid=e4d76d16\"\n" \
+  "      href=\"/ROOT%23%3F/skin/index.css?cacheid=624104e6\"\n" \
   "      rel=\"Stylesheet\"\n" \
   "    />\n" \
   "    <link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"/ROOT%23%3F/skin/favicon/apple-touch-icon.png?cacheid=f86f8df3\">\n" \

diff --git a/test/server.cpp b/test/server.cpp
@@ -61,7 +61,7 @@ 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=624104e6" },
   { 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" },
@@ -71,7 +71,7 @@ const ResourceCollection resources200Compressible{
   { 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=74156c3a" },
+  { STATIC_CONTENT,  "/ROOT%23%3F/skin/taskbar.css?cacheid=786a623c" },
   { 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" },
@@ -141,7 +141,7 @@ const ResourceCollection resources200Uncompressible{
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/hash.png" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/hash.png?cacheid=f836e872" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/kiwix.css" },
-  { STATIC_CONTENT,  "/ROOT%23%3F/skin/kiwix.css?cacheid=27f092fb" },
+  { STATIC_CONTENT,  "/ROOT%23%3F/skin/kiwix.css?cacheid=28889647" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/magnet.png" },
   { STATIC_CONTENT,  "/ROOT%23%3F/skin/magnet.png?cacheid=73b6bddf" },
   { DYNAMIC_CONTENT, "/ROOT%23%3F/skin/search-icon.svg" },
@@ -276,8 +276,8 @@ TEST_F(ServerTest, CacheIdsOfStaticResources)
   const std::vector<UrlAndExpectedResult> testData{
     {
       /* url */ "/ROOT%23%3F/",
-R"EXPECTEDRESULT(      href="/ROOT%23%3F/skin/kiwix.css?cacheid=27f092fb"
-      href="/ROOT%23%3F/skin/index.css?cacheid=e4d76d16"
+R"EXPECTEDRESULT(      href="/ROOT%23%3F/skin/kiwix.css?cacheid=28889647"
+      href="/ROOT%23%3F/skin/index.css?cacheid=624104e6"
     <link rel="apple-touch-icon" sizes="180x180" href="/ROOT%23%3F/skin/favicon/apple-touch-icon.png?cacheid=f86f8df3">
     <link rel="icon" type="image/png" sizes="32x32" href="/ROOT%23%3F/skin/favicon/favicon-32x32.png?cacheid=79ded625">
     <link rel="icon" type="image/png" sizes="16x16" href="/ROOT%23%3F/skin/favicon/favicon-16x16.png?cacheid=a986fedc">
@@ -315,8 +315,8 @@ R"EXPECTEDRESULT(                                <img src="${root}/skin/download
     },
     {
       /* url */ "/ROOT%23%3F/viewer",
-R"EXPECTEDRESULT(    <link type="text/css" href="./skin/kiwix.css?cacheid=27f092fb" rel="Stylesheet" />
-    <link type="text/css" href="./skin/taskbar.css?cacheid=74156c3a" rel="Stylesheet" />
+R"EXPECTEDRESULT(    <link type="text/css" href="./skin/kiwix.css?cacheid=28889647" rel="Stylesheet" />
+    <link type="text/css" href="./skin/taskbar.css?cacheid=786a623c" rel="Stylesheet" />
     <link type="text/css" href="./skin/css/autoComplete.css?cacheid=08951e06" rel="Stylesheet" />
     <script type="module" src="./skin/i18n.js?cacheid=6a8c6fb2" defer></script>
     <script type="text/javascript" src="./skin/languages.js?cacheid=8d132878" defer></script>