Merge pull request #54 from Azure-Samples/update-table-data

salman90 · web-flow · commit afc6d6e46a44 · 2023-05-15T12:47:54.000-07:00
Fix issue with table data display
diff --git a/1-Authentication/0-sign-in-vanillajs/App/public/index.html b/1-Authentication/0-sign-in-vanillajs/App/public/index.html
@@ -33,18 +33,16 @@ <h5 id="title-div" class="card-header text-center">
                 </h5>
                 <br />
                 <h5 id="welcome-div" class="card-header text-center d-none"></h5>
-                <div class="table-responsive">
-                    <table id="table-div" class="table table-striped table-bordered d-none" id="table">
-                        <thead id="table-head-div">
-                            <tr>
-                                <th>Claim Type</th>
-                                <th>Value</th>
-                                <th>Description</th>
-                            </tr>
-                        </thead>
-                        <tbody id="table-body-div"></tbody>
-                    </table>
-                </div>
+                 <table id="table-div" class="table table-striped table-bordered d-none" id="table">
+                    <thead id="table-head-div">
+                        <tr>
+                            <th>Claim Type</th>
+                            <th>Value</th>
+                            <th>Description</th>
+                        </tr>
+                    </thead>
+                    <tbody id="table-body-div"></tbody>
+                </table>
             </div>
         </div>
     <!-- importing bootstrap.js and supporting js libraries -->
diff --git a/1-Authentication/0-sign-in-vanillajs/App/public/styles.css b/1-Authentication/0-sign-in-vanillajs/App/public/styles.css
@@ -2,8 +2,7 @@
     padding: .5rem 1rem !important;
 }
 
-.table-responsive {
-    max-height:  38rem !important;
-    padding-left: 50px;
-    padding-right: 50px;
+td {
+    word-break: break-word;
+    max-width: 20rem;
 }
diff --git a/1-Authentication/1-sign-in-react/SPA/src/styles/App.css b/1-Authentication/1-sign-in-react/SPA/src/styles/App.css
@@ -58,12 +58,9 @@ footer {
     float: right;
 }
 
-.tableColumn {
-    word-break: break-all;
-}
-
-.table-responsive {
-    max-height: 37rem !important;
+td {
+    word-break: break-word;
+    max-width: 34rem;
 }
 
 .warningMessage {

Original file line number	Diff line number	Diff line change
`@@ -2,8 +2,7 @@`
`2`	`2`	`padding: .5rem 1rem !important;`
`3`	`3`	`}`
`4`	`4`
`5`		`-.table-responsive {`
`6`		`- max-height: 38rem !important;`
`7`		`- padding-left: 50px;`
`8`		`- padding-right: 50px;`
	`5`	`+td {`
	`6`	`+ word-break: break-word;`
	`7`	`+ max-width: 20rem;`
`9`	`8`	`}`
Original file line number	Diff line number	Diff line change
`@@ -58,12 +58,9 @@ footer {`
`58`	`58`	`float: right;`
`59`	`59`	`}`
`60`	`60`
`61`		`-.tableColumn {`
`62`		`- word-break: break-all;`
`63`		`-}`
`64`		`-`
`65`		`-.table-responsive {`
`66`		`- max-height: 37rem !important;`
	`61`	`+td {`
	`62`	`+ word-break: break-word;`
	`63`	`+ max-width: 34rem;`
`67`	`64`	`}`
`68`	`65`
`69`	`66`	`.warningMessage {`