Merge pull request #34 from rpbouman/dev

Allow Huey to run on github pages

README.md

@@ -2,6 +2,9 @@
 Huey is a browser-based application that lets you inspect and analyze tabular datasets.
 Huey supports reading from multiple file formats, like .csv, .parquet, .json data files as well as .duckdb database files.
 
+![image](https://github.com/rpbouman/huey/assets/647315/b2e45002-409c-4a98-8d38-f5a6bfc6b7e9)
+
+
 ## Key features
 - Zero install. Download or checkout the source tree, and open src/index.html in your browser! No server required.
 - Supports reading .parquet, .csv, .json and .duckdb database files. (Support for reading MS Excel .xlsx files and .sqlite is planned)

src/DataSet/DatasetComponent.js → src/DataSet/DataSetComponent.js

@@ -28,6 +28,5 @@ class DataSetComponent {
   async cancelPendingQuery(){
     var connection = this.getManagedConnection();
     return await connection.cancelPendingQuery();
-  }
-
+  }  
 }

src/Tabs/Tabs.css

@@ -50,10 +50,10 @@
   first and last are filler elements.
 */
 
-*[role=tablist]> *:last-child {
+*[role=tablist]> *:has( > label[role=tab] + input[type=radio] + *[role=tabpanel] ):last-child {
   flex-grow: 1;
 }
-*[role=tablist] > *:first-child::before {
+*[role=tablist] > *:has( > label[role=tab] + input[type=radio] + *[role=tabpanel] ):first-child::before {
   content: ' ';
   width: 10px;
   border-bottom-style: solid;
@@ -62,9 +62,10 @@
   display: block;
   position: absolute;
   margin-left: -10px;
-  margin-top: 18px;
+  margin-top: 19px;
 }
-*[role=tablist] > *:last-child::after {
+
+*[role=tablist] > *:has( > label[role=tab] + input[type=radio] + *[role=tabpanel] ):last-child::after {
   content: ' ';
   width: 100%;
   border-bottom-style: solid;
@@ -74,8 +75,8 @@
   margin-top: 2px;
 }
 
-*[role=tablist] > *:has( > label[role=tab] + input[type=radio].tabState:checked + *[role=tabpanel] ):last-child::after {
-  margin-top: 1px;
+*[role=tablist] > *:has( > label[role=tab] + input[type=radio]:checked + *[role=tabpanel] ):last-child::after {
+  margin-top: 0px;
 }