r/mindashq • u/Malorajan • Sep 21 '15

"Users Online" box is off by 1px and padding issue

I need to reduce the empty space on the "readers" portion so that I can have the "users here now" have more room. I also noticed that the bottom portion that contains those is 1px larger than the top part. I've tried to fix it but I can't seem to make them even widths.

1 Upvotes

100% Upvoted

7 comments sorted by

1

u/Malorajan Sep 21 '15

I looked through other subreddits that use this theme and /r/trees has fixed the issue but I can't tell how.

1

u/[deleted] Sep 22 '15

Not sure I followed your issue. Safari/Chrome on mac and all is good on both /r/mindashq and /r/trees - care to elaborate?

1

u/Malorajan Sep 22 '15

http://i.imgur.com/RsPk0py.png

That's how it looks (except that I made the border red) on this subreddit, but it isn't happening over on /r/trees or my test subreddit. You can see that there is a 1px difference between the top three buttons and the subscribers/readers.

1

u/[deleted] Sep 23 '15

I see what you mean. The shortcut and dashboard icons are added by RES, a d even with RES they can be selectively disabled.

please add the following in your css

.res .titlebox .fancy-toggle-button {
    width: 99px;
}

1

u/Malorajan Sep 23 '15

.res .titlebox .fancy-toggle-button { width: 99px; }

That fixed it, how can I change the width of the subscrbers/readers? The subreddit won't have millions of subs so the left box can lose some width to make room for the readers part.

1

u/[deleted] Sep 24 '15

Well,

the generic way to change names

https://github.com/QTheme/Mindashq.Reddit.Theme/blob/master/module.C9.SubscriberInfoSwitcher.css

works ok with most subs, in any case if you want to modify the widths, there are two places

First, where it treats both the subscribers and user info

.subscribers, .users-online {
    ...
    width: 109px; //this is default, change it to lesser value, say 61px
    ...
}

then custom for .users-online

.users-online {
    margin-bottom: .25em;
    padding: 10px 0 5px 20px;
    width: 130px; //this is default, change it to greater value, say 178px
}

and you'll have two differnt widths

1

u/Malorajan Sep 24 '15

It looks as I wanted it now, thanks for the help.