d65e9081744ae28115fa8e5063a5d2e8938b3776
hiram
  Wed Mar 30 12:06:58 2022 -0700
reset the pull-down selection menus to look like buttons refs #28930

diff --git src/hg/htdocs/style/gar.css src/hg/htdocs/style/gar.css
index fc6a2a0..8a89356 100644
--- src/hg/htdocs/style/gar.css
+++ src/hg/htdocs/style/gar.css
@@ -204,52 +204,51 @@
 /* padding is: top right bottom left */
 /* box-shadow: https://www.w3schools.com/cssref/css3_pr_box-shadow.asp */
   /* min-width: 160px; */
 /*  box-shadow: 0px 2px 2px 2px rgba(0,0,0,0.2); */
 /*  padding: 5px 5px 5px 5px; */
 
 /* a drop down example from
  * https://www.w3schools.com/css/tryit.asp?filename=trycss_dropdown_text
  * the background-color here is the background of the ancher text box
  *  but it doesn't come through as exactly what is specified here ?
  */
 .pullDownMenu {
   position: relative;
   display: inline-block;
   float: right;
-  color: white;
-  background-color: #1d3a6e;
+  color: black;
+  background-color: #ddd;
   border: 1px solid #000000;
+  border-radius: 10px;
   margin: 2px 20px 2px 2px;
   padding: 5px 5px 5px 5px;
   text-align: center;
-  box-shadow: 8px 8px 4px grey;
 }
 
 /* for box-shadow:
  * offset-x | offset-y | blur-radius | spread-radius | color
  */
 
 .pullDownMenuContent {
   display: none;
   position: absolute;
   z-index: 1;
   margin: 0;
   margin-bottom: 0;
   width: 100%;
   /* border: 1px solid #00f; */
-  box-shadow: 0 0 4px 4px #1d3a6e;
 }
 /* the background-color here is what is in between the menu items */
 /* but why is there space between the menu items ? */
 /* the padding here affects the spacing to the left of the menu items */
 /* but these are offset to the right from the anchor text above ? */
 /* the margin-left moves them closer to the left edge of the anchor */
 /* a color here doesn't appear to color anything */
 
 .pullDownMenuContent ul {
   /* color: #ff0000;*/
   background-color: white;
   list-style-type: none;
   background-image: none;
   margin-left: 0;
   margin-bottom: 0;
@@ -281,50 +280,46 @@
   background-color: #f00;
 }
 */
 
 /* these next two rules with the 'opacity' trick, allow the menu items
  *   to show highlight on as item as the mouse hovers over that item
  * the color here is the text color in the menu items when highlighted
  * the background-color here is the background of the text items when they
  * are highlighted
  * from: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors
 ul > li will match all <li> elements that are nested directly
 inside a <ul> element.
 
  */
 .pullDownMenuContent ul > li {
-  /* opacity: 1.0; */
-  /* color: #1a2a98; */
   color: white;
-  background-color: #457ddd;
+  background-color: #57d;
 }
 
 /* this makes the entire item row clickable, including the trailing whitespace,
  * not just the text part of the label
  */
 .pullDownMenuContent label {
   display: block;
 }
 
 /* the color of the text in the menu items when *not* highlighted #112295 */
 /* the color here is the color of the text when it is *not* highlighted */
 .pullDownMenuContent ul:hover > li:not(:hover) {
-  /* opacity: 0.7; */
-  /* color: #457ddd; */
-  color: #112295;
-  background-color: white;
+  color: black;
+  background-color: #ddd;
 }
 
 .pullDownMenu:hover .pullDownMenuContent {
   display: block;
 }
 
 .columnCheckList {
   display: inline-block;
   float: right;
   padding: 5px 50px 5px 10px;
   position: relative;
 }
 
 .columnCheckList .anchor {
   position: relative;