Customisation

@crazycells it is, yes - I think I’ll leave it as there is no specific PWA CSS classes I know of. Well, you could use something like the below, but this means multiple CSS files for different operating systems.

/** * Determine the mobile operating system. * This function returns one of 'iOS', 'Android', 'Windows Phone', or 'unknown'. * * @returns {String} */ function getMobileOperatingSystem() { var userAgent = navigator.userAgent || navigator.vendor || window.opera; // Windows Phone must come first because its UA also contains "Android" if (/windows phone/i.test(userAgent)) { return "Windows Phone"; } if (/android/i.test(userAgent)) { return "Android"; } if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) { return "iOS"; } return "unknown"; // return “Android” - one should either handle the unknown or fallback to a specific platform, let’s say Android }

Once you’re in that rabbit hole, it’s impossible to get out of it.

@crazycells said in CSS code customization for the link preview plugin:

does OGProxy show the pdf previews as well?

Not yet, but it could with a bit of additional code.

I have just figured it out…

it can be targeted with text-decoration-color:

I was mistakenly using color

@crazycells ah, I see. That makes sense.

@phenomlab yes, it is 🙂 thanks a lot…

@crazycells hmm. That’s odd. I haven’t made any changes from recollection but I could be wrong. I’ll need to check.

EDIT - very strange. I honestly don’t recall adding the below CSS block to alter the bottom bar, but you’re right…

.bottombar-nav { padding: 0px !important; }

I’ve removed this so it reflects stock Harmony.

Perfect 😉

@DownPW thanks. I forgot about that.

This is good 👍

@DownPW Looking at the underlying code, class start is being added on hover by jQuery in this function

document.querySelectorAll(".button-gradient, .button-transparent").forEach((button) => { const style = getComputedStyle(button); const lines = document.createElement("div"); lines.classList.add("lines"); const groupTop = document.createElement("div"); const groupBottom = document.createElement("div"); const svg = createSVG( button.offsetWidth, button.offsetHeight, parseInt(style.borderRadius, 10) ); groupTop.appendChild(svg); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupTop.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); groupBottom.appendChild(svg.cloneNode(true)); lines.appendChild(groupTop); lines.appendChild(groupBottom); button.appendChild(lines); button.addEventListener("pointerenter", () => { button.classList.add("start"); }); svg.addEventListener("animationend", () => { button.classList.remove("start"); }); }); })

The CSS for start is below

.button-gradient.start .lines svg, .button-transparent.start .lines svg { animation: stroke 0.3s linear; }

And this is the corresponding keyframe

@keyframes stroke { 30%, 55% { opacity: 1; } 100% { stroke-dashoffset: 5; opacity: 0; } }

It’s using both CSS and SVG, so might not be a simple affair to replicate without the SVG files.

@phenomlab hi Mark, no worries. I will definitely write my experience here… 🙂

Unfortunately, I could not find time to try it yet.

@cagatay the fastest way to do this would be to modify the auto generated sitemap.xml file so that it does not index users. It might be paint to do the same thing with users in terms of guest permissions.

Let me have a look.

Edit - you can do this with permissions. Go to /admin/manage/privileges then look in the left where it says guests - remove the tick from the view users permission for guests then click save

You can test this out using an incognito or non logged in session. Attempting to view users should then ask you to login.

@Panda It’s been raised multiple times, but only for the open source version, and not hosted.

@OT very odd. Shouldn’t be that complex, but glad you have it working.

@OT Yes, I know. Here’s the article. I just finished it

https://sudonix.org/topic/542/swatch-theme-changer

Please try this in test first before you deploy to live.

@DownPW it’s possible, yes, but you may inadvertently end up targeting other elements using the same class which of course isn’t desired.

Can you provide a link in DM for me to review?

@Panda you’d be surprised. If you consider that you’d need to use the API to be able to populate a WordPress widget for example (which in turn would of course be PHP), taking this route is still immensely popular.

OMG make sense

Thanks dude 🙂

@Panda Just circling back here with something of an update (which I think you’ll like). I’ve completely restructured the ranking system. There are now less ranks, with a higher point threshold to reach them.

More importantly, if you reload the site, you’ll notice that the ranks are now icons.

I also removed the “Author” badge, and made this a single icon, which (to me) looks much better.

@Panda You could use the below

.page-topic .pagination-block.ready { display: none; }