diff --git a/layouts/custom/repository.html b/layouts/custom/repository.html index f63d4d2f14bfd1a664b0917a0dabe00ad93c1874..43ea5ecdf10f6088aab0075c55c5578f42006442 100644 --- a/layouts/custom/repository.html +++ b/layouts/custom/repository.html @@ -57,6 +57,30 @@ .no_checkbox>i.jstree-checkbox { display: none } + + .table { + margin: 0 auto; + padding: 0 2em; + max-width: 1650px; + height: 730px; + margin-bottom: 50px; + } + + .no-table{ + display: none; + } + + @media only screen and (max-width: 650px) { + .table{ + display: none; + } + .no-table{ + margin: 0 auto; + padding: 0 2em; + margin-bottom: 50px; + display: inherit; + } + } </style> <div class="content"> @@ -127,18 +151,23 @@ </div> </div> <hr> - <div class="container" align=center style="max-width: none;"> - <table id="samplesTable" border="1"> - <tr> - <th class="he">H&E Thumbnail (Pr)</th> - <th class="he">H&E Thumbnail (Bl)</th> - <th class="he">H&E Thumbnail (LUT)</th> - <th>Disease</th> - <th>ID</th> - <th>Age</th> - <th>Ethnicity</th> - </tr> - </table> + <div class=table> + <div class="container" align=center style="max-width: none;"> + <table id="samplesTable" border="1"> + <tr> + <th class="he">H&E Thumbnail (Pr)</th> + <th class="he">H&E Thumbnail (Bl)</th> + <th class="he">H&E Thumbnail (LUT)</th> + <th>Disease</th> + <th>ID</th> + <th>Age</th> + <th>Ethnicity</th> + </tr> + </table> + </div> + </div> + <div class=no-table> + <h2>Screen width too narrow to display biorepository table</h1> </div> </div>