Changeset 20036 in main


Ignore:
Timestamp:
03/14/20 17:45:12 (2 weeks ago)
Author:
GarthBraithwaite_STG
Message:

view - finished responsive cleanup.

File:
1 edited

Legend:

Unmodified
Added
Removed
  • trunk/ibisph-view/src/main/webapp/css/_responsive-tiny.css

    r20035 r20036  
    4343        border-radius:                  5px;
    4444}
     45#siteNavigation #siteMenuPanelsControl + .FontIcon:hover
     46{
     47        background-color:               var(--background-color-hover);
     48        color:                                  var(--color-hover);
     49}
    4550#siteNavigation #siteMenuPanelsControl:not(checked) + .FontIcon::before
    4651{
     
    5661#siteNavigation .HorizontalMenu
    5762{
    58         position:                               absolute;
    59         top:                                    40px;
    60         right:                                  0;
    61         display: inline-block;
    62         visibility: hidden;
    63         width: 220px;
    64         padding:                                10px 0px 8px 10px;
    65         font-size:                              1em;
    66 /*      max-width:                              15em;
    67         box-shadow:                     8px 9px 26px -2px rgba(0,0,0,0.77);
    68 */
     63        position:                       absolute;
     64        top:                            40px;
     65        right:                          0;
     66        visibility:             hidden;
     67        width:                          220px;
     68        padding:                        10px 0px 8px 10px;
    6969}
    7070#siteNavigation .HorizontalMenu > li
    7171{
    72         position:                               relative;
    73         display:                                block;
    74         margin-right:                   0.5em;
    75         border-radius:                  0;
     72        position:                       relative;
     73        display:                        block;
     74        margin-right:           0.5em;
     75        border-radius:          0;
    7676}
    7777#siteNavigation .HorizontalMenu > li:hover,
     
    8080#siteNavigation .HorizontalMenu > li.On:hover
    8181{
    82         overflow: visible;
     82        overflow:                       visible;
     83        border-radius:          5px;
    8384}
    8485
     
    8889#siteNavigation #siteMenuPanelsControl:checked ~ .HorizontalMenu
    8990{
    90         visibility: visible;
     91        visibility:             visible;
    9192}
    9293
     
    9495#siteNavigation .HorizontalMenu  > li > input + label
    9596{
    96         display: block;
    97         padding-left: 25px;
    98         line-height:    35px;
    99 }
    100 #siteNavigation .HorizontalMenu > li > input[type="radio"]:checked + label
    101 {
    102         display: block;
    103         border-radius: 0px 5px 5px 0px;
     97        display:                        block;
     98        padding-left:           25px;
     99        line-height:            35px;
     100}
     101#siteNavigation .HorizontalMenu > li > input[type="radio"]:checked + label
     102{
     103        border-radius:          0px 5px 5px 0px;
    104104}
    105105#siteNavigation .HorizontalMenu > li > input[type="radio"] + label::after
    106106{
    107         position: absolute;
    108         left: 0;
    109         padding-left: 0;
    110         content: "\e016";
     107        position:                       absolute;
     108        left:                           0;
     109        padding-left:           0;
     110        content:                        "\e016";
    111111}
    112112#siteNavigation .HorizontalMenu > li > input[type="radio"]:checked + label::after
    113113{
    114         left: auto;
    115         right: 10px;
    116         content:                                "\e11b";
     114        left:                           auto;
     115        right:                          10px;
     116        content:                        "\e11b";
    117117}
    118118
     
    121121#siteNavigation .HorizontalMenu li > .MegaMenu
    122122{
    123     width: auto;
    124         min-width: 420px;
    125     top: -155px;
    126         left: auto;
    127     right: 200px;
    128         padding-top: 0;
    129         background-color: #4477aa;
    130         box-shadow: none;
    131 }
     123    top:                                -155px;
     124        left:                           auto;
     125    right:                              200px;
     126        min-width:                      420px;
     127        padding-top:            0;
     128        background-color:       #4477aa;
     129}
     130
    132131#siteNavigation .HorizontalMenu li > input:checked ~ .MegaMenu
    133132{
    134 visibility: hidden;
    135 }
    136        
     133        visibility:             hidden;
     134}
    137135#siteNavigation #siteMenuPanelsControl:checked ~ .HorizontalMenu li > input:checked ~ .MegaMenu
    138136{
    139 visibility: visible;
    140 }
    141 
     137        visibility:             visible;
     138}
    142139
    143140#siteNavigation .HorizontalMenu li > .MegaMenu .Body 
    144141{
    145         display: block;
     142        display:                        block;
    146143}
    147144#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block
    148145{
    149         display: block;
    150         padding-top: 0;
    151         padding-bottom: 0;
    152 min-width: 300px;
    153 margin: 0 auto;
     146        display:                        block;
     147        padding-top:            0;
     148        padding-bottom:         0;
    154149}
    155150#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block li
    156151{
    157         padding: 0;
     152        padding:                        0;              /* tightens list, but topic icons now as nice */
    158153}
    159154#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block h5
    160155{
    161         display: block;
    162         margin-top: 20px;
    163 }
    164 
     156        margin-top:             20px;
     157}
    165158
    166159#siteNavigationMenu .MegaMenu .Body .Block ul li ul li > a
    167160{
    168 padding: 17px 8px 14px 5px;
    169 }
     161        padding:                        17px 8px 14px 5px;
     162}
     163
     164
     165#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks
     166{
     167        display:                        flex;
     168        flex-wrap:                      wrap;
     169/*      justify-content:        center; */
     170}
     171#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks li
     172{
     173    vertical-align:     top;
     174        padding:                        0 8px;
     175}
     176#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks a
     177{
     178        line-height:            1em;
     179        height:                         100px;
     180}
     181
    170182
    171183#siteNavigationMenu .MegaMenu .Body .Block .Icon li > a::before,
    172184#siteNavigationMenu .MegaMenu .Body .Block li.Icon > a::before
    173185{
    174 top: 16px;
    175 }
    176 
    177 
    178 
    179 #siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks
    180 {
    181         display: inline-block;
    182 }
    183 #siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks li
    184 {
    185     vertical-align: top;
    186 }
    187 #siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks a
    188 {
    189         line-height: 1em;
    190         height: 100px;
     186        top:                            16px;
    191187}
    192188
     
    237233#content
    238234{
    239         min-width:                              640px;
    240         padding: 0.2em 0.5rem 0.5em 0.5rem;
     235        min-width:                      640px;
     236        padding:                        0.2em 0.5rem 0.5em 0.5rem;
    241237}
    242238
     
    246242.Topic #page #content #contentSections
    247243{
    248         width: calc(100% - 275px);
     244        width:                          calc(100% - 275px);
    249245}
    250246.Topic #page #content .Aside
    251247{
    252         width: 250px;
    253     max-width: 250px;
     248        width:                          250px;
     249    max-width:                  250px;
    254250}
    255251
Note: See TracChangeset for help on using the changeset viewer.