[wp-meta] [Making WordPress.org] #3869: Remove pointer cursor in language box
Making WordPress.org
noreply at wordpress.org
Sun Oct 14 15:18:50 UTC 2018
#3869: Remove pointer cursor in language box
-------------------------------------------------+-------------------------
Reporter: vaishalipanchal | Owner: (none)
Type: enhancement | Status: new
Priority: normal | Milestone:
Component: General | Resolution:
Keywords: has-patch ui-feedback has- |
screenshots 2nd-opinion |
-------------------------------------------------+-------------------------
Comment (by tobifjellner):
There's a huge inline style block in the main page when visiting
wordpress.org. In total, the format '{{{cursor:pointer;}}} is called three
times for various media:
{{{
<style type="text/css">#home-welcome,body,html{font-size:16px}#home-
welcome *{box-sizing:border-box}#home-welcome{font-family:"Open Sans
",sans-serif;line-height:1.5;font-
weight:400;color:#32373c;padding:0;margin:0;background:#fff}#home-welcome
header{padding:18px 36px;background:#0073aa}@media (min-
width:737px){body,html{font-size:18px}#home-welcome
header{padding:1.5625rem}}#home-welcome header h1{text-
align:center;color:#FFF;line-height:1}#home-welcome h1{font-size:3.8147rem
;font-weight:300}#home-welcome h1,#home-welcome h2,#home-welcome h3,#home-
welcome h4,#home-welcome h5,#home-welcome h6{line-height:1.5;margin:2rem 0
1rem;font-family:inherit}#home-welcome header p.subheading{color:#FFF
}#home-welcome p.subheading{font-size:1.25rem;font-weight:300;text-
align:center;color:#82878C;margin:-.4rem auto 2rem}#home-welcome
p{margin:1em 0;max-width:35.52714rem;font-size:18px}@media (min-
width:67rem){#home-welcome #lang-guess{margin:1rem auto 0;max-width:50rem
}}#home-welcome #lang-guess{padding:.5rem;background:#C7E8CA;text-
align:center;font-size:.8rem;cursor:pointer}#home-welcome .intro{padding-
bottom:0}#home-welcome
.screenshots{height:400px;overflow:hidden;padding:1rem 1rem
0;position:relative;left:-30px;right:0;width:106%}@media(max-width:739px
){#home-welcome .screenshots{padding:0;left:auto;right:auto;width:100
%}}#home-welcome .screenshots .dashboard{box-shadow:0 1px 8px
rgba(0,0,0,.2);max-width:800px}#home-welcome .screenshots .dashboard-
mobile{position:absolute;bottom:-100px;right:1px;z-index:1;max-width:200px
}#home-welcome img{border-style:none;max-width:100%}#home-welcome
.showcase{max-width:100%;margin:0;border-bottom:none;padding-left:0
;padding-right:0}#home-welcome section{margin:0 auto;padding:3.05176rem
1.5625rem;max-width:50rem;border-bottom:2px solid #EEE}#home-welcome
section:last-child{border-bottom:none}#home-welcome section h2{text-
align:center;line-height:1}#home-welcome h2{font-size:2.44141rem;font-
weight:300}#home-welcome
.showcase>div{width:100%;height:300px;background:url(https://s.w.org/images/home
/collage-min.jpg?3) center top;background-size:cover;box-shadow:inset 0 0
8px rgba(0,0,0,.4)}@media (min-width:700px){#home-welcome
.showcase>div{height:600px;background-attachment:fixed}}#home-welcome
.cta-link{max-width:100%;text-align:center;margin:3.05176rem 0 0}#home-
welcome a:hover{text-decoration:underline}#home-welcome a:active,a:hover
{outline-width:0}#home-welcome a{color:#0073aa;text-decoration:none
;background-color:transparent;border:none}#home-welcome .features{border-
top:2px solid #eee}#home-welcome .features ul{list-style:none;margin:3rem
0;padding:0;display:flex;flex-wrap:wrap;align-items:center}#home-welcome
.features ul li{display:flex;align-items:center;justify-content:center
;flex-direction:column;width:50%;height:160px;text-align:center;border-
right:1px solid #eee;border-bottom:1px solid #eee}@media (max-width:739px
){#home-welcome h1{font-size:3.2rem}#home-welcome .features ul li:nth-
child(n+7){border-bottom:none}#home-welcome .features ul li:nth-child(2n
){border-right:none}}@media (min-width:740px){#home-welcome .features ul
li{width:25%;height:200px}#home-welcome .features ul li:nth-child(4n
){border-right:none}#home-welcome .features ul li:nth-child(n+5){border-
bottom:none}}#home-welcome .features ul li img{height:2.5rem;margin:.25rem
auto 1.25rem}#home-welcome .features ul li img,#home-welcome .features ul
li span{display:block;margin-bottom:1rem;color:#00A0D2;font-size:3rem
}#home-welcome .dashicons{display:block;margin:0 auto -1rem;font-
size:4rem;color:#CBCDCE;width:auto;height:auto}#home-welcome .features p
{text-align:center;margin-left:auto;margin-right:auto}#home-welcome
.community-2{background:url(https://s.w.org/images/home/community-2.jpg?3)
no-repeat;position:relative;max-width:100%;background-
size:cover;height:500px;border:none;display:flex;align-items:flex-start
;justify-content:flex-end;flex-direction:column}#home-welcome .community-2
.screen{background:rgba(0,0,0,.5);position:absolute;left:0;right:0;top:0;z-index:0;width:100%;height:100
%}#home-welcome .community-2 .subheading,#home-welcome .community-2
h2{color:#fff;position:relative;z-index:1;text-shadow:0 0 8px
rgba(0,0,0,.5);text-align:left;margin:0 0 1rem;max-width:100%}#home-
welcome section .container{max-width:50rem;margin:0 auto;z-index:0}@media
(min-width:737px){#home-welcome .cta-wrapper{font-size:.8rem;margin:4rem 0
2rem}}#home-welcome .cta-wrapper{text-align:center;font-
size:.9144rem;margin:2rem 0;display:block}#home-welcome .button,#home-
welcome .button-primary,#home-welcome .button-secondary{display:inline-
block;text-decoration:none!important;font-size:.8rem;line-
height:1;height:1.5625rem;margin:0;padding:0 .8rem;cursor:pointer;border-
width:1px;border-style:solid;-webkit-appearance:none;-webkit-border-
radius:3px;border-radius:3px;white-space:nowrap;-webkit-box-sizing:border-
box;-moz-box-sizing:border-box;box-sizing:border-box}#home-welcome button
::-moz-focus-inner,#home-welcome input[type=reset]::-moz-focus-inner
,#home-welcome input[type=button]::-moz-focus-inner,#home-welcome
input[type=submit]::-moz-focus-inner{border-width:0;border-
style:none;padding:0}#home-welcome .button-group.button-xl .button,#home-
welcome .button.button-xl{height:2.44141rem;line-height:2.3;padding:0
1.5rem;font-size:1rem}#home-welcome .button-group.button-large .button
,#home-welcome .button.button-large{height:1.95313rem;line-
height:1;padding:0 1rem}#home-welcome .button-group.button-small .button
,#home-welcome .button.button-small{height:1.25rem;line-height:1;padding:0
.5rem;font-size:.64rem}#home-welcome .button:active,#home-welcome
.button:focus{outline:0}#home-welcome .button.hidden{display:none}#home-
welcome input[type=reset],#home-welcome input[type=reset]:active,#home-
welcome input[type=reset]:focus,#home-welcome
input[type=reset]:hover{background:0 0;border:none;-webkit-box-shadow:none
;box-shadow:none;padding:0 2px 1px;width:auto}#home-welcome .button,#home-
welcome .button-secondary{color:#555;border-color:#ccc;background:#f7f7f7
;-webkit-box-shadow:0 1px 0 #ccc;box-shadow:0 1px 0 #ccc;vertical-
align:top}#home-welcome p .button{vertical-align:baseline}#home-welcome
.button-secondary:focus,#home-welcome .button-secondary:hover,#home-
welcome .button.focus,#home-welcome .button.hover,#home-welcome
.button:focus,#home-welcome .button:hover{background:#fafafa;border-
color:#999;color:#23282d}#home-welcome .button-link:focus,#home-welcome
.button-secondary:focus,#home-welcome .button.focus,#home-welcome
.button:focus{border-color:#5b9dd9;-webkit-box-shadow:0 0 3px
rgba(0,115,170,.8);box-shadow:0 0 3px rgba(0,115,170,.8)}#home-welcome
.button-secondary:active,#home-welcome .button.active,#home-welcome
.button.active:hover,#home-welcome .button:active{background:#eee;border-
color:#999;-webkit-box-shadow:inset 0 2px 5px -3px rgba(0,0,0,.5);box-
shadow:inset 0 2px 5px -3px rgba(0,0,0,.5);-webkit-
transform:translateY(1px);-ms-
transform:translateY(1px);transform:translateY(1px)}#home-welcome
.button.active:focus{border-color:#5b9dd9;-webkit-box-shadow:inset 0 2px
5px -3px rgba(0,0,0,.5),0 0 3px rgba(0,115,170,.8);box-shadow:inset 0 2px
5px -3px rgba(0,0,0,.5),0 0 3px rgba(0,115,170,.8)}#home-welcome .button-
disabled,#home-welcome .button-secondary.disabled,#home-welcome .button-
secondary:disabled,#home-welcome .button-secondary[disabled],#home-welcome
.button.disabled,#home-welcome .button:disabled,#home-welcome
.button[disabled]{color:#a0a5aa!important;border-
color:#ddd!important;background:#f7f7f7!important;-webkit-box-
shadow:none!important;box-shadow:none!important;text-shadow:0 1px 0
#fff!important;cursor:default;-webkit-transform:none!important;-ms-
transform:none!important;transform:none!important}#home-welcome .button-
link{margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;border:0
;-webkit-border-radius:0;border-radius:0;background:0
0;outline:0;cursor:pointer}#home-welcome .button-
link:focus{outline:#5b9dd9 solid 1px}#home-welcome .button-
primary{background:#0085ba;border-color:#0073aa #006799 #006799;-webkit-
box-shadow:0 1px 0 #006799;box-shadow:0 1px 0 #006799;color:#fff;text-
decoration:none;text-shadow:0 -1px 1px #006799,1px 0 1px #006799,0 1px 1px
#006799,-1px 0 1px #006799}#home-welcome .button-primary.focus,#home-
welcome .button-primary.hover,#home-welcome .button-primary:focus,#home-
welcome .button-primary:hover{background:#008ec2;border-
color:#006799;color:#fff}#home-welcome .button-primary.focus,#home-welcome
.button-primary:focus{-webkit-box-shadow:0 1px 0 #0073aa,0 0 2px 1px
#33b3db;box-shadow:0 1px 0 #0073aa,0 0 2px 1px #33b3db}#home-welcome
.button-primary.active,#home-welcome .button-primary.active:focus,#home-
welcome .button-primary.active:hover,#home-welcome .button-
primary:active{background:#0073aa;border-color:#006799;-webkit-box-
shadow:inset 0 2px 0 #006799;box-shadow:inset 0 2px 0 #006799;vertical-
align:top}#home-welcome .button-primary-disabled,#home-welcome .button-
primary.disabled,#home-welcome .button-primary:disabled,#home-welcome
.button-
primary[disabled]{color:#66c6e4!important;background:#008ec2!important
;border-color:#007cb2!important;-webkit-box-shadow:none!important;box-
shadow:none!important;text-shadow:0 -1px 0
rgba(0,0,0,.1)!important;cursor:default}#home-welcome .button-
group{position:relative;display:inline-block;white-space:nowrap;font-
size:0;vertical-align:middle}#home-welcome .button-group>.button{display
:inline-block;-webkit-border-radius:0;border-radius:0;margin-
right:-1px;z-index:10}#home-welcome .button-group>.button-
primary{z-index:100}#home-welcome .button-group>.button:hover{z-index:20
}#home-welcome .button-group>.button:first-child{-webkit-border-radius:3px
0 0 3px;border-radius:3px 0 0 3px}#home-welcome .button-group>.button
:last-child{-webkit-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0
}#home-welcome .button-group>.button:focus{position:relative;z-index:1
}#home-welcome a.button.button-large{line-height:31.25px;line-
height:1.953125rem}#lang-guess{width:inherit;max-
width:inherit;margin:0;background:inherit;border:inherit;text-
align:center;font:inherit;padding:0;-moz-border-radius:inherit;-khtml-
border-radius:inherit;-webkit-border-radius:inherit;border-
radius:inherit}</style>
}}}
Probably the idea was to stress the fact that "We've got some links here".
But the sad result is that the links that really ARE there become less
discoverable, since the cursor anyway changes to pointer when you hover
the language names. But with the whole language-guess block having the
same format, this becomes less visible.
--
Ticket URL: <https://meta.trac.wordpress.org/ticket/3869#comment:4>
Making WordPress.org <https://meta.trac.wordpress.org/>
Making WordPress.org
More information about the wp-meta
mailing list