Dark mode issues

qdraw · Feb 29, 2024 · f4cc2bf · f4cc2bf
1 parent 2e8a1ed
commit f4cc2bf
Show file tree

Hide file tree

Showing 11 changed files with 73 additions and 41 deletions.
diff --git a/starsky-tools/mock/api/env/index.json b/starsky-tools/mock/api/env/index.json
@@ -33,6 +33,7 @@
   "addSwagger": false,
   "addSwaggerExport": false,
   "addLegacyOverwrite": false,
+  "storageFolderAllowEdit": true,
   "webFtp": "warning: The field is not empty but for security reasons it is not shown",
   "publishProfiles": [
     {

diff --git a/starsky/starsky/clientapp/clientapp.code-workspace b/starsky/starsky/clientapp/clientapp.code-workspace
@@ -1,33 +1,30 @@
 {
-	"folders": [
-		{
-			"path": "."
-		}
-	],
-	"settings": {
-		"editor.codeActionsOnSave": {
+  "folders": [
+    {
+      "path": "."
+    }
+  ],
+  "settings": {
+    "editor.codeActionsOnSave": {
       "source.organizeImports": "explicit",
       "source.fixAll": "explicit",
       "source.fixAll.eslint": "explicit"
     },
-		"editor.formatOnPaste": true,
-		"editor.tabSize": 2,
-		"editor.detectIndentation": false,
-		"editor.insertSpaces": true,
-		"html.format.wrapLineLength": 100,
-		"html.format.wrapAttributes": "force-aligned",
-		"html.format.contentUnformatted": "pre,code,textarea, span",
-		"html.format.endWithNewline": true,
-		"javascript.preferences.quoteStyle": "double",
-		"javascript.updateImportsOnFileMove.enabled": "always",
-		"jest.disabledWorkspaceFolders": [
-			"node_modules",
-			"mock",
-			"history.md"
-		],
-		"typescript.preferences.quoteStyle": "double",
-		"typescript.updateImportsOnFileMove.enabled": "always",
-		"typescript.tsdk": "clientapp/node_modules/typescript/lib",
-		"editor.formatOnSave": true,
-	}
-}
+    "editor.formatOnPaste": true,
+    "editor.tabSize": 2,
+    "editor.detectIndentation": false,
+    "editor.insertSpaces": true,
+    "html.format.wrapLineLength": 100,
+    "html.format.wrapAttributes": "force-aligned",
+    "html.format.contentUnformatted": "pre,code,textarea, span",
+    "html.format.endWithNewline": true,
+    "javascript.preferences.quoteStyle": "double",
+    "javascript.updateImportsOnFileMove.enabled": "always",
+    "jest.disabledWorkspaceFolders": ["node_modules", "mock", "history.md"],
+    "typescript.preferences.quoteStyle": "double",
+    "typescript.updateImportsOnFileMove.enabled": "always",
+    "typescript.tsdk": "clientapp/node_modules/typescript/lib",
+    "editor.formatOnSave": true,
+    "testing.openTesting": "neverOpen"
+  }
+}
diff --git a/.../components/organisms/preference-app-settings-desktop/preference-app-settings-desktop.tsx b/.../components/organisms/preference-app-settings-desktop/preference-app-settings-desktop.tsx
@@ -117,7 +117,9 @@ const PreferencesAppSettingsDesktop: React.FunctionComponent = () => {
               ? "preference-app-settings-desktop-use-local-desktop-true"
               : "preference-app-settings-desktop-use-local-desktop-false"
           }
-          className={appSettings?.useLocalDesktop ? "" : "warning-box"}
+          className={
+            appSettings?.useLocalDesktop ? "warning-box warning-box--optional" : "warning-box"
+          }
         >
           {MessageSwitchButtonDesktopApplicationDescription}
         </div>

diff --git a/...eferences-app-settings-storage-folder/preferences-app-settings-storage-folder.stories.tsx b/...eferences-app-settings-storage-folder/preferences-app-settings-storage-folder.stories.tsx
@@ -5,7 +5,11 @@ export default {
 };
 
 export const Default = () => {
-  return <PreferencesAppSettingsStorageFolder />;
+  return (
+    <div data-test="preferences-username-text" className="content--text preferences-username-text">
+      <PreferencesAppSettingsStorageFolder />
+    </div>
+  );
 };
 
 Default.storyName = "default";
diff --git a/...nisms/preferences-app-settings-storage-folder/preferences-app-settings-storage-folder.tsx b/...nisms/preferences-app-settings-storage-folder/preferences-app-settings-storage-folder.tsx
@@ -37,7 +37,7 @@ const PreferencesAppSettingsStorageFolder: React.FunctionComponent = () => {
   const MessageAppSettingStorageFolderEnvUsedFail = language.key(
     localization.MessageAppSettingStorageFolderEnvUsedFail
   );
-
+  const MessageReadMoreHere = language.key(localization.MessageReadMoreHere);
   const permissionsData = useFetch(new UrlQuery().UrlAccountPermissions(), "get");
 
   const [isEnabled, setIsEnabled] = useState(false);
@@ -91,7 +91,10 @@ const PreferencesAppSettingsStorageFolder: React.FunctionComponent = () => {
 
       {storageFolder !== appSettings?.storageFolder && !storageFolderNotFound ? (
         <div className="warning-box" data-test="storage-changed">
-          {MessageChangeNeedReSync}
+          {MessageChangeNeedReSync}{" "}
+          <a target="_blank" href={new UrlQuery().DocsGettingStartedFirstSteps()} rel="noreferrer">
+            {MessageReadMoreHere}
+          </a>
         </div>
       ) : null}
 

diff --git a/.../starsky/clientapp/src/components/organisms/preferences-username/preferences-username.tsx b/.../starsky/clientapp/src/components/organisms/preferences-username/preferences-username.tsx
@@ -35,7 +35,7 @@ const PreferencesUsername: React.FunctionComponent = () => {
         {userName}
       </div>
       <div className="content--subheader">{MessageRole}</div>
-      <div className="content--text">{accountStatus?.data?.roleCode}</div>
+      <div className="content--text preferences-role">{accountStatus?.data?.roleCode}</div>
     </>
   );
 };

diff --git a/starsky/starsky/clientapp/src/localization/localization.json b/starsky/starsky/clientapp/src/localization/localization.json
@@ -1014,6 +1014,11 @@
     "nl": "Ga naar de homepagina",
     "de": "Gehe zur Startseite"
   },
+  "MessageReadMoreHere": {
+    "en": "Read more here",
+    "nl": "Lees meer hier",
+    "de": "Lesen Sie hier mehr"
+  },
   "temp1": {
     "en": "More",
     "nl": "Meer",

diff --git a/starsky/starsky/clientapp/src/shared/url/url-query.ts b/starsky/starsky/clientapp/src/shared/url/url-query.ts
@@ -436,4 +436,8 @@ export class UrlQuery {
     url += "//" + window.location.host + this.prefix + "/realtime";
     return url;
   }
+
+  public DocsGettingStartedFirstSteps(): string {
+    return "https://docs.qdraw.nl/docs/getting-started/first-steps";
+  }
 }
diff --git a/starsky/starsky/clientapp/src/style/css/20-content.css b/starsky/starsky/clientapp/src/style/css/20-content.css
@@ -170,6 +170,13 @@
   margin-bottom: 8px;
 }
 
+.content--text .warning-box a,
+.content .warning-box a,
+.content > form > .content--error-true a {
+  color: white;
+  text-decoration: underline;
+}
+
 .warning-box.warning-box--under-form {
   margin-top: 25px;
 }
@@ -259,10 +266,3 @@
 .publish .warning-box {
   margin-top: 4px;
 }
-
-/*for password gui*/
-@media (prefers-color-scheme: dark) {
-  .preferences-username-text {
-    color: #fff;
-  }
-}
diff --git a/starsky/starsky/clientapp/src/style/css/50-preferences.css b/starsky/starsky/clientapp/src/style/css/50-preferences.css
@@ -2,3 +2,18 @@
 .preferences--password .warning-box {
   margin-top: 10px;
 }
+
+@media (prefers-color-scheme: dark) {
+  .preferences--app-settings h3,
+  .preferences--app-settings p {
+    color: white;
+  }
+}
+
+/*for password gui*/
+@media (prefers-color-scheme: dark) {
+  .preferences-role,
+  .preferences-username-text {
+    color: #fff;
+  }
+}
diff --git a/starskydesktop/starskydesktop.code-workspace b/starskydesktop/starskydesktop.code-workspace
@@ -17,6 +17,7 @@
         "editor.formatOnSave": true,
         "typescript.preferences.quoteStyle": "double",
         "typescript.updateImportsOnFileMove.enabled": "always",
-        "cSpell.words": ["Starsky"]
+        "cSpell.words": ["Starsky"],
+        "testing.openTesting": "neverOpen"
     }
 }