@@ -216,20 +216,6 @@ width:100%;
216216}
217217
218218
219-
220- .Wt-btn .with-label {
221- font-size : 0.9em ;
222- font-weight : bold;
223- vertical-align : middle;
224- border : 1px solid # e1e1e1 ;
225- color : # FFFFFF ;
226- background-color : # 888888 ;
227- border-radius : 5px ;
228- height : 23px ;
229- white-space : nowrap;
230- }
231-
232-
233219/* A lighter-appearing button, with no background color, and text matching border.
234220 We will also allow applying this style to WSplitButton
235221 */
@@ -645,37 +631,56 @@ ul.Wt-popupmenu > li > a > span > span:hover
645631}
646632
647633
648- .PeakInfoDisplayButtonDiv {
634+ .PeakInfoDisplayBottomDiv {
649635 padding-left : 3px ;
650636 display : flex;
651637 align-items : center;
652638}
653639
654- .PeakInfoDisplayButtonDiv > .LinkBtn .DownloadBtn .Wt-btn .with-label
655- {
656- margin-left : auto;
640+ .PeakInfoDisplayBottomDiv button , .PeakInfoDisplayBottomDiv button : hover {
641+ display : flex;
642+ align-items : center;
643+ }
644+
645+ /* Shrink the button sizes a little bit for narrower display */
646+ @media (max-width : 800px ) {
647+ .PeakInfoDisplayBottomDiv button , .PeakInfoDisplayBottomDiv button : hover {
648+ font-size : 0.8em ;
649+ font-weight : normal;
650+ }
651+
652+ .PeakInfoDisplayBottomDiv .Wt-btn .with-label img {
653+ padding-right : 3px ;
654+ }
657655}
658656
657+
659658.PeakInfoHlpBtn {
660659 margin-right : 5px ;
661660 position : absolute;
662661 left : 1px ;
663662 bottom : 0px ;
664663}
665664
666- .PeakSearchBtn {
665+ .PeakInfoDisplayButtonsDiv , . PeakInfoDisplayCsvBtns {
667666 margin-left : 25px ;
668- }
669-
670- .PeakInfoDisplayButtonDiv > button {
671- margin-right : 5px ;
667+ display : flex;
668+ flex-wrap : nowrap;
669+ flex-direction : row;
670+ align-items : center;
671+ justify-content : flex-start;
672+ column-gap : 5px
672673}
673674
674675.PeakInfoDisplay .PeakEditHint
675676{
676- color : gray;
677- margin-left : 2em ;
678- font-size : 66%
677+ color : gray;
678+ margin-left : 2em ;
679+ font-size : 66% ;
680+ white-space : nowrap;
681+ overflow : hidden;
682+ flex-grow : 1 ;
683+ flex-shrink : 1 ;
679684}
680685
681686
@@ -853,8 +858,6 @@ button, button:hover,
853858 border : 1px solid # e1e1e1 ;
854859 color : # FFFFFF ;
855860 background-color : # 888888 ;
856- -moz-border-radius : 5px ;
857- -webkit-border-radius : 5px ;
858861 border-radius : 5px ;
859862 height : 23px ;
860863}
@@ -877,6 +880,10 @@ button[disabled]
877880 filter : grayscale (100% );
878881}
879882
883+ button , button : hover {
884+ padding-top : 2px ;
885+ padding-bottom : 2px ;
886+ }
880887
881888li { padding-top : 0 ; }
882889table { margin-bottom : 0 ; }
0 commit comments