Published by uncleonion♪

published 1757273230
updated 1757456491

View Blog View Profile Report Blog Entry

help me with my 2007 youtube invidious theme

originally i was going to make this a bulletin but then i realized the web / html category is like one of the top 3 most popular blog categories so i thought it would be a good idea to get help here

so anyways if you dont know im working on this 2007 youtube invidious css style which makes invidious look like 2007 youtube and while ive made decent progress with it, ive had a couple of road blocks and because im kind of an amateur with css i want others to help me out with theme and to work together

heres a list of things to know if youre interested in helping me:

if you want to help, either leave a comment or send a direct im to me, and we will always start communication through spacehey ims first
if more than one person agrees to helping out (which is very much possible) we can communicate on discord
you need to have the stylus extension on your browser of choice and to have decent experience with it
once the theme is done, i will post it on my userstyles.world account under the alias of "tomokokawasefan" and i will add a credits section in which i thank you for bug fixing, contributing and refinement
i have school so progress may be slow during certain days

NOTABLE BUGS

for whatever reason theres this :active error on a thumbnail or video title whenever i click it that make two vertical bars appear below and above it and i have no idea how to fix it... theres also some issues with a few buttons shifting size when i dont intend for them to

the single-handedly most consistently finicky part of this css theme project has been the motherfucking subscribe button... i keep trying to configure it to have no background when hovered but then it ends up fucking over the download button so then i try to fix that and then go back to having the same problem and even when i use nth-child or nth-of-type properties literally nothing is fixed

when i :focus on the download button it looks like its former self and i want to fix it to look like how it does before being hovered

WHAT I CURRENTLY HAVE:

WHAT IM STRIVING TO HAVE:

INV.NADEKO.NET-SPECIFIC

i want to make an individual backend button always be grayed out on screen when that specific backend is being used (though its just underlined)... i modified the :focus and :active properties yet this still isnt working somehow

WHAT I CURRENTLY HAVE:

WHAT IM STRIVING TO HAVE:

when i press the transcript button all the text formatting for the related videos turns itself into the formatting for the backend buttons and completely falls in on itself

YEWTU.BE-SPECIFIC

the error page is broken and includes the formats of the backend buttons when it shouldnt

TO-DO

NOTE: this is in no way an exhaustive list, but just some more obvious things that need to be finished

reorganize the css code, make it less messy and label everything (this comes at the very end, but i really want to do this because i want the css to be very customizable and easy to use for anyone using it, because pre-2010s youtube gave you the opportunity to customize more of your channel layout and because this theme extends to entire youtube-esque websites, i might as well prioritize that)
this css style was primarily tested and viewed from inv.nadeko.net and occasional yewtu.be, and refinements for it need to be made for other instances
after this css theme is finished i also plan to do a second theme which is just this one but for dark mode
fix up the search bar (give it a border, round it a little, and remove the search text thats inside, which has been finicky) and configure the "Search" button to give it a light gray background and slightly rounded border (which has also been finicky)

WHAT I CURRENTLY HAVE FOR THE SEARCH BAR (INV.NADEKO.NET):

WHAT I CURRENTLY HAVE FOR THE SEARCH BAR (YEWTU.BE):

WHAT IM STRIVING TO HAVE FOR THE SEARCH BAR:

make the "DONATE", "TRENDING" and "LOG IN" links at the very top of every page look more like standard underlined dark-blue links that appear on every other page, and make each link be on the same line with vertical bar spans; change the moon / sun icon into looking like linked text that says "Night Mode / Light Mode" and change the settings cogwheel icon into looking like linked text that says "Preferences"; for inv.nadeko.net specifically, we only need to handle the "LOG IN" text and icons

WHAT I CURRENTLY HAVE FOR THE TOP LINKS (YEWTU.BE):

WHAT IM STRIVING TO HAVE FOR THE TOP LINKS:

make the footer gray with borders on top and on bottom, and add borders between each section of the links, remove all the icons (yewtu.be specific) place the current version text below the footer itself, and see if its possible to include the search bar in its own section inside the footer at the top; for inv.nadeko.net specifically, put "You are currently using Backend:", "Current Version", "Privacy", and "Licenses" all below the footer

WHAT I CURRENTLY HAVE FOR THE FOOTER (YEWTU.BE):

WHAT I CURRENTLY HAVE FOR THE FOOTER (INV.NADEKO.NET):

WHAT IM STRIVING TO HAVE FOR THE FOOTER:

make .h-box:nth-child(3) constantly display (which gives a gradient effect on top the video page a la this image)

i also want to figure out if its possible for me to reformat the video pages to look more like the video page image above... such as completely relocating the video and comment section to the left side, making all the dotted underlined links be put in one horizontal box below the video, and to put the video description section to the right and on top the related videos

WHAT I CURRENTLY HAVE FOR THE VIDEO PAGE (YEWTU.BE):

WHAT I CURRENTLY HAVE FOR THE VIDEO PAGE (INV.NADEKO.NET):

for the comment section, i want everyones username to be bolded on top their comment, their usernames to have a light gray background, and for everyones avatars to be removed without it removing the video creators avatar in the description

WHAT I CURRENTLY HAVE:

WHAT IM STRIVING FOR:

i want to make the sections and links when you click the "Trending" button horizontal instead of vertical

EXAMPLE (YEWTU.BE):

EXAMPLE (INV.NADEKO.NET):

in general i want to fix the way thumbnails are displayed by redesigning and relocating the video times + viewcount, especially for thumbnails on pages like the popular / trending videos or the videos displayed on a channel page, as well as redoing other things to make it look more 2007

WHAT I HAVE CURRENTLY (INVIDIOUS, THUMBNAILS DISPLAYED AS SEEN ON "RELATED VIDEOS"):

WHAT IM STRIVING FOR:

completely finish making a 2006 - 2008 youtube player for the theme (currently observing playertubes css code because its the only non-flash version of the player i could find and trying to configure a way to make it work for the invidious player)

WHAT I CURRENTLY HAVE FOR THE PROGRESS BAR: