diff options
| author | Ciaran Gallagher <[email protected]> | 2019-12-01 02:23:37 +0000 |
|---|---|---|
| committer | Ciaran Gallagher <[email protected]> | 2019-12-01 02:23:37 +0000 |
| commit | d5ae5383ad62fc526ee92cbee7d7b93b88bf1f54 (patch) | |
| tree | 44df1746889a645b41058f80bb8b77a431a3de31 | |
| parent | 4369a8a00d0138491d58dfe686460867cb30996b (diff) | |
| download | pasta-d5ae5383ad62fc526ee92cbee7d7b93b88bf1f54.tar.gz pasta-d5ae5383ad62fc526ee92cbee7d7b93b88bf1f54.zip | |
Responsive Tables
| -rw-r--r-- | index.html | 148 |
1 files changed, 80 insertions, 68 deletions
@@ -105,17 +105,19 @@ <div class="col"> <h3>Plex Libraries</h3> <small>Choose <strong>only</strong> TV Shows. This will not work for Movies.</small> - <table id="libraryTable" class="table table-hover mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Name</th> - </tr> - </thead> - <tbody> + <div class="table-responsive"> + <table id="libraryTable" class="table table-hover mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Name</th> + </tr> + </thead> + <tbody> - </tbody> - </table> + </tbody> + </table> + </div> </div> </div> <!-- / LIBRARIES TABLE --> @@ -162,18 +164,20 @@ <div class="row mt-4"> <div class="col"> <h3>TV Series</h3> - <table id="tvShowsTable" class="table table-hover mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Title</th> - <th scope="col">Year</th> - </tr> - </thead> - <tbody> + <div class="table-responsive"> + <table id="tvShowsTable" class="table table-hover mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Title</th> + <th scope="col">Year</th> + </tr> + </thead> + <tbody> - </tbody> - </table> + </tbody> + </table> + </div> </div> </div> <!-- / SHOWS TABLE --> @@ -183,17 +187,19 @@ <div class="row mt-3"> <div class="col"> <h3>Seasons</h3> - <table id="seasonsTable" class="table table-hover mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Title</th> - </tr> - </thead> - <tbody> + <div class="table-responsive"> + <table id="seasonsTable" class="table table-hover mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Title</th> + </tr> + </thead> + <tbody> - </tbody> - </table> + </tbody> + </table> + </div> </div> </div> <!-- / SHOWS TABLE --> @@ -202,17 +208,19 @@ <div class="row mt-4"> <div class="col"> <h3>Episodes</h3> - <table id="episodesTable" class="table table-hover mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Title</th> - </tr> - </thead> - <tbody> + <div class="table-responsive"> + <table id="episodesTable" class="table table-hover mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Title</th> + </tr> + </thead> + <tbody> - </tbody> - </table> + </tbody> + </table> + </div> </div> </div> <!-- / EPISODES TABLE --> @@ -236,37 +244,41 @@ <div class="row mt-4"> <div class="col"> <h3>Audio Tracks</h3> - <table id="audioTable" class="table table-hover table-sm mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Name</th> - <th scope="col">Title</th> - <th scope="col">Language</th> - <th scope="col">Code</th> - </tr> - </thead> - <tbody> - - </tbody> - </table> + <div class="table-responsive"> + <table id="audioTable" class="table table-hover table-sm mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Name</th> + <th scope="col">Title</th> + <th scope="col">Language</th> + <th scope="col">Code</th> + </tr> + </thead> + <tbody> + + </tbody> + </table> + </div> </div> <div class="col"> <h3>Subtitle Tracks</h3> - <table id="subtitleTable" class="table table-hover table-sm mt-3"> - <thead> - <tr> - <th scope="col">UID</th> - <th scope="col">Name</th> - <th scope="col">Title</th> - <th scope="col">Language</th> - <th scope="col">Code</th> - </tr> - </thead> - <tbody> + <div class="table-responsive"> + <table id="subtitleTable" class="table table-hover table-sm mt-3"> + <thead> + <tr> + <th scope="col">UID</th> + <th scope="col">Name</th> + <th scope="col">Title</th> + <th scope="col">Language</th> + <th scope="col">Code</th> + </tr> + </thead> + <tbody> - </tbody> - </table> + </tbody> + </table> + </div> </div> </div> <!-- / STREAMS TABLES --> |