[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