Discourse Vincent theme

theme-full

#205

Hello! I’ve got on last version of your theme this bug “if the category description height is shorter than the latest link div height”.
How to fix that? please tell me.


(Anders Thengs Kristensen) #206

It’s been a while, but I’m back with a couple more things:


The “deleted by” or “flagged by” footer isn’t rounded.There are a couple quirks arising from this:

Staff highlight doesn’t wrap all the way around a post if it’s been flagged
image

When replies to a post are expanded, the “flagged by” footer floats below with square edges

And if the post is deleted, the top row has its icons squashed into the post proper. (Different issue, but the above issue also show up in these screenshots)

image

image


The “See X new or updated topic” bar is rounded in a way that creates a small black triangle in the corner below it. I’m torn on whether this should stay rounded, or if it should be flat on the bottom.

image


The dropdown on the /groups/groupname page has an unevenly rounded highlight when hovering.

image

This dropdown (also on /group/groupname) stands out. Not only as square, but also with the colour.

image

Just compare it to the bar on the home page

image


The unread notification bubble on posts is misaligned.


Other, minor, square things that feel like they should be rounded:

Notifications in the notification/ user menu

image

Some fields in the preferences :

image

image

image

The full page search page (there are others on it, but those aren’t pictured here):

This:


Would it be possible to make it so that I can set the highlight duration to 0 to turn it off?

image


I also feel I should clarify this one, because it seems it was misunderstood (even though it was quite a while ago).

It was purely in relation to the edit. I was promising not to make a habit out of doing sneak edits like those, not to not make a habit out of posting these. You can trust me that I’ll always report it if I find a bug, even if I usually wait until I have a couple before reporting.

The main reason I haven’t posted here in a while is that there haven’t been any notable bugs. Which really is a positive thing.

Yeah. While writing these I often go back to take better screenshots even though the description I write should explain it well enough. And vice versa, the screenshots are often enough that I feel I don’t need to write an explanation to go with it. But I still choose to write them.

It’s mostly to clear my head and to make sure these are coherent. Adding a little comment to everything makes it easier to sort them into groups of similar problems. It also gives me quite a bit of time between I start writing these and I finish them. That makes it easier for me to spot mistakes I’ve made when I do the revision pass because I’ve then already forgotten the spesifics of what I was writing earlier.

(And it is also just the way I’ve gotten used to making these posts, and as they say, old habits are hard to change (or however that saying goes in English))


#208

@Johani, studying your code for Vincent is fascinating. I have question about this line in the head_tag:

<link href="https://fonts.googleapis.com/css?family=Assistant:300" rel="stylesheet">

I see that you reference just a single font style. If I’m not mistaken, this means that each time your theme uses other font styles (like bold or italic), it calculates them algorithmically instead of using a dedicated font file (which usually looks better).

based on what use in the theme, I suggest that you change this line to at least:

<link href="https://fonts.googleapis.com/css?family=Assistant:300,700" rel="stylesheet">

You should see the difference once you refresh the page. All bold text will look smoother.

even better would be:

<link href="https://fonts.googleapis.com/css?family=Assistant:300,300i,700,700i" rel="stylesheet">

unfortunately, Assistant doesn’t have italic styles.


(Joe) #209

@BlackKnob

You’re pretty much dead-on there.

The short answer is performance - Mostly because Vincent is supposed to be a template or a starting point and not an end product.

A bit more on that:

1- The starting point for the default font is on the “right” side for synthesis (thin, straight) as opposed to (bold, italicised) which makes the synthesis of the variants a bit easier.

2- The included font is the bare-minimum. Everyone will need a font. Different people will need different font variants. So, while it makes sense to ship the theme with one distinct font (variant) that matches the rest of the style of the theme, it would be difficult to justify including more than that - unless the vast majority of people use them.

3- Each font file adds overhead. The amount of overhead depends, but in general it would be 15kb and 1-2 http requests per file/variant - gzip aside. This might not seem like much, but if you compare 15kb (font file size) to the entire size of the theme 67kb (including the background! - gzip aside) - then the size of each font file becomes a lot more… prominent!

Of course, the elephant in the room here is that this is a beta theme, so between now and a full release, who knows? Things might change, a lot :sunflower:


I’d also like to take this chance to clarify something:

This theme is still 100% supported, so if you have issues, please report them. I will address them even if it takes a little bit of time


#211

@Johani

this makes sense.

OTOH, your code will be a template for other people, including those who may not know the difference between synthesized styles and designated styles.
Whatever you decide, it will promote either good typography or good performance practices.
You can probably guess that I’m biased towards the former :wink:


(John ) #213

That’s really strange is that I had Vincent theme on my metadiscourse front end. I went change theme to black…just to check it out…and now i dont have option for Vincent theme anymore. How did that happen


(Vico Vo) #214

Nice. Thank you very much


(Vincent) #215

:open_mouth:


(Joe) #218

:wink:

I pushed a tiny fix for the issue @_vincent.

I am still aware of the other issues that have been raised and will get those sorted as well.

Time constraints :sunflower:


(Vincent) #219

Thanks, that was fast. I didn’t want to put you in a rush though :slight_smile:


(Robert Strick) #220

A few bugs I’m noticing. First off is in the standard Samsung web browser on a Galaxy S8 the text doesn’t appear to go more than 4 characters before starting a new line. That makes the topic titles look really disjointed. It also doesn’t appear that the custom category images play nice with the latest post. Lots of overlap there.

It looks significantly better on the Chrome mobile app, but there’s some weirdness with the Category badge colors wrapping around the category list. So you get this mixture of colors on the top & bottom borders on top of the flourish of color you get to the left of the category title.

Let me know if you’re able to reproduce this. This should be a clean install.


(Jeff Atwood) #221

It sounds like you’ve manipulated default text size in your OS settings to make it xtra large. Can you provide screenshots?


(Robert Strick) #222

I did crank down the text to Tiny through the OS and it still appears like such.

Could be a configuration error on my end, just not sure what exactly. I’ll update the browsers just in case as well.


(Robert Strick) #223

Updated to latest versions, cleared cache, still present.


(Anders Thengs Kristensen) #224

It looks like you’re viewing the site in desktop view. Try switching to mobile view in the hamburger menu.


(Robert Strick) #225

Bingo. Looks like it was in Desktop mode. Any ideas for screenshot #1? That doesn’t seem to happen in Desktop view, but still does in Mobile view.


(Robert Strick) #226

May be missing something here, but I’m having some issues with the custom BG images with the categories. Tried a few different lines but doesn’t seem to make any difference. Ideas?


(Joe) #227

@Xyxzor,

The first screenshot you posted does not look like the Vincent theme. The categories page should look like this:

The top border on categories comes from Discourse and not the theme. You can remove it by adding

.category-list-item {
  border-top: 0;
}

to a theme component and then add that component to the theme.

I’m not sure I follow, how are you adding the category backgrounds? Can you share a link to your site so I can have a look?


(Robert Strick) #228

Here’s a link: https://community.pipeworks.com/c/terraria

You can see the repeated background on category pages.

Doesn’t seem to be an issue here: https://community.pipeworks.com/

Unless I’m missing something (new to Discourse so could be) this should be the Vincent theme with a few minor changes.

Here’s where the images are uploaded:


(Joe) #229

The categories page on mobile looks ok when I check

The background on the homepage is set by the theme and everything looks OK. the backgrounds on category pages are added by Discourse since you added them in the category settings. There was a small issue with the CSS of the theme that was causing category backgrounds to repeat.

The category background issue is now fixed. Please update the theme. Thank you for reporting.

I’m not sure how you are making the changes to the theme but your changes should live in a separate theme component and you should not be making any changes to the theme directly. If there’s an update - like there is one now - you would lose your custom work.