Adds a display for your own rating of a story over top of the story's actual rating. Only works for stories rated after installation.

scribble.favourites.css

:root {
	--star-background: white;
}

.dark {
	--star-background: #21282e;
}

.ownRating {
    position: absolute;
    top: 0;
    pointer-events: none;
}

:hover > .ownRating {
	opacity: 0;
}

.ownRating .fa-star {
    color: gold !important;
    background: var(--star-background);
}

.search_stars_trend, .search_stars {
	position: relative;
}

.search_stars_trend .ownRating {
    left: 15px;
}

.search_stars .ownRating {
    left: 8.5px;
}

scribble.favourites.js

let seriesIdRegex2 = /https:\/\/www.scribblehub.com\/series\/(\d+)\//;
function getSeriesId2 (seriesLink) {
    const seriesId = seriesLink.match(seriesIdRegex2) || [];
    return seriesId?.[1];
}

const ratingWrapper = document.getElementById("ratefic_user");
const originalRating = +ratingWrapper?.getAttribute("rating");

function update() {
	rateFic();
	
	const seriesElements = document.querySelectorAll("a[href^='https://www.scribblehub.com/series/'], a[href^='/series/']");
	for (const seriesElement of seriesElements) {
		const ratingWrapper = seriesElement.parentElement.querySelector(".search_stars_trend")
			?? seriesElement.closest(".rl_i_box")?.querySelector(".rpl_stars")
			?? seriesElement.closest(".search_main_box")?.querySelector(".search_stars");
			
		updateHearts(getSeriesId2(seriesElement.href), ratingWrapper);
	}
	
	document.documentElement.classList.toggle("dark", document.getElementById("mesh-nightmode-css").href.includes("dark.css"));
}

setInterval(update, 50);

function rateFic() {
    const ratedWrapper = document.querySelector(".fade_rate_fic");
    if (!ratedWrapper) return;
    
    const rating = +ratedWrapper.textContent.match(/\d/)?.[0]
    if (!rating) return;

    ratingWrapper.setAttribute("rating", originalRating);

    const id = getSeriesId(location.href);
    localStorage.setItem(`rating.${id}`, rating);

    updateHearts(id, ratingWrapper);
}

function updateHearts(id, wrapper) {
	if (!id || !wrapper) return;
	
    const rating = localStorage.getItem(`rating.${id}`);
	
    let ownRating = wrapper.querySelector(`.ownRating-${id}`);
    if (ownRating) {
		if (ownRating.dataset.rating === rating) return;
    	
    } else {
        ownRating = document.createElement("div");
        ownRating.classList.add(`ownRating`);
        ownRating.classList.add(`ownRating-${id}`);
        ownRating.dataset.rating = rating;
        wrapper.appendChild(ownRating);
    }

	
    ownRating.innerHTML = "";

    for (let i = 0; i < rating; i++) {
        const star = document.createElement("i");
        star.classList.add("fa", "fa-star", "ficrate");
        star.dataset.rating = 1;
        ownRating.appendChild(star);
    }
}

updateHearts(getSeriesId2(location.href), ratingWrapper);