Js html css refactoring

.github/workflows/eslint-analysis.yml

@@ -0,0 +1,33 @@
+name: ESLint Check
+
+on:
+  push:
+    branches:
+      - '**'   # This will match all branches
+    paths:
+      - "force-app/**"
+
+  pull_request:
+    branches:
+      - '**'   # This will match all branches
+    paths:
+      - "force-app/**"
+
+jobs:
+  eslint:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v2
+
+    - name: Setup Node.js
+      uses: actions/setup-node@v2
+      with:
+        node-version: '20'
+
+    - name: Install dependencies
+      run: npm install --legacy-peer-deps
+
+    - name: Run ESLint
+      run: npm run lint

force-app/main/default/lwc/simpliUIListViews/simpliUIListViews.css

@@ -106,4 +106,114 @@ th {
 
 .slds-card__header {
     padding-top: 0px;
-}
+}
+
+.mainwrapper {
+    position: relative;
+}
+
+.button-short {
+    line-height: inherit;
+}
+
+.toastMessage.forceActionsText {
+    white-space: pre-line !important;
+}
+
+.dataSpinnerHolder {
+    position: relative;
+    display: inline-block;
+    margin-left: 30px;
+    vertical-align: middle;
+    white-space: nowrap;
+}
+
+.pageSpinnerHolder {
+    position: absolute;
+    min-height: 180px;
+    min-width: 180px;
+    z-index: 100;
+}
+
+.applistscrollwrapper {
+    width: 100%;
+    overflow-y: auto;
+    max-height: 60vh;
+}
+
+.virtualapplistscrollwrapper {
+    width: 100%;
+    overflow-y: auto;
+    border-top: red solid 4px;
+    max-height: 60vh;
+}
+
+.tablehorizontalscroll {
+    width: max-content;
+}
+
+.tablenohorizontalscroll {
+    width: auto;
+    min-width: 100%;
+}
+
+.relatedlistscrollwrapper {
+    width: 100%;
+    min-height: 80px;
+    max-height: 300px;
+    border-bottom: 1px solid #ddd;
+    border-left: 1px solid #ddd;
+    overflow: auto;
+}
+
+.relatedlistdisplayallwrapper {
+    width: 100%;
+    min-height: 80px;
+    border-bottom: 1px solid #ddd;
+    border-left: 1px solid #ddd;
+    overflow: auto;
+}
+
+.splitviewscrollwrapper {
+    width: 100%;
+    min-height: 80px;
+    max-height: 67vh;
+    border-bottom: 1px solid #ddd;
+    border-left: 1px solid #ddd;
+    overflow: auto;
+}
+
+.splitviewobjectlistdropdown {
+    width: 100%;
+    padding-bottom: 5px;
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+.regularobjectlistdropdown {
+    min-width: 20%;
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+.splitviewlistviewdropdown {
+    width: 70%;
+    padding-left: 5px;
+}
+
+.regularlistviewdropdown {
+    min-width: 20%;
+}
+
+thead th {
+    position: sticky;
+    top: 0;
+}
+
+th {
+    z-index: 1;
+}
+
+.slds-card__header {
+    padding-top: 0px;
+}

force-app/main/default/lwc/simpliUIListViews/simpliUIListViews.html

@@ -682,9 +682,11 @@ <h2 style="font-weight: bold; font-size: 1.3em; padding: 5px">
                                                                         <lightning-formatted-rich-text value={fieldData.value}></lightning-formatted-rich-text>
                                                                     </div>
                                                                 </template>
-                                                                <template if:true={fieldData.isMultiPicklist} class="slds-truncate">
-                                                                    <div id={rowData.rowId} title={fieldData.value} class="slds-truncate" style="text-align:center;">
-                                                                        {fieldData.value}
+                                                                <template if:true={fieldData.isMultiPicklist}>
+                                                                    <div class="slds-truncate">
+                                                                        <div id={rowData.rowId} title={fieldData.value} class="slds-truncate" style="text-align:center;">
+                                                                            {fieldData.value}
+                                                                        </div>
                                                                     </div>
                                                                 </template>
                                                             </template>