fixing some tabs

This commit is contained in:
leif stawnyczy 2024-11-20 11:12:21 -05:00
parent d22b724bc8
commit 245b1b5262
7 changed files with 32 additions and 33 deletions

View File

@ -18,7 +18,7 @@
margin-bottom: 0; margin-bottom: 0;
width: auto; width: auto;
} }
.accordion { .card {
margin-bottom: 10px; margin-bottom: 10px;
} }
</style> </style>
@ -47,9 +47,9 @@
<!-- ** SQL Editor ** --> <!-- ** SQL Editor ** -->
<!-- ************************************************ --> <!-- ************************************************ -->
<div class="accordion"> <div class="card">
<h3 class="accordion-header">Query</h3> <h3 class="card-header">Query</h3>
<div class="accordion-body" style="padding: 0;"> <div class="card-body" style="padding: 0;">
<button type="button" id="execute-btn" class="btn btn-primary" style="margin: 5px;"> <button type="button" id="execute-btn" class="btn btn-primary" style="margin: 5px;">
<i class="fas fa-play"></i> Execute <i class="fas fa-play"></i> Execute
</button> </button>
@ -97,12 +97,12 @@
<!-- ** Query Results ** --> <!-- ** Query Results ** -->
<!-- ************************************************ --> <!-- ************************************************ -->
<div th:if="${resultRows} != null" class="accordion"> <div th:if="${resultRows} != null" class="card">
<h3 class="accordion-header">Results</h3> <h3 class="card-header">Results</h3>
<div class="accordion-header"> <div class="card-header">
Query executed in [[${executionTime}]]. Query executed in [[${executionTime}]].
</div> </div>
<div class="accordion-body" id="resultsTableCard"> <div class="card-body" id="resultsTableCard">
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-striped table-bordered table-sm resultsTable" id="resultsTable"> <table class="table table-striped table-bordered table-sm resultsTable" id="resultsTable">
<thead> <thead>

View File

@ -57,9 +57,9 @@
<!-- ** Server Actions (no resource selected) ** --> <!-- ** Server Actions (no resource selected) ** -->
<!-- ************************************************ --> <!-- ************************************************ -->
<div class="accordion" th:if="${resourceName.empty}"> <div class="card" th:if="${resourceName.empty}">
<h3 class="accordion-header">Server Actions</h3> <h3 class="card-header">Server Actions</h3>
<div class="accordion-body"> <div class="card-body">
<div class="container-fluid"> <div class="container-fluid">
<!-- Conformance --> <!-- Conformance -->
@ -109,14 +109,13 @@
<div class='col-sm-5'> <div class='col-sm-5'>
<div class="form-group"> <div class="form-group">
<div class='input-group date' id='server-history-datetime' data-bs-toggledate-format="YYYY-MM-DDTHH:mm:ss"> <div class='input-group date' id='server-history-datetime' data-bs-toggledate-format="YYYY-MM-DDTHH:mm:ss">
<div class="input-group-prepend"> <div>
<span class="input-group-text"> <span class="input-group-text">
Since Since
</span> </span>
</div> </div>
<input type='text' class="form-control" id="server-history-since"/> <input type='text' class="form-control" id="server-history-since"/>
<!-- TODO - remove --> <div class=" input-group-addon"> <!-- input-group-addon is from Bootstrap3 but the time picker needs it there -->
<div class="input-group-append input-group-addon"> <!-- input-group-addon is from Bootstrap3 but the time picker needs it there -->
<span class="input-group-text"> <span class="input-group-text">
<i class="far fa-calendar-alt"></i> <i class="far fa-calendar-alt"></i>
</span> </span>
@ -127,7 +126,7 @@
<div class='col-sm-3'> <div class='col-sm-3'>
<div class="form-group"> <div class="form-group">
<div class='input-group'> <div class='input-group'>
<div class="input-group-prepend"> <div>
<span class="input-group-text"> <span class="input-group-text">
Limit # Limit #
</span> </span>

View File

@ -26,8 +26,8 @@
<!-- ** Default Home ** --> <!-- ** Default Home ** -->
<!-- ********************************************************** --> <!-- ********************************************************** -->
<div class="accordion"> <div class="card">
<div class="accordion-header"> <div class="card-header">
This is a RESTful server tester, which can be used to send This is a RESTful server tester, which can be used to send
requests to, and receive responses from the server at the requests to, and receive responses from the server at the
following URL: following URL:
@ -39,9 +39,9 @@
<!-- ** Resource Actions ** --> <!-- ** Resource Actions ** -->
<!-- ************************************************ --> <!-- ************************************************ -->
<div class="accordion" style="margin-top: 20px;" th:if="${resourceName.empty} == false"> <div class="card" style="margin-top: 20px;" th:if="${resourceName.empty} == false">
<h3 class="accordion-header panel-title" th:text="'Resource: ' + ${resourceName}">Resource: <b>Patient</b></h3> <h3 class="card-header panel-title" th:text="'Resource: ' + ${resourceName}">Resource: <b>Patient</b></h3>
<div class="accordion-body"> <div class="card-body">
This page contains various operations for interacting with This page contains various operations for interacting with
the <th:block th:text="${resourceName}"></th:block> resource. the <th:block th:text="${resourceName}"></th:block> resource.
</div> </div>
@ -80,12 +80,12 @@
</script> </script>
<!-- Tab panes --> <!-- Tab panes -->
<div class="accordion" style="top: -2px;"><div class="accordion-body tab-content"> <div class="card" style="top: -2px;"><div class="card-body tab-content">
<!-- *************************************************** --> <!-- *************************************************** -->
<!-- Search Tab --> <!-- Search Tab -->
<!-- *************************************************** --> <!-- *************************************************** -->
<div class="tab-pane active" id="tab-search" aria-labelledby="search-tab"> <div class="tab-pane" id="tab-search" aria-labelledby="search-tab">
<!-- Search contents --> <!-- Search contents -->
<div class="container-fluid"> <div class="container-fluid">

View File

@ -24,22 +24,22 @@
<!-- *************************************************** --> <!-- *************************************************** -->
<!-- ** Response ** --> <!-- ** Response ** -->
<!-- *************************************************** --> <!-- *************************************************** -->
<div class="accordion" id="resultWell"> <div class="card" id="resultWell">
<div class="accordion-header"> <div class="card-header">
Executed request against FHIR RESTful server in Executed request against FHIR RESTful server in
<th:block th:text="${latencyMs} + 'ms'"/> <th:block th:text="${latencyMs} + 'ms'"/>
</div> </div>
</div> </div>
<div th:if="${clientCodeJson} != null" class="accordion" style="margin-top: 20px;"> <div th:if="${clientCodeJson} != null" class="card" style="margin-top: 20px;">
<div class="accordion-header"> <div class="card-header">
Client Code - Client Code -
<small style="color: #888;"> <small style="color: #888;">
Use the following code snippet to execute this action in your Use the following code snippet to execute this action in your
own client. own client.
</small> </small>
</div> </div>
<div class="accordion-body clientCodeBox" id="clientCodeBody"> <div class="card-body clientCodeBox" id="clientCodeBody">
</div> </div>
<script type="text/javascript" src="js/ClientCodeGeneratorHapi.js"></script> <script type="text/javascript" src="js/ClientCodeGeneratorHapi.js"></script>
<script type="text/javascript" th:utext="'var jsonClientCode = ' + ${clientCodeJson} + ';'"> <script type="text/javascript" th:utext="'var jsonClientCode = ' + ${clientCodeJson} + ';'">

View File

@ -1,8 +1,8 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org"> <html lang="en" xmlns:th="http://www.thymeleaf.org">
<div class="accordion" style="margin-top: 10px;" th:fragment="banner"> <div class="card" style="margin-top: 10px;" th:fragment="banner">
<h3 class="accordion-header">HFQL / SQL Execution</h3> <h3 class="card-header">HFQL / SQL Execution</h3>
<div class="accordion-body"> <div class="card-body">
This page can be used to execute queries using the HAPI FHIR Query Language (HFQL), This page can be used to execute queries using the HAPI FHIR Query Language (HFQL),
which is a SQL-like syntax for querying FHIR repositories. Learn more about which is a SQL-like syntax for querying FHIR repositories. Learn more about
HFQL architecture at <a href="https://smilecdr.com/docs/hfql/">https://smilecdr.com/docs/hfql/</a>, and HFQL architecture at <a href="https://smilecdr.com/docs/hfql/">https://smilecdr.com/docs/hfql/</a>, and

View File

@ -6,12 +6,12 @@ controls for viewing/editing/etc results
ca.uhn.hapi Bundle ca.uhn.hapi Bundle
*/--> */-->
<th:block th:fragment="controltable"> <th:block th:fragment="controltable">
<div class="panel-group" id="accordion" style="margin-bottom: 0px;"> <div class="panel-group" id="card" style="margin-bottom: 0px;">
<div class="panel panel-default" style="border: none; border-bottom: 1px solid #ddd; border-radius: 0px;"> <div class="panel panel-default" style="border: none; border-bottom: 1px solid #ddd; border-radius: 0px;">
<div class="panel-heading"> <div class="panel-heading">
<div class="panel-title"> <div class="panel-title">
<th:block th:if="${#lists.isEmpty(bundle.entries)}">Bundle contains no entries</th:block> <th:block th:if="${#lists.isEmpty(bundle.entries)}">Bundle contains no entries</th:block>
<a th:unless="${#lists.isEmpty(bundle.entries)}" data-bs-toggle="collapse" data-parent="#accordion" href="#collapseOne"> <a th:unless="${#lists.isEmpty(bundle.entries)}" data-bs-toggle="collapse" data-parent="#card" href="#collapseOne">
<i id="collapseOneIcon" class="far fa-minus-square"></i> <i id="collapseOneIcon" class="far fa-minus-square"></i>
<span th:if="${bundle.totalResults.empty}" th:text="'Bundle contains ' + ${#lists.size(bundle.entries)} + ' entries'"/> <span th:if="${bundle.totalResults.empty}" th:text="'Bundle contains ' + ${#lists.size(bundle.entries)} + ' entries'"/>
<span th:unless="${bundle.totalResults.empty}" th:text="'Bundle contains ' + ${#lists.size(bundle.entries)} + ' / ' + ${bundle.totalResults.value} + ' entries'"/> <span th:unless="${bundle.totalResults.empty}" th:text="'Bundle contains ' + ${#lists.size(bundle.entries)} + ' / ' + ${bundle.totalResults.value} + ' entries'"/>

View File

@ -6,7 +6,7 @@ controls for viewing/editing/etc results
RI Bundle RI Bundle
*/--> */-->
<th:block th:fragment="controltable"> <th:block th:fragment="controltable">
<div class="panel-group" id="accordion" style="margin-bottom: 0px;"> <div class="panel-group" id="card" style="margin-bottom: 0px;">
<div class="panel panel-default" style="border: none; border-bottom: 1px solid #ddd; border-radius: 0px;"> <div class="panel panel-default" style="border: none; border-bottom: 1px solid #ddd; border-radius: 0px;">
<div class="panel-heading"> <div class="panel-heading">
<div class="panel-title"> <div class="panel-title">