ccb13e0ba375da8b3ce296ec2813b1ff519bd88e hiram Wed Sep 11 15:30:51 2024 -0700 adjustments per feedback refs #32596 diff --git src/hg/htdocs/style/assemblySearch.css src/hg/htdocs/style/assemblySearch.css index 138efaf..3c1de40 100644 --- src/hg/htdocs/style/assemblySearch.css +++ src/hg/htdocs/style/assemblySearch.css @@ -1,52 +1,33 @@ -.fixedHeightTable { - max-width: 100%; - max-height: 1024px; - overflow-y: auto; - /* overflow-x: auto; */ -} - -.stickyTable { - position: sticky; - top: 0; - z-index: 100; - background-color: white; -} - table { width: 98%; table-layout: auto; border-collapse: collapse; } th, td { border: 1px solid black; padding: 8px; text-align: left; } th { background-color: #f2f2f2; } thead th { border: 3px solid black; } -.fifthRowHighlight tr:nth-child(5n) th, -.fifthRowHighlight tr:nth-child(5n) td { - background-color: #d3d3d3; -} - .submitContainer { position: relative; display: inline-block; } /* Spinner styles */ .spinner { display: none; /* Hidden by default */ position: absolute; top: 5%; left: 30%; transform: translate(-50%, -50%); border: 8px solid transparent; /* Light grey */ border-top: 8px solid #3498db; /* Blue */ border-bottom: 8px solid #9834db; /* light grey */ @@ -78,65 +59,70 @@ border: 2px solid #000; /* Add a 2px solid black border around the container */ padding: 10px; /* Optional: Add padding inside the border */ } .radioGroup { display: flex; flex-direction: column; /* Arrange radio buttons vertically */ } .colVertical { display: flex; flex-direction: column; /* Arrange radio buttons vertically */ } .formDiv > div, .radioGroupContainer { - width: 100%; + width: 98%; box-sizing: border-box; } .searchTip { position: relative; display: inline-block; cursor: pointer; border: 1px solid #888; padding: 2px; border-radius: 4px; } .searchTiptext { visibility: hidden; width: 600px; background-color: #fff; color: #000; border: 1px solid black; text-align: left; border-radius: 5px; padding: 5px; position: absolute; z-index: 1; top: 20px; /* Position below the prompt text */ right: 0; /* right border of this pop-up aligns with right border of prompt text */ - transition: opacity 0.3s; + transition: opacity 0.5s ease, visibility 0.5s ease; } .searchTip:hover .searchTiptext { visibility: visible; + transition-delay: 1s; opacity: 1; } +.searchTip:not(hover) .searchTiptext { + transition-delay: 0s; +} + /* for the pop-up help listings, do not need the list markers */ .noBullets { list-style-type: none; padding: 0; margin: 0; } #modalWrapper.overlay::before { content: " "; width: 100%; height: 100%; position: fixed; z-index: 100; top: 0; left: 0; @@ -166,34 +152,36 @@ /* allow content in table header cells to overflow to allow tooltip * legend display outside the cell */ .dataTable thead tr th { overflow: visible; } .tooltip { position: relative; display: inline-block; overflow: visible; } .dataTable thead tr th:hover .tooltiptext { + transition-delay: 1s; visibility: visible; } .dataTable thead tr th:hover .tooltiptextright { + transition-delay: 1s; visibility: visible; } .tooltip .tooltiptext { border: 2px solid #000; visibility: hidden; overflow: visible; position: absolute; padding: 2px; z-index: 5; float: left; margin: 0 auto; height: auto; width: 300px; color: black;