[SOLVED] GNOME 3: Excessive spacing issues on shell with custom font

miga · 2014-07-15 04:48:06

I'm having a weird problem that seems to only be happening with my laptop, not my desktop PC. I changed the font for the shell to use Cabin from the AUR package ttf-google-fonts-hg, and it works fine on my desktop PC. But, when I try to use the font on my laptop, weird spacing issues revolving around colons (:) happen, and I can't figure out why. This problem doesn't occur when I'm using the default (Cantarell) font. Here's an image showing what I mean.

Here's the custom shell theme that I'm using on both my desktop PC and laptop:

@import url("/usr/share/gnome-shell/theme/gnome-shell.css");

stage {
    font-family: Cabin, sans-serif;
    font-size: 11pt;
    color: white;
}

.dash-label,
.window-caption,
.switcher-list, 
.app-well-app > .overview-icon,
.show-apps > .overview-icon,
.grid-search-result .overview-icon {
    font-size: 9pt;
    font-weight: normal;
}

.check-box StBin {
    width: 24px;
    height: 22px;
    background-image: url("/usr/share/gnome-shell/theme/checkbox-off.svg");
}

.check-box:focus StBin {
    background-image: url("/usr/share/gnome-shell/theme/checkbox-off-focused.svg");
}

.check-box:checked StBin {
    background-image: url("/usr/share/gnome-shell/theme/checkbox.svg");
}

.check-box:focus:checked StBin {
    background-image: url("/usr/share/gnome-shell/theme/checkbox-focused.svg");
}

.toggle-switch-us {
    background-image: url("/usr/share/gnome-shell/theme/toggle-off-us.svg");
    background-size: contain;
}
.toggle-switch-us:checked {
    background-image: url("/usr/share/gnome-shell/theme/toggle-on-us.svg");
    background-size: contain;
}

.toggle-switch-intl {
    background-image: url("/usr/share/gnome-shell/theme/toggle-off-intl.svg");
    background-size: contain;
}
.toggle-switch-intl:checked {
    background-image: url("/usr/share/gnome-shell/theme/toggle-on-intl.svg");
    background-size: contain;
}

#appMenu {
    spinner-image: url("/usr/share/gnome-shell/theme/process-working.svg");
    spacing: 4px;
}

.panel-button:active,
.panel-button:overview,
.panel-button:focus {
    border-image: url("/usr/share/gnome-shell/theme/panel-button-border.svg") 6 10 0 2;
    background-image: url("/usr/share/gnome-shell/theme/panel-button-highlight-wide.svg");
    color: white;
    text-shadow: black 0px 2px 2px;
}

.panel-status-button:active,
.panel-status-button:checked,
.panel-status-button:focus {
    background-image: url("/usr/share/gnome-shell/theme/panel-button-highlight-narrow.svg");
}

.window-close, .notification-close {
    background-image: url("/usr/share/gnome-shell/theme/close-window.svg");
    background-size: 32px;
    height: 32px;
    width: 32px;
}

.placeholder {
    background-image: url("/usr/share/gnome-shell/theme/dash-placeholder.svg");
    background-size: contain;
    height: 24px;
}

.page-indicator .page-indicator-icon {
    width: 18px;
    height: 18px;
    background-image: url("/usr/share/gnome-shell/theme/page-indicator-inactive.svg");
}

.page-indicator:hover .page-indicator-icon {
    background-image: url("/usr/share/gnome-shell/theme/page-indicator-hover.svg");
}

.page-indicator:active .page-indicator-icon {
    background-image: url("/usr/share/gnome-shell/theme/page-indicator-active.svg");
}

.page-indicator:checked .page-indicator-icon,
.page-indicator:checked:active .page-indicator-icon {
    background-image: url("/usr/share/gnome-shell/theme/page-indicator-checked.svg");
}

.search-provider-icon-more {
    width: 16px;
    height: 16px;
    background-image: url("/usr/share/gnome-shell/theme/more-results.svg");
}

.app-well-app.running > .overview-icon {
    text-shadow: black 0px 2px 2px;
    background-image: url("/usr/share/gnome-shell/theme/running-indicator.svg");
    background-size: contain;
}

#LookingGlassDialog .notebook-tab:selected {
    border-image: url("/usr/share/gnome-shell/theme/panel-button-border.svg") 10 10 0 2;
    background-image: url("/usr/share/gnome-shell/theme/panel-button-highlight-wide.svg");
    color: white;
    text-shadow: black 0px 2px 2px;
}

.calendar-change-month-back {
    width: 18px;
    height: 12px;
    background-image: url("/usr/share/gnome-shell/theme/calendar-arrow-left.svg");
    border-radius: 4px;
}

.calendar-change-month-back:rtl {
    background-image: url("/usr/share/gnome-shell/theme/calendar-arrow-right.svg");
}

.calendar-change-month-forward {
    width: 18px;
    height: 12px;
    background-image: url("/usr/share/gnome-shell/theme/calendar-arrow-right.svg");
    border-radius: 4px;
}

.calendar-change-month-forward:rtl {
    background-image: url("/usr/share/gnome-shell/theme/calendar-arrow-left.svg");
}

.calendar-today {
    background-image: url("/usr/share/gnome-shell/theme/calendar-today.svg");
    text-shadow: black 0px 2px 2px;
    font-weight: bold;
}

.summary-source-counter {
    background-image: url("/usr/share/gnome-shell/theme/summary-counter.svg");
    background-size: 2.4em;
    font-size: 10pt;
    font-weight: bold;
    height: 2.4em;
    width: 2.4em;
    -shell-counter-overlap-x: 13px;
    -shell-counter-overlap-y: 13px;
}

.login-dialog-user-list:expanded .login-dialog-user-list-item:logged-in {
    background-image: url("/usr/share/gnome-shell/theme/logged-in-indicator.svg");
    background-size: contain;
}

Is there anything else I can post that'll be of any use?

Thanks in advance.
Miga

Last edited by miga (2014-07-15 23:00:10)

miga · 2014-07-15 23:01:30

Solved. I'm an idiot and didn't realize there was a fonts.conf in $HOME/.config/fontconfig that it was falling back to for a few characters on my laptop. It looks fine now.

Arch Linux

#1 2014-07-15 04:48:06

[SOLVED] GNOME 3: Excessive spacing issues on shell with custom font

#2 2014-07-15 23:01:30

Re: [SOLVED] GNOME 3: Excessive spacing issues on shell with custom font

Board footer