style(resource list): prevent shift/overlap of checkboxes (#1149)

dasch-swiss · Jul 18, 2023 · e2d1582 · e2d1582
1 parent f219e84
commit e2d1582
Show file tree

Hide file tree

Showing 8 changed files with 91 additions and 5 deletions.
diff --git a/README.md b/README.md
@@ -49,6 +49,7 @@ The most common commands are defined in `package.json`.
 | `nx run dsp-app:serve:dev-server`                             | `npm run start-with-dev-server`     |
 | `nx run dsp-app:serve:ls-test-server`                         | `npm run start-with-ls-test-server` |
 | `nx run dsp-app:serve:staging-server`                         | `npm run start-with-staging-server` |
+| `nx run dsp-app:serve:0845-test-server`                       | `npm run start-with-0845-server`    |
 | `nx run dsp-app:lint`                                         | `npm run lint-ci`                   |
 | `nx run dsp-app:lint --fix`                                   | `npm run lint-local`                |
 | `nx run dsp-app-e2e:e2e`                                      | `npm run e2e`                       |

diff --git a/apps/dsp-app-e2e/project.json b/apps/dsp-app-e2e/project.json
@@ -20,6 +20,9 @@
         "ls-test-server": {
           "devServerTarget": "dsp-app:serve:ls-test-server"
         },
+        "0845-test-server": {
+          "devServerTarget": "dsp-app:serve:0845-test-server"
+        },
         "staging-server": {
           "devServerTarget": "dsp-app:serve:staging-server"
         }
@@ -41,6 +44,9 @@
         "ls-test-server": {
           "devServerTarget": "dsp-app:serve:ls-test-server"
         },
+        "0845-test-server": {
+          "devServerTarget": "dsp-app:serve:0845-test-server"
+        },
         "staging-server": {
           "devServerTarget": "dsp-app:serve:staging-server"
         }

diff --git a/apps/dsp-app/project.json b/apps/dsp-app/project.json
@@ -118,6 +118,21 @@
           "vendorChunk": false,
           "buildOptimizer": false
         },
+        "0845-test-server": {
+          "fileReplacements": [
+            {
+              "replace": "apps/dsp-app/src/environments/environment.ts",
+              "with": "apps/dsp-app/src/environments/environment.0845-test-server.ts"
+            }
+          ],
+          "optimization": false,
+          "sourceMap": true,
+          "namedChunks": true,
+          "aot": true,
+          "extractLicenses": false,
+          "vendorChunk": false,
+          "buildOptimizer": false
+        },
         "staging-server": {
           "fileReplacements": [
             {
@@ -157,6 +172,9 @@
         "ls-test-server": {
           "browserTarget": "dsp-app:build:ls-test-server"
         },
+        "0845-test-server": {
+          "browserTarget": "dsp-app:build:ls-test-server"
+        },
         "staging-server": {
           "browserTarget": "dsp-app:build:staging-server"
         }

diff --git a/apps/dsp-app/src/app/workspace/results/list-view/resource-list/resource-list.component.html b/apps/dsp-app/src/app/workspace/results/list-view/resource-list/resource-list.component.html
@@ -11,7 +11,7 @@
         "
     >
         <mat-list-item>
-            <span matListItemTitle class="res-list-item-container">
+            <div matListItemTitle class="res-list-item-container">
                 <div class="res-list-item-content"
                     (click)="
                         selectResource({
@@ -25,13 +25,13 @@
                 >
                     <mat-icon matListItemIcon>{{ getIcon(resource) }}</mat-icon>
                     <div matLine class="res-list-item-text">
-                        <p matLine class="res-class-label">
+                        <p matLine class="res-class-label shorten-long-text">
                             {{
                                 resource.entityInfo.classes[resource.type].label
                             }}
                         </p>
-                        <h3 matLine class="res-class-value">
-                            {{ resource.label }}
+                        <h3 matLine class="res-class-value shorten-long-text">
+                            label{{ resource.label }}
                         </h3>
                         <div
                             matLine
@@ -73,7 +73,7 @@ <h3 matLine class="res-class-value">
                     >
                     </mat-checkbox>
                 </div>
-            </span>
+            </div>
         </mat-list-item>
     </div>
 </mat-list>
diff --git a/apps/dsp-app/src/app/workspace/results/list-view/resource-list/resource-list.component.scss b/apps/dsp-app/src/app/workspace/results/list-view/resource-list/resource-list.component.scss
@@ -26,9 +26,11 @@
   display: flex;
   flex-grow: 1; /* grow to fill remaining space */
   cursor: pointer;
+  overflow: hidden;
 }
 
 .res-list-item-text{
+  width: 85%;
   padding-left: 16px;
   padding-top: 8px;
   padding-bottom: 8px;
@@ -49,6 +51,7 @@
 }
 
 .res-class-value {
+  width: 85%;
   font-weight: bold !important;
   font-size: 16px !important;
   line-height: 1.5;
@@ -57,3 +60,7 @@
 .res-prop-label {
   font-style: italic;
 }
+
+.res-checkbox {
+  min-width: 3em;
+}
diff --git a/apps/dsp-app/src/config/config.0845-test-server.json b/apps/dsp-app/src/config/config.0845-test-server.json
@@ -0,0 +1,31 @@
+{
+  "dspRelease": "2023.05.03",
+  "apiProtocol": "https",
+  "apiHost": "api.0845-test-server.dasch.swiss",
+  "apiPort": 443,
+  "apiPath": "",
+  "iiifProtocol": "https",
+  "iiifHost": "iiif.0845-test-server.dasch.swiss",
+  "iiifPort": 443,
+  "iiifPath": "",
+  "geonameToken": "knora",
+  "jsonWebToken": "",
+  "logErrors": true,
+  "zioPrefix": ":5555",
+  "zioEndpoints": [],
+  "iriBase": "http://rdfh.ch",
+  "instrumentation": {
+    "environment": "0845-test-server",
+    "dataDog": {
+      "enabled": false,
+      "applicationId": "",
+      "clientToken": "",
+      "site": "",
+      "service": ""
+    },
+    "rollbar": {
+      "enabled": false,
+      "accessToken": ""
+    }
+  }
+}
diff --git a/apps/dsp-app/src/environments/environment.0845-test-server.ts b/apps/dsp-app/src/environments/environment.0845-test-server.ts
@@ -0,0 +1,22 @@
+/*
+ * This file can be replaced during build by using the `fileReplacements` array.
+ * `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
+ * The list of file replacements can be found in `angular.json`.
+ */
+
+import packageJson from '../../../../package.json';
+
+export const environment = {
+    name: '0845-test-server',
+    production: false,
+    version: packageJson.version,
+};
+
+/*
+ * For easier debugging in development mode, you can import the following file
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
+ *
+ * This import should be commented out in production mode because it will have a negative impact
+ * on performance if an error is thrown.
+ */
+// import 'zone.js/dist/zone-error';  // Included with Angular CLI.
diff --git a/package.json b/package.json
@@ -11,6 +11,7 @@
     "start-dev": "nx run dsp-app:serve:development --host 0.0.0.0",
     "start-with-test-server": "nx run dsp-app:serve:test-server",
     "start-with-ls-test-server": "nx run dsp-app:serve:ls-test-server",
+    "start-with-0845-test-server": "nx run dsp-app:serve:0845-test-server",
     "start-with-staging-server": "nx run dsp-app:serve:staging-server",
     "e2e": "nx run dsp-app-e2e:e2e",
     "e2e-ci": "nx run dsp-app-e2e:e2e-ci --webdriver-update=false",