Changeset 19997 in main


Ignore:
Timestamp:
03/11/20 09:55:11 (3 weeks ago)
Author:
GarthBraithwaite_STG
Message:

view - temp css commit before going back to abs search position.

Location:
trunk/ibisph-view/src/main/webapp
Files:
5 edited

Legend:

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

    r19893 r19997  
    3232        See responsive_notes.txt for more info on why what was chosen.
    3333*/
    34 @import url("_responsive-tiny.css")   only screen and                        (max-width:  959px);
     34@import url("_responsive-tiny.css")   only screen and                        (max-width: 1120px);
    3535@import url("_responsive-small.css")  only screen and (min-width: 640px) and (max-width:  959px);
    36 @import url("_responsive-medium.css") only screen and (min-width: 960px);
     36@import url("_responsive-medium.css") only screen and (min-width: 1120px) and (max-width:  1279px);
    3737@import url("_responsive-large.css")  only screen and (min-width: 1280px);
    3838@import url("_responsive-huge.css")   only screen and (min-width: 1700px);
    39 
    40 #siteNavigationMenu .MegaMenu .Body .Block .Description
    41 {
    42         display:                        none;
    43 }
    44 #siteNavigationMenu .MegaMenu .Body .Block ul li ul li > a
    45 {
    46         padding:                        13px 8px 10px 5px;
    47 }
    48 #siteNavigationMenu .MegaMenu .Body .Block .Icon li > a::before,
    49 #siteNavigationMenu .MegaMenu .Body .Block li.Icon > a::before
    50 {
    51     top:                                12px;
    52 }
    5339
    5440/* Simple rules to help debug responsive layout sizes
  • trunk/ibisph-view/src/main/webapp/css/_layout-header.css

    r19983 r19997  
    121121{
    122122        position:                       relative;  /* enable relative sub container abs position and full width */
    123         clear:                          right;
    124123        line-height:            normal;
    125 }
    126 #siteNavigation > a
    127 {
    128         padding: 0;
    129124}
    130125
     
    139134#siteNavigationMenu
    140135{
    141         padding-left:           235px;
     136        padding:                0 0 0 235px;
    142137}
    143138
     
    146141#siteNavigationMenu > li:last-child
    147142{
    148         position:                       absolute;
    149         top:                            -7px;
    150         right:                          0px;
    151         margin-right:           0;
     143        margin:                         -7px 0;
     144        float: right;
    152145}
    153146#siteNavigationMenu > li:last-child:hover
     
    155148        background-color: transparent;
    156149}
     150
     151
     152
     153
     154
     155
     156
     157#siteNavigationMenu .MegaMenu .Body .Block .Description
     158{
     159        display:                        none;
     160}
     161#siteNavigationMenu .MegaMenu .Body .Block ul li ul li > a
     162{
     163        padding:                        15px 8px 12px 5px;
     164}
     165#siteNavigationMenu .MegaMenu .Body .Block .Icon li > a::before,
     166#siteNavigationMenu .MegaMenu .Body .Block li.Icon > a::before
     167{
     168    top:                                14px;
     169}
     170
     171
     172
    157173
    158174
     
    196212form.Search input[type="text"]
    197213{
    198         width:                          140px;
    199214        height:                         45px;
    200215        font-size:                      16px;
  • trunk/ibisph-view/src/main/webapp/css/_responsive-medium.css

    r19983 r19997  
    1010        opacity:                        0;
    1111}
     12
     13
     14
     15#siteNavigationMenu #siteSearch
     16{
     17        top: -50px;
     18        margin-top: 5px;
     19        border-radius:          5px;
     20}
     21#siteNavigationMenu form.Search:hover
     22{
     23        border-width:           inherit;
     24}
     25
     26form.Search input[type="text"],
     27form.Search input[type="text"]:focus
     28{
     29        width:                          0px;
     30}
     31
     32
     33
    1234
    1335
  • trunk/ibisph-view/src/main/webapp/css/_responsive-tiny.css

    r19983 r19997  
    66{
    77        min-width:                              640px;
     8min-height: 2000px;
    89        overflow:                               auto;
    910}
     
    2425}
    2526
    26 
    27 
    28 #xxxxxxxxxxsiteSearch
    29 {
    30         top:                                    -5px;
    31 }
    32 #xxxxxxxxxxxxxxxsiteSearch input[type="text"]
    33 {
    34         width:                                  13em;
    35         font-size:                              1.2em;
    36 }
    3727
    3828
     
    4131        top:                                    -5px;
    4232        height:                                 45px;
    43         line-height:                    35px;
    4433        padding:                                5px 5px 0 5px;
    4534        background-color:               #c2d7f8;
    4635}
    4736
    48 #siteMenuPanelsControl + label
     37
     38#siteNavigation #siteMenuPanelsControl + .FontIcon
    4939{
    5040        position:                       absolute;
     41        top:                            6px;
    5142        right:                          10px;
    52         width:                          35px;
    53         height:                         35px;
    54         font-size:                      35px;
    55         opacity:                        1;
    56         color: white;
    57 }
    58 
    59 #siteNavigation #siteMenuPanelsControl + .FontIcon
    60 {
    61         top:                                    0px;
    62         height:                                 45px;
    63         padding:                                5px 5px 0 5px;
    6443        color:                                  #225588; /*var(--color);*/
    65 }
    66 #siteNavigation #siteMenuPanelsControl:not(checked) + .FontIcon:before
     44        background-color: white;
     45        font-size: 20px;
     46        padding: 5px;
     47        border-radius: 5px;
     48}
     49#siteNavigation #siteMenuPanelsControl:not(checked) + .FontIcon::before
    6750{
    6851        content:                                "\e030";
    6952}
    70 #siteNavigation #siteMenuPanelsControl:checked + .FontIcon:before
     53#siteNavigation #siteMenuPanelsControl:checked + .FontIcon::before
    7154{
    7255        content:                                "\e11b";
     
    8669        visibility: hidden;
    8770        width: 220px;
    88         padding:                                10px 0px 2px 10px;
     71        padding:                                10px 0px 8px 10px;
    8972        font-size:                              1em;
    9073/*      max-width:                              15em;
     
    10083}
    10184
     85#siteNavigationMenu #homeMenu a { padding-right: 170px; }
    10286
    10387#siteNavigation #siteMenuPanelsControl:checked ~ .HorizontalMenu
     
    11094#siteNavigation .HorizontalMenu  > li > input + label
    11195{
     96        display: block;
    11297        padding-left: 25px;
     98        line-height:    35px;
    11399}
    114100
     
    120106        content: "\e016";
    121107}
    122 
     108#siteNavigation .HorizontalMenu > li > input[type="radio"]:checked + label::after
     109{
     110        left: auto;
     111        right: 10px;
     112        content:                                "\e11b";
     113}
    123114
    124115
    125116#siteNavigation .HorizontalMenu li > .MegaMenu
    126117{
    127         position: absolute;
    128118    width: auto;
    129     top: 0px;
     119        min-width: 420px;
     120    top: -155px;
    130121        left: auto;
    131122    right: 200px;
     123        padding-top: 0;
     124        background-color: #4477aa;
    132125        box-shadow: none;
    133126}
    134127
     128#siteNavigation .HorizontalMenu li > input:checked ~ .MegaMenu
     129{
     130visibility: hidden;
     131}
     132       
     133#siteNavigation #siteMenuPanelsControl:checked ~ .HorizontalMenu li > input:checked ~ .MegaMenu
     134{
     135visibility: visible;
     136}
     137
    135138
    136139
     
    139142        display: block;
    140143        border-radius: 0px 5px 5px 0px;
    141 }       
    142 
    143 /* fix needed for if menu open and the main site nav is closed
    144 
    145 GARTH TODO:
    146 */
    147 #siteNavigation .GridPanal #columnPanelControl:checked ~ .HorizontalMenu li input:checked ~ .ColumnsPanelList
    148 {
    149         left:                                   0px;
    150 }
    151 #siteNavigation .ColumnsPanel #columnPanelControl:not(checked) ~ .HorizontalMenu li input:checked ~ .ColumnsPanelList
    152 {
    153         left:                                   -2000px;
    154 }
    155 
    156 #siteNavigation .HorizontalMenu.HorizontalMenu .ColumnsPanelList,
    157 #siteNavigation #userMenu
    158 {
    159         float:                                  none;
    160         background-position:    3px 3px;
    161         right:                                  auto;
    162 }
     144}
     145#siteNavigation .HorizontalMenu > li:hover,
     146#siteNavigation .HorizontalMenu > li:active,
     147#siteNavigation .HorizontalMenu > li:focus,
     148#siteNavigation .HorizontalMenu > li.On:hover
     149{
     150        overflow: visible;
     151}
     152
     153#siteNavigation .HorizontalMenu li > .MegaMenu .Body 
     154{
     155        display: block;
     156}
     157#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block
     158{
     159        display: block;
     160        padding-top: 0;
     161        padding-bottom: 0;
     162min-width: 300px;
     163margin: 0 auto;
     164}
     165#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block li
     166{
     167        padding: 0;
     168}
     169#siteNavigation .HorizontalMenu li > .MegaMenu .Body .Block h5
     170{
     171        display: block;
     172        margin-top: 20px;
     173}
     174
     175
     176#siteNavigationMenu .MegaMenu .Body .Block ul li ul li > a
     177{
     178padding: 17px 8px 14px 5px;
     179}
     180
     181#siteNavigationMenu .MegaMenu .Body .Block .Icon li > a::before,
     182#siteNavigationMenu .MegaMenu .Body .Block li.Icon > a::before
     183{
     184top: 16px;
     185}
     186
     187
     188
     189
     190
     191#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks
     192{
     193        display: inline-block;
     194}
     195#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks li
     196{
     197    vertical-align: top;
     198}
     199#siteNavigation .HorizontalMenu .MegaMenu .Body .Block .TextIconBlocks a
     200{
     201        line-height: 1em;
     202        height: 100px;
     203}
     204
     205
     206
     207#siteNavigationMenu > li:last-child
     208{
     209        float: none;
     210}
     211#siteNavigationMenu #siteSearch
     212{
     213        margin-top: 5px;
     214        border-radius:          5px;
     215}
     216#siteNavigationMenu #siteSearch:hover
     217{
     218        border-width:           inherit;
     219}
     220
     221#siteNavigationMenu #siteSearch input[type="text"],
     222#siteNavigationMenu #siteSearch input[type="text"]:focus
     223{
     224width: 155px;
     225max-width: 155px;
     226}
     227
     228
     229
     230
     231
     232
     233
     234
     235
     236
     237
    163238#siteNavigation #userMenu
    164239{
     
    175250}
    176251
    177 #siteNavigation .ColumnsPanel > label
    178 {
    179         display:                                inline-block;
    180         height:                                 35px;
    181         padding:                                5px 5px 0 35px;
    182         background:                     #225588 url("../image/icon/24/grid_3x3-white.png") 5px 6px no-repeat;
    183         color:                                  #eee;
    184 
    185         border:                                 solid 1px #aaa;
    186         border-radius:                  4px;
    187         box-shadow:                             inset 1px 1px 2px #bbb;
    188 }
    189 #siteNavigation .ColumnsPanel > label:hover
    190 {
    191         background-color:               #003366;
    192         color:                                  var(--color-hover);
    193 }
    194 
    195 #siteNavigation .ColumnsPanel > input:not(checked) ~ ul.HorizontalMenu.HorizontalMenu
    196 {
    197         position:                               absolute;
    198         top:                                    0px;
    199         left:                                   -100%;
    200         z-index:                                -1;
    201         transition:                             top 0.2s linear;
    202 }
    203 #siteNavigation .ColumnsPanel > input:checked ~ ul.HorizontalMenu.HorizontalMenu
    204 {
    205         top:                                    38px;
    206         left:                                   0;
    207         background-color:               #114477;
    208         z-index:                                100;
    209 }
    210 
    211 #siteNavigation .ColumnsPanelList *
    212 {
    213         line-height:                    normal;
    214 }
    215 ul.HorizontalMenu.HorizontalMenu > li > input:checked ~ .ColumnsPanelList
    216 {
    217     opacity: 1;
    218 }
    219252
    220253
  • trunk/ibisph-view/src/main/webapp/xslt/html/MenuSelectionsList.xslt

    r19890 r19997  
    4444
    4545
    46         <xsl:param name="MenuSelectionsList.panelsMenuControlTitle" select="'Site Menu'"/>
     46        <xsl:param name="MenuSelectionsList.panelsMenuControlTitle"/>
    4747
    4848
     
    152152                        <xsl:with-param name="inputType" select="'checkbox'"/>
    153153                        <xsl:with-param name="title"     select="$menuControlTitle"/>
     154                        <xsl:with-param name="labelClass" select="'FontIcon'"/>
    154155                </xsl:call-template>
    155156
Note: See TracChangeset for help on using the changeset viewer.