Fix styles

README.md

@@ -17,7 +17,7 @@ Recommended to use and install as PWA (Progressive Web App):
 
 For start local development install dependencies
 ```
-npm i
+npm ci
 ```
 
 then run generate dictionary

package.json

@@ -1,6 +1,6 @@
 {
   "name": "interslavic",
-  "version": "1.23.1",
+  "version": "1.23.2",
   "description": "Interslavic Dictionary",
   "license": "MIT",
   "author": {

src/colors.scss

@@ -1,7 +1,24 @@
+body {
+  --gray-1: #111;
+  --gray-2: #222;
+  --gray-3: #333;
+  --gray-4: #444;
+  --gray-5: #555;
+  --gray-6: #666;
+  --gray-7: #777;
+  --gray-8: #888;
+  --gray-9: #999;
+  --gray-a: #aaa;
+  --gray-b: #bbb;
+  --gray-c: #ccc;
+  --gray-d: #ddd;
+  --gray-e: #eee;
+}
+
 .color-theme--light {
   --primary-color: #1E88E5;
   --primary-color-fg: #fff;
-  --muted-text-color: #6c757d;
+  --muted-text-color: #9E9E9E;
   --light-gray-color: #999;
   --valid-color: #43A047;
   --invalid-color: #E53935;
@@ -14,33 +31,18 @@
   --table-border-color: var(--gray-9);
   --overlay-color: #000;
   --tips-font-color: #122f80;
-  --tips-background-color: #e4f1fc;
   --main-background-color: #FAFAFA;
+  --status-badge-color: #fff;
 
   --dark: #212121;
   --light: #fff;
   --transperent: rgba(1, 1, 1, 0);
-
-  --gray-1: #111;
-  --gray-2: #222;
-  --gray-3: #333;
-  --gray-4: #444;
-  --gray-5: #555;
-  --gray-6: #666;
-  --gray-7: #777;
-  --gray-8: #888;
-  --gray-9: #999;
-  --gray-a: #aaa;
-  --gray-b: #bbb;
-  --gray-c: #ccc;
-  --gray-d: #ddd;
-  --gray-e: #eee;
 }
 
 .color-theme--dark {
-  --primary-color: #1E88E5;
+  --primary-color: #42A5F5;
   --primary-color-fg: #fff;
-  --muted-text-color: #6c757d;
+  --muted-text-color: #BDBDBD;
   --light-gray-color: #999;
   --valid-color: #43A047;
   --invalid-color: #E53935;
@@ -49,29 +51,14 @@
   --input-border-color: #444;
   --shadow: 0 8px 16px rgba(0, 0, 0, .05);
   --border: 1px solid var(--input-border-color);
-  --table-highlighted-cell: #0288D1;
+  --table-highlighted-cell: #1976D2;
   --table-border-color: var(--gray-9);
   --overlay-color: #000;
   --tips-font-color: #122f80;
-  --tips-background-color: #e4f1fc;
   --main-background-color: #262626;
+  --status-badge-color: #fff;
 
   --dark: #fff;
   --light: #212121;
   --transperent: rgba(1, 1, 1, 0);
-
-  --gray-1: #111;
-  --gray-2: #222;
-  --gray-3: #333;
-  --gray-4: #444;
-  --gray-5: #555;
-  --gray-6: #666;
-  --gray-7: #777;
-  --gray-8: #888;
-  --gray-9: #999;
-  --gray-a: #aaa;
-  --gray-b: #bbb;
-  --gray-c: #ccc;
-  --gray-d: #ddd;
-  --gray-e: #eee;
 }

src/components/Controls/Controls.scss

@@ -28,6 +28,10 @@
     margin-right: var(--gap-size);
   }
 
+  .pos-selector {
+    padding-bottom: 2px;
+  }
+
   .search-type-selector,
   .pos-selector,
   .flavorisation-selector {

src/components/Pages/CommunityPage/CommunityPage.tsx

@@ -83,10 +83,8 @@ export const CommunityPage = () => {
                     setFbAvailable(true);
                 }
             });
-        } catch (err) {
-            // eslint-disable-next-line no-console
-            console.error(err)
-        }
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        } catch (err) {}
     }, [setFbAvailable]);
 
     useEffect(() => {

src/components/ResultsCard/ResultsCard.scss

@@ -61,7 +61,7 @@
     top: 5px;
     right: 5px;
     background: var(--invalid-color);
-    color: var(--light);
+    color: var(--status-badge-color);
     font-weight: 700;
     font-size: var(--text-xs);
     line-height: var(--text-xs-line);

src/store.ts

@@ -90,10 +90,8 @@ function getInitialState(): IMainState {
             page: getPageFromPath(),
             ...savedState,
         };
-    } catch (err) {
-        // eslint-disable-next-line no-console
-        console.error(err)
-    }
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    } catch (err) {}
 
     setLang(state.interfaceLang);
     Dictionary.setIsvSearchLetters(state.isvSearchLetters);

src/sw.ts

@@ -6,11 +6,12 @@ const cacheUrls = [
     'data/basic.json',
     'data/translateStatistic.json',
     ...addLangs.map((lang) => `data/${lang}.json`),
-    'manifest.json',
     'grammarComponent.js',
+    'communityComponent.js',
     'index.js',
     'sw.js',
     'styles/grammarComponent.css',
+    'styles/communityComponent.css',
     'styles/index.css',
 ];
 

webpack.config.dev.js

@@ -74,7 +74,7 @@ module.exports = {
             template: path.join(srcPath, 'index.html.ejs'),
             filename: 'index.html',
             path: outputPath,
-            excludeChunks: ['sw', 'grammarComponent', 'viewerComponent'],
+            excludeChunks: ['sw', 'grammarComponent', 'viewerComponent', 'communityComponent'],
             env: {
                 BASE_URL: baseUrl,
             },

webpack.config.prod.js

@@ -85,7 +85,7 @@ module.exports = {
             template: path.join(srcPath, 'index.html.ejs'),
             filename: 'index.html',
             path: outputPath,
-            excludeChunks: ['sw', 'grammarComponent', 'viewerComponent'],
+            excludeChunks: ['sw', 'grammarComponent', 'viewerComponent', 'communityComponent'],
             env: {
                 BASE_URL: baseUrl,
             },