Issue 4963 - Wrong size used for text logo on acceptableads.com

includes/navbar.tmpl

Index: includes/navbar.tmpl
===================================================================
--- a/includes/navbar.tmpl
+++ b/includes/navbar.tmpl
@@ -12,15 +12,12 @@
  # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  # GNU General Public License for more details.
  #
  # You should have received a copy of the GNU General Public License
  # along with acceptableads.org.  If not, see <http://www.gnu.org/licenses/>.
  #}
 
 <header id="navbar">
-  {{ "index" | linkify(id="navbar-logo") }}
-    <h1 class="sr-only">{{ title | translate("document-title", "Document title") }}</h1>
-    <img src="/img/png/logo-black.png" srcset="/img/png/logo-black.png, /img/svg/logo-black.svg 2x" aria-hidden="true">
-  </a>
+  <h1 class="site-title">{{ "index" | linkify(id="navbar-logo") }}Acceptable<span class="non-space"> </span><strong>Ads</strong></a></h1>

[saroyanm, 2017/06/01 13:09:54]

What about ?:

<h1 class="site-title">
  <span>Acceptable</span><strong>Ads</strong>
</h1>

.site-title
{
  font-size: 0px;
}
.site-title > *
{
  font-size: 17px;
}

See discussion:
https://stackoverflow.com/questions/5078239/how-to-remove-the-space-between-i...

[juliandoucette, 2017/06/07 15:42:52]

I tried that already and I didn't think it looked right. The 1px space is
necessary IMO. Please look yourself and tell me if you think otherwise.

[saroyanm, 2017/06/13 10:31:03]

I thought you were fighting the space in between, 

What about:
.site-title strong
{
  margin: 0px 1px;
}

I'm not really sure if we will need additional element to achieve the result.

[juliandoucette, 2017/06/13 11:17:09]

Fuck me... You're right :D - Thank you!

[juliandoucette, 2017/06/13 11:59:30]

I have to backpedal here...

Actually, I am fighting the space in between. "Acceptable Ads" is two words. I
know that we tested one screen reader - but that doesn't confirm that this works
as expected using others. Or that search engines will interpret this correctly.

[saroyanm, 2017/06/13 12:28:20]

Acknowledged.

What about using "word-spacing" property instead ?

[juliandoucette, 2017/06/14 12:05:33]

Done.

Good idea :)

   <a class="sr-only" href="#main">{{ 'Skip to main content' | translate('skip-to-main-content', 'Skip to main content link label (screen reader only)') }}</a>
   <a class="sr-only" href="#sidebar">{{ 'Skip to main navigation' | translate('skip-to-main-navigation', 'Skip to main navigation link label (screen reader only)') }}</a>
 </header>