GUADEC 2017 site menu dropdown list potential fix

Jason Martinez <[email protected]> Wed, 19 Apr 2017 18:09:53 -0400
Newsgroups gmane.comp.gnome.web
Message-ID <CANGBn4=ZJCQxSNiqqmyOQyhV_HdfXg=A8xx-OQydDQv1Q-DuXw@mail.gmail.com>
--===============1757856612339217475==
Content-Type: multipart/alternative; boundary=001a11c175b6b0d874054d8c48ab

--001a11c175b6b0d874054d8c48ab
Content-Type: text/plain; charset=UTF-8

The 2017 GUADEC site's drop down menu for event details prevents users at
least on my chrome version from using the menu because the dropdown appears
too low. Here's a code fix for the web person there, from another web
person who loves using GNOME every damn day.

In the style.css file change the code block

// Existing live version
.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    border: 1px solid #dadada;
    background: #fff;
    color: #8c9398;
    float: right;
    position: absolute;
    top: 3.3em;
    right: -999em;
    z-index: 99999;
}


// --- TO THIS ---


// Updated version, the only thing updated is top:``
.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    border: 1px solid #dadada;
    background: #fff;
    color: #8c9398;
    float: right;
    position: absolute;
    top: 30px;
    right: -999em;
    z-index: 99999;
}


Setting top to 30px there will fix the problem as it stands,

Jay

--001a11c175b6b0d874054d8c48ab
Content-Type: text/html; charset=UTF-8
Content-Transfer-Encoding: quoted-printable

<div dir=3D"ltr"><div>The 2017 GUADEC site&#39;s drop down menu for event d=
etails prevents users at least on my chrome version from using the menu bec=
ause the dropdown appears too low. Here&#39;s a code fix for the web person=
 there, from another web person who loves using GNOME every damn day.</div>=
<div><br></div><div>In the style.css file change the code block</div><div><=
br></div><div>// Existing live version</div><div>.main-navigation ul ul {</=
div><div>=C2=A0 =C2=A0 box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);</div><div>=
=C2=A0 =C2=A0 border-radius: 4px;</div><div>=C2=A0 =C2=A0 border: 1px solid=
 #dadada;</div><div>=C2=A0 =C2=A0 background: #fff;</div><div>=C2=A0 =C2=A0=
 color: #8c9398;</div><div>=C2=A0 =C2=A0 float: right;</div><div>=C2=A0 =C2=
=A0 position: absolute;</div><div>=C2=A0 =C2=A0 top: 3.3em;</div><div>=C2=
=A0 =C2=A0 right: -999em;</div><div>=C2=A0 =C2=A0 z-index: 99999;</div><div=
>}</div><div><br></div><div><br></div><div>// --- TO THIS ---</div><div><br=
></div><div><br></div><div>// Updated version, the only thing updated is to=
p:``</div><div>.main-navigation ul ul {</div><div>=C2=A0 =C2=A0 box-shadow:=
 0 3px 3px rgba(0, 0, 0, 0.2);</div><div>=C2=A0 =C2=A0 border-radius: 4px;<=
/div><div>=C2=A0 =C2=A0 border: 1px solid #dadada;</div><div>=C2=A0 =C2=A0 =
background: #fff;</div><div>=C2=A0 =C2=A0 color: #8c9398;</div><div>=C2=A0 =
=C2=A0 float: right;</div><div>=C2=A0 =C2=A0 position: absolute;</div><div>=
=C2=A0 =C2=A0 top: 30px;</div><div>=C2=A0 =C2=A0 right: -999em;</div><div>=
=C2=A0 =C2=A0 z-index: 99999;</div><div>}</div><div><br></div><div><br></di=
v><div>Setting top to 30px there will fix the problem as it stands,</div><d=
iv><br></div><div>Jay</div></div>

--001a11c175b6b0d874054d8c48ab--

--===============1757856612339217475==
Content-Type: text/plain; charset="us-ascii"
MIME-Version: 1.0
Content-Transfer-Encoding: 7bit
Content-Disposition: inline

_______________________________________________
gnome-web-list mailing list
[email protected]
https://mail.gnome.org/mailman/listinfo/gnome-web-list

--===============1757856612339217475==--