OSPedia banner

OSPedia

97 devlogs
138h 46m 50s

Updated Project: Added dark mode, search bar, better landing page! Also redesigned the site!
An encyclopedia of Operating Systems! Learn as much as you can (or as much as I can put)! The history of Windows and macOS, with visuals, demos, and more…

Updated Project: Added dark mode, search bar, better landing page! Also redesigned the site!
An encyclopedia of Operating Systems! Learn as much as you can (or as much as I can put)! The history of Windows and macOS, with visuals, demos, and more OSes on the way!
request: PLEASE report issues on the issue page

This project uses AI

ChatGPT was used for debugging (don’t yall want w features quicker? also not always very helpful :heavysob:)

Demo Repository

Loading README...

Keyboard1000n17

i set up the redirects! the problem yesterday was that i was trying to do that on the eleventy server and not the netlify dev server sk embarassing mistake oop
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
β€œwhat are these redirects for?” you might ask. well, you can type a short url and it will redirect you to the long url.
for example, you can type https://unstable--ospedia.netlify.app/mac/10.1 and it will redirect you to https://unstable--ospedia.netlify.app/macos/cheetah, or you can do https://unstable--ospedia.netlify.app/win/11/ and it will redirect you to https://unstable--ospedia.netlify.app/windows/windows-11/ yay agadance
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
anyways, im done with redirects. well, kinda. i got ubuntu to do yk, but ubuntu isn’t even complete.
speaking of which, PLEASE write some wiki style pages for ubuntu. you can do it in markdown, see my repo’s readme!
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”

Changelog

  • 77c8a80 Add redirects to reduce typing times (aliases?)
Attachment
Attachment
Attachment
Attachment
0
Keyboard1000n17

(barely) updated the ubuntu 6.10 article!
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
i started doing work on the redirects i wanted to do. problem is, it isn’t working rn. idk why 😭
i haven’t committed the redirects work i did cuz i’m not gonna push code that i know is not working
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”

Changelog

  • 446b6af Slightly updated Ubuntu 6.10 page

β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”

a plea

please help write articles for ubuntu cwy ik it’s for free but please i need this i have a lot to do

β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
i need to go eep eep sleep

Attachment
0
Keyboard1000n17

doing the article for ubuntu 6,10 ubuntu …. what am i even doing with my life

Changelog

  • 816ff68 Add (incomplete) Ubuntu 6.10 page
Attachment
0
Keyboard1000n17

finished the article for Ubuntu 6.06! read the (boring) page on the unstable site ubuntu
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
i’ve had a realization: i’m not gonna finish the ubuntu pages before ft ends. it’s not fun to think about, but after spending so long in those ubuntu vms, i don’t have much time left (why does it sound like i’m dying lol). and let’s be real, these pages are taking a while to make solely because i can’t just copy from wikipedia in this case because they don’t have articles for each version of ubuntu and i have to find everything myself. and ubuntu has a long history, and i still have 40 more pages to write fear im so cooked
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
also my mom is saying she’s gonna take my laptop away so i’ll have to go back to a phone hs
this is why i need docker im_fucking_sobbing aaaaaaaaaaaa
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”
i can’t stop losing my laptop SeradedStripes! it’s very sad i know
β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”β€”

Changelog

  • e57f193 Finished article for Ubuntu 6.06 page
  • ff7619c Add CONDUCT.md
  • 7c2cf11 Work on Ubuntu 6.06 page (incomplete)
  • 0b1aa63 Finish article for Ubuntu 5.10
Attachment
0
Keyboard1000n17

finished the article for ubuntu ubuntu 5.10! and…. nothing else pf

the reason this stuff is taking so long is because i can’t simply copy-paste from wikipedia since wiki;pedia doesn’t have separate articles for each version of ubuntu, so i have to write them myself heavysob isob

i wish i could do this faster, im doing all i can.

gn from gmt+3! (11 35 am for me and i gtg eep sleep eep my parents getting mad)

Changelog

  • 0b1aa63 Finish article for Ubuntu 5.10

(no furry arch! cosmic the best!)

(edit: i meant 11 35 pm)

Attachment
0
Keyboard1000n17

i finally finished the article for ubuntu ubuntu 5.04!!!
and… pretty much nothing else

Changelog

i need to lock in!

Attachment
0
Keyboard1000n17

uh oh!

my mom took away my laptop heavysob got it back tho

here are the (not so) big updates:

  • i STILL am not done with ubuntu 4.10’s vm, but at least it works inside of v86 yayayayayay i’m actually almost done with it, i only have the cursors and README left
  • as for the actual site, i added content for Ubuntu 5.04 Hoary Hedgehog, but it ain’t complete yet
  • i also added something else to the article for Warty Warthog release, but i can’t remember

and that’s about it lol (im_fucking_sobbing)

Attachment
1

Comments

SeradedStripes
SeradedStripes 12 days ago

Gotta stop losing your laptop pf

Keyboard1000n17

well good news and (unfortunately on the 90th devlog) bad news

bad news:

  • spent the entire day working on xvesa in :ubuntu: AND
  • i actually edited files for 1h18m but 1h doesn’t count cuz hackatime couldn’t figure out what project i was working on (it wasn’t in my repo, it was patching some 2007 code to compile on 2026 :arch: arch linux under the guidance of :chatgpt: gippity (ik ik but i don’t know any c)(look at second screenshot).
  • eventually i gave up and converted the source code to an ISO that i could mount in an ubuntu 4.10 install, rn im tryna install, i just had to install randrproto first (was successful)

good news

  • i successfully installed randrproto
    and nothing else :heavysob:
    except…

Changelog (same as before :pensive-wobble:)

  • 03b1815 Work on Ubuntu 4.10 article
  • c89ca18 Add background images for all Ubuntu versions, work on Ubuntu homepage
  • 8b1f9b7 Start work on Ubuntu pages
  • b3454ac Improve demos, kebab-case filenames in assets/demos
  • 9914953 Polished styles, logic and errors; removed node_modules again
  • 03d149f Change directory structures, get better images

i didn’t commit, there is nothing to commit

Attachment
Attachment
2

Comments

davidv3767
davidv3767 about 1 month ago

Hope this project goes really well!

Keyboard1000n17
Keyboard1000n17 about 1 month ago

it will go well!

Keyboard1000n17

day 3 ubuntu

of trying to get this work

yes i still am

  • x window system doesnt work
  • tried to compile xvesa
  • needed xfont
  • tried to compile xfont
  • needed utils-macros
  • tried to compile utils-macros
  • got error:
configure.ac:30: error: possibly undefined macro: AM_INIT_AUTOMAKE
      If this token and others are legitimate, please use m4_pattern_allow.
      See the Autoconf documentation.
configure.ac:31: error: possibly undefined macro: AM_MAINTAINER_MODE

Changelog

  • 03b1815 Work on Ubuntu 4.10 article
  • c89ca18 Add background images for all Ubuntu versions, work on Ubuntu homepage
  • 8b1f9b7 Start work on Ubuntu pages
  • b3454ac Improve demos, kebab-case filenames in assets/demos
  • 9914953 Polished styles, logic and errors; removed node_modules again
  • 03d149f Change directory structures, get better images
Attachment
0
Keyboard1000n17

daily devlog! i gotta go asap, so summary of today’s events:

  • failed to get ubuntu ubuntu 4.10 vm working in browser with x window system
  • worked on the homepage for ubuntu
  • got background images for every version of ubuntu (4.10 warty warthog to 25.10 questing quokka!)
  • thought about using qemu-wasm (looks a bit complicated but i’ll figure it out)

Changelog

  • c89ca18 Add background images for all Ubuntu versions, work on Ubuntu homepage
  • 8b1f9b7 Start work on Ubuntu pages
  • b3454ac Improve demos, kebab-case filenames in assets/demos
  • 9914953 Polished styles, logic and errors; removed node_modules again
  • 03d149f Change directory structures, get better images

do check out the page at https://unstable--ospedia.netlify.app/ubuntu/!

Attachment
1

Comments

Amu
Amu about 1 month ago

Yyyyyyayayayayyayay

Keyboard1000n17

im here with the daily devlog! remember i said i’ll do ubuntu pages before shipping? guess what!

Today’s events:

  • i started work on the ubuntu ubuntu pages ultrafastparrot. ofc, i only have the main page down (check it out), and i haven’t really gotten the images yet, but not to worry! i’ll get them!… eventually
  • i actually spent most of today trying to get ubuntu 4.10 warty warthog working in the browser, but the x window system just refuses to start in v86 pensive-wobble so sad

Plans:

  • get warty warthog GUI working in the browser. the GUI! it already works, but you have to use the tty terminal input, no gui! i don’t want this to happen, so i’ll hopefully figure out something. i might switch to qemu-wasm for this specifically!
  • write the docs for each ubuntu page! wikipedia does NOT have separate articles for each version of ubuntu, so i’ll have to aggregate info from online. if you know good sources, please dm me on slack slack !!!!
  • (later, maybe) more vms! maybe up until dapper drake or something
Attachment
1

Comments

Amu
Amu about 1 month ago

Great job yayayayay

Keyboard1000n17

just some ux improvements, aka polishing logic, styles and errors!

Changelog

  • 9914953 Polished styles, logic and errors; removed node_modules again
  • 03d149f Change directory structures, get better images
Attachment
0
Keyboard1000n17

fixing up styles! i also improved the theme logic ultrafastparrot.

Changelog

none, i didn’t commit yet bleh

Attachment
0
Keyboard1000n17

hi guys! ive pretty much finished everything and now i gotta fix the table stuff and get some more images, namely some dark mode images of macOS Big Sur through Tahoe, so if you have any of these operating systems, pls take a screenshot of your desktop in dark mode and send it to me on slack prayge
soon, you will see ubuntu pages! then better mobile experience. then i’ll ship yayayayayay
note to self: get the pictures for classic mac os

Changelog

  • 03d149f Change directory structures, get better images
Attachment
0
Keyboard1000n17

finished renaming files ultrafastparrot! now im onto fixing paths and dealing with nvim regex (1000-yard-stare)
i havent committed at all because everything is still buggy, i also legit spent like half an hour trying to figure out why the previous/next article nav disappeared, it was because i forgot to update the collection names in a partial sk (i renamed the collections and completely dropped the -pedia suffixes in the nav bar and in the actual code), then i spent another five mins trying to figure out why my kebab function wasnt working and it was because i used .title instead of .data.title. crazy fr.
screenshots attached btw
(yes i used chatgpt im stupid im_fucking_sobbing)

Attachment
Attachment
Attachment
0
cskartikey

Tagged your project as well cooked!

πŸ”₯ cskartikey marked your project as well cooked! As a prize for your nicely cooked project, look out for a bonus prize in the mail :)

Keyboard1000n17

still renaming and moving files im_fucking_sobbing

Attachment
0
Keyboard1000n17

106 hours/9Β² devlogs

we’re so done with windows with this one! i finished all the articles! well i finished copying from wikipedia and formatting it to my wish… we dont talk about that iykyk.
i asked chat gippity to give me a node script that gets a wikipedia page, strips citations, and converts it to github flavored markdown (gfm) and also to clean up the classes in the tables in the articles for windows versions vista to 8.1. i gave up on the tables for windows 10 and 11, i’m not dealing with those tf (see the ospedia.org file!)

as for what comes next, i already said this, it’s better pictures!
also, i finally merged unstable into master and now you can see everything that’s been on the unstable site on the main site! πŸŽ‰

Changelog

  • 711aa44 Restore CONTRIBUTING.md from dev-ananta’s fork
  • f74659e Remove node_modules
  • 93c431a Finish fixing all Windows articles
  • a998d65 Fix Windows NT 4.0, 2000, Me, XP articles

this is a huge feat!!!

Attachment
0
Keyboard1000n17

finished fixing windows nt 4.0, 2000, me and xp this is making me exhausted help
you can see the updated articles though, its been deployed slowparrot (im tired)

Changelog

  • a998d65 Fix Windows NT 4.0, 2000, Me, XP articles
Attachment
0
Keyboard1000n17

fixed windows 1.0-95 articles ultrafastparrot

Changelog

  • adb2c31 [skip netlify] Fix Windows 1.0-95 articles
Attachment
0
Keyboard1000n17

worked on the windows 98 article! i think when i used (n)vim regex to replace all occurrences of <div class="info">...</div> with +++, something happened a lot of content disappeared. am doing this with windows 95 rn too!

Changelog

  • 3f925b8 Fix Windows 98 article
  • 6af17a1 Changed styles for demo pages
  • 3204f74 Created a CONTRIBUTING.md (#3)

btw, you can’t see the updated article because i skipped the build, i don’t want to tax netlify’s servers with unnecessary builds

Attachment
0
Keyboard1000n17

hour to debug a misplaced {% endif %} statement. just great. i placed it just before the closing tag for div,info instead of just after it. oh well. hey, at least i’m almost done with the CONTRIBUTING.md!… that i didn’t track because i was using the online github editor to edit @dev_ananta’s pull request for a CONTRIBUTING.md he agreed to do im_fucking_sobbing (thanks though)

Attachment
0
Keyboard1000n17

v86 being a pain in my ass again :noooovanish:
i can’t seem to get this shit working. i’ve spent so long on this and can’t figure out why initEmulator is not working and giving me undefined help me even chatgippity isn’t helping πŸ™

Attachment
0
Keyboard1000n17

guess what, i’m still converting all the tables to JSON sk
it took me like 2-3 hours to get the table generating script to work with any number of colums/keys. i did not enjoy that and didn’t use ai for that heavysob
i still have so many pages left im_fucking_sobbing
caption for image: next up to convert

Attachment
1

Comments

Josh
Josh about 2 months ago

Look super cool! I did notice some readability issues when using the OS wallpapers as the background behind the text, perhaps add an option to remove the background or improve the text readability?

Keyboard1000n17

if you are willing to help me PLEASE DM ME ON SLACK
im in the process of converting all the tables to json and converting them to tables via a script. its been there a while and im tryna get them all done
no commits yet
i have to do a LOT of improvements 1000-yard-stare

Attachment
0
Keyboard1000n17

i simply removed that other background, this is kinda sick ngl. no commits yet since i’m still making the carousel (it’s hidden, you can see in devtools).

Attachment
0
Keyboard1000n17

help i have to manually update front matter for 40 pages AGAIN im_fucking_sobbing
i said i’ll add a carousel and then spent like 4 hours converting my articles to markdown because prettier decided that the front matter at the top of my html pages was just html and not yaml so it would collapse indentation. now im actually working on it, and guess what, i have to add carousel images to the front matter because every page has different paths to the images and some don’t even have images pf

Attachment
0
Keyboard1000n17

got it done and dusted! all pages are now in markdown and take the information in div,info from YAML front matter! i wrote some custom nunjucks filters for this in eleventy.config.js (they’re at the top of the file)
last devlog, i said that i need to remove ::: from all the markdown pages. so i did! there’s now a +++ in place of :::...::: ultrahyperfastparrot where the custom splitContent filter splits the content and returns i of the resulting array, where i is the index given.
now i can finally commit, push, and actually work on the carousel!!! well i do still have to do stuff in the front matter and add a carouselImages list for the carousel but it’s still work on the carousel.
you can now see the new code! the changes are also live at https://unstable--ospedia.netlify.app but they don’t really look any different

Commits:

Attachment
0
Keyboard1000n17

this shit took too long im_fucking_sobbing
well, i finally finished putting all the info in the YAML front matter, im so done with this bs. at least now i get to do what i originally intended to do. honestly, i couldn’t figure out how to automate it without ai so shrug-1
now, i need to remove this ::: thing that’s everywhere where there was <div id="info">...</div> and get the files out of */md/. i’m going to commit without pushing because i don’t want to push this just yet.

Attachment
0
Keyboard1000n17

converted all my files to markdown! if you look at pages on my website, you’ll notice that after the first paragraph on every page, there’s a white container with some quick information in it along with the logo. i’m moving those to the YAML front matter so that during the build process, the eleventy compiler will:

  • split the content into the first paragraph and the rest of the file
  • convert and insert the first paragraph
  • insert a div.info with the original structure
  • insert the operating system logo with the path and alternate text
  • loop over the contents of the paras list of the info key (info.paras)
  • for each string in paras, insert the string into a p element
  • convert and insert the rest of the file

it’s not really all that complicated but hey at least i’m finally doing something i’ve been thinking about for months

Attachment
0
Keyboard1000n17

i deadass spent a bunch of time trying to figure out how tf i’ll get this carousel thing working when prettier keeps messing up my YAML and thought the best thing to do was just convert all the html files with front matter to markdown. i got pandoc and was gonna use bash but i keep forgetting bash loops so i spent pretty much this whole time writing a python script that converts html to markdown and puts it in a folder md/. i’ll have to process these markdown files and i stashed the carousel i was doing earlier so no worries! here’s the python script if you want it:

import os as os

for file in os.listdir("."):
    if os.path.isfile(os.path.join(".", file)) and file != "home.html" and file.split(".")[-1] == "html":
        os.system(f"pandoc -f html -t markdown {file} -o ./md/{'.'.join(file.split('.')[0:-1])}.md")
        print(f"Converted {file} to markdown")

yeah, i’m not the best with python, so this took a bit to figure out


caption for the screenshot: eleventy fails spectacularly on encountering malformed yaml front matter because pandoc messed it up and i have to manually fix 17 files (thank god nvim has substitute with regex)

Attachment
0
Keyboard1000n17

i sure underestimated this, cuz now prettier is messing with my yaml front matter nested list heavysob. it goes from

carouselImages:
  - name: ui
    path: /WinPedia/Images/UI/Windows_1.0-UI.webp
    alt: Screenshot of Windows 1.0

to

carouselImages:
- name: ui
path: /WinPedia/Images/UI/Windows_1.0-UI.webp
alt: Screenshot of Windows 1.0

prettier be messing with it man and i don’t have any output rn! here’s my cursed code (it’s not pushed)

Attachment
0
Keyboard1000n17

hi guys! i’m back! my mom hid my laptop (sob-hole) so i couldn’t code properly but we got bombed in qatar (help-me) and now we have online classes.
now, i’m working to remove that ugly sidebar with the links to all the pages. now on that side, there’ll be the table of contents that’s already there and on the other side, i’ll add a carousel system for all the images, along with a random fun fact section!!!
the carousel might take like an hour, the fun facts 15 minutes at laziest. also, i still have to study for exams pf

don’t mind the duplicated screenshots

Attachment
Attachment
1

Comments

remymoreau12
remymoreau12 about 2 months ago

sending love from australia!

Keyboard1000n17

so i was trying to get a blur on div.contentβ€˜s bg, but for some reason ::before and ::after simply wouldn’t work well. like there would be issues like a ghostly sidebar (1st pic), or a blurred scrollbar (2nd pic), so i just undid the changes (3rd pic). in fact, i think i’ll nuke the working tree.
for the 3rd pic, you can see blur becausebackdrop-filter is directly applied to the element instead of a pseudo-element. i was trying to do this because i wanted #infoβ€˜s blur to be nicely visible, but it just doesn’t work properly if the parent has blur too

Attachment
Attachment
0
Keyboard1000n17

heyo! here you get… details elements in the sidebar! the content appearing is animated too! i’ll push this to https://unstable--ospedia.netlify.app! please do check it out and create issues on github if there are any issues πŸ™

Attachment
0
Keyboard1000n17

styling changes! it brings:

  • a fix for the div.links links not actually scrolling to the heading! it happened cuz the event listeners were added before repositioning the element on screens with width < 1440px, so the event listeners would be on a non-existent element
  • i added details tags to the aside element so that the links for the specific OS are displayed and the rest are hidden in an unopened details tag

do check out the styling changes on the unstable deploy! and give me feedback ON THE GITHUB ISSUES PAGE :cat-gun: (other than the fact that the details tags are basically styleless i’ll do that after i wake up 12:25 AM for me atm :heavysob:)

Attachment
0
Keyboard1000n17

hi guys, i’m back! you probably already know what happened.
anyways, i got started with some styling changes! here’s a changelog:

  • changed the 1366px breakpoint to 1440px
  • fixed the back to top button
  • fixed div.contents links not actually going anywhere (only for screens greater than 1440px???)
Attachment
0
Keyboard1000n17

a devlog before bed! this devlog brings some ui changes and i committed too! it deployed too! if you know me, you’ll know that there’s always something bad when i commit. so, i created an unstable branch and set up netlify branch deploys for unstable too! check out the ui changes at branch deploy and make an issue for any visual bugs!!! :yay:

Attachment
0
Keyboard1000n17

would you look at that, it was backdrop-filter: blur(5px)! for some reason it made it black asf. not sure why but ok. also, i simply don’t get it but whatever. anyways, will commit soon so you can see the style’s true glory!

Attachment
Attachment
0
Keyboard1000n17

why does css wanna pmo me so hard πŸ™
i’ve been trying for a while to get the pure black bg off div.content (the black bg section you can see in the middle). it just won’t go away even after removing div.content { background-color: rgba(0, 0, 0, 0.75); }. i know it’s not some other style on the element causing this cuz i can’t find it. anyways, i’ve been working on the styles for a bit and i know i did something other than just styling but i can’t remember TT

Attachment
0
Keyboard1000n17

hey guys! i have’t been here in a week cuz my mom took away my laptop because i was grinding too hard TT

so i found out that im not supposed to put my windows hd images directly in my repo or else i might get dmca striked so uhh i’ll have to rewrite commit history. also, for this purpose, i set up a separate site (no link for u bcuz copyright) with all the windows hd images. also, if you like this project, PLEASE star my repo PLEASE it’s kinda STARLESS 😭

image caption: localhost loading my index page and being slow because 120+% cpu usage because of compiling cling in the bg

Attachment
0
Keyboard1000n17

50th devlog!

for 50 minutes!

this devlog brings refactored scss! now all the styles are defined in one mixin and colors change according to defined variables! also, i added blur in front of the background and made the content column wider alongside scrollbars with transparent backgrounds (the problem was ::webkit-scrollbar-* bs didn’t work but scrollbar-width and scrollbar-color did)! overall, it just looks better! i do have to change some stuff but i’ll do that tomorrow since my mom isn’t liking my grind v_v

Attachment
1

Comments

alarixfr
alarixfr 3 months ago

keep going!

Keyboard1000n17

HELP SASS IS FIGHTING ME OVER VARIABLES 😭😭😭 CHATGPT FAILED ME SO HARD :heavysob:

Attachment
0
Keyboard1000n17

so many issues!
did some ux improvements, don’t feel like listing them here rn.

Attachment
0
Keyboard1000n17

no devlogmaxxing!
here’s what changed:

  • i got windows 1.01, windows 2.03, windows 3.0 and windows 3.1 working in the browser. 95 will just not work because of protected mode limitations or sum shit. i’ll have to either switch to qemu compiled for wasm (it exists lmfao) or make a custom version of windows 95 that doesn’t use protected mode calls or anything
  • i embedded system 1.0-7.0, mac os 8.0 and mac os 9 in the website too. it was surprisingly easy
  • i made an index page for the demos (WIP)
Attachment
Attachment
0
Keyboard1000n17

NOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO WINDOWS 95 WONT WORK IN THE BROWSER WITHOUT QEMU COMPILED FOR WASM NOOOOOOOOOOOOOOO

I MANAGED TO DO 1.01, 2.03, 3.0, 3.1 BUT NO 95
oh well looks like i’ll just have to do that later
i’ll get started with an index page and infinite mac embeds

Attachment
1

Comments

therandomperson__
therandomperson__ 3 months ago

if it works at pcjs it probably works here

Keyboard1000n17

i’m going to reduce my devlogs because i need to really focus on this. today, i’ve been trying to get windows 3.0 in the webpage all day and it just won’t even boot. help me


(img is cdrom image from the v86 website after my own hda image refused to boot but it literally doesn’t have enough space for install)

Attachment
0
Keyboard1000n17

added some styles for the demo pages!

of course, this is barely any modification. and the only visible change is that div.contents (aka the table of contents) is not there and the page isn’t centered vertically but that’s because i couldn’t figure out what i should do–spontaneously thinking of the design while implementing it isn’t ideal for efficiency–and also i was modifying the layout in base.njk. here’s what i added:

    <main>
      {{ content | safe }}
      <div id="screen_container">
        <div style="white-space: pre; font: 14px monospace; line-height: 14px"></div>
        <canvas style="display: none; width: 100%; height: 100%"></canvas>
      </div>
      <script src="./libv86.js"></script>
      <script>
        var emulator = new V86({
          screen_container: document.querySelector("#screen_container"),
          bios: {
            url: "./seabios.bin",
          },
          vga_bios: {
            url: "./vgabios.bin",
          },
          {{disk}}: {
          url: "{{ url }}",
        },
        wasm_path: "./v86.wasm",
          autostart: true,
        });
        document.querySelector("#screen_container").addEventListener("click", () => {
          document.querySelector("#screen_container").requestPointerLock();
        });
      </script>
    </main>
    {% else %}
<!-- other stuff... -->

remember, i use eleventy to manage all my pages. also, it may seem strange that the h1 is white in light mode, but i’ll fix that tomorrow. i have to go sleep now (11:00 PM in GMT +3:00)

tl;dr

just modified some styles and changed layout for demo pages only, took a while because i didn’t plan layout beforehand.

Attachment
0
Keyboard1000n17

so apparently the real problem was a bad structure and it automatically worked when i pasted the structure from the example page. so it went from:
<div class="screen"><canvas></canvas></div>
to:

  <div style="white-space: pre; font: 14px monospace; line-height: 14px"></div>
  <canvas style="display: none; width: 100%; height: 100%"></canvas>
</div>

welp, that wasn’t nice. looks like i’ll make a template.html and point the V86 README point to it. also, it’s running now!

Attachment
0
Keyboard1000n17

holy shit if you know how to use v86, please send me a dm on slack.

changes:

  • the theme toggle works perfectly and even persists across pages (cookie!)
  • updated the light theme to match with the dark theme in layout
  • started with embedding demos inside the browser
Attachment
0
Keyboard1000n17

so i had a really bad bug where text would come on top of other text. chatgpt didn’t help. then i thought of removing .div-level-two which applied 20px of padding-right. that took a while v_v
in other news:

  • made a dark mode logo with white text
  • fixed a bug where clicking on one of the links under Contents would take you to the top of the page.
    • this happened because in the piece of code below, i forgot to change main to main div.content:

let b = document.querySelector("main div.content").scrollHeight - document.querySelector("main div.content").clientHeight;

  • added a dark background over the background wallpaper (yay!)

that’s all for now! next up, i’m going to implement a theme switcher, and then i’ll add os demos. i’ll add more themes later because i’m putting these demos for a school exhibition.
edit: i didn’t even realize i’ve done 50 hours!

Attachment
0
Keyboard1000n17

40th devlog!

i keep doing other stuff for some reason!

here’s what changed:

  • there’s now an improvement to the contents sidebar where subheadings are indented to clearly indicate that they are second-level headings (see screenshot)
  • i made the text in aside.tree (the thing with the links to all the pages) white

not much of course, but making detailed devlogs like this feels good :yay:

Attachment
Attachment
0
Keyboard1000n17

(a devlog with effort put into it?!)

so apparently i simply don’t know how mask images work. i was going mad cuz the search icon and search text were coming as a very dark grey. after half an hour or so, i figured that putting:

&::placeholder,
&::-webkit-input-placeholder,
&::-moz-placeholder {
  color: white !important;
  opacity: 0.8 !important;
}

instead of:

&::placeholder {
  color: white !important;
  opacity: 0.8 !important;
}
&::-webkit-input-placeholder {
  color: white !important;
  opacity: 0.8 !important;
}
&::-moz-placeholder {
  color: white !important;
  opacity: 0.8 !important;
}

somehow, that was the problem. why? how? idk :(
then after another half an hour, i simply gave up and asked chatgpt. apparently, the problem was i had a gray background color on the .pagefind-ui__search-input::before pseudo-element which was making it gray. it was there only because i had copied it from pagefind-ui.css so i could adjust the styles easily in my own stylesheet. rookie mistakes am i right.

do y’all like this yappity yap yap of a devlog? should i make more devlogs like this? also pls follow ^^

Attachment
0
Keyboard1000n17

it’s like someone put an invisibility potion on the search bar!

Attachment
1

Comments

averytoad65
averytoad65 3 months ago

ohh i love how that looks!

Keyboard1000n17

wtf?

so i’ve started with what i promised–themes! atm i’m just trying to finish up this dark mode.

Attachment
Attachment
Attachment
0
Keyboard1000n17

WHY WON’T THE SCROLLBARS WORK ON ASIDE.TREE?!?!?!

Attachment
0
Keyboard1000n17

extra styling! next up: scrollbars

Attachment
0
Keyboard1000n17

OSPedia logo
added an animation to the homepage yay! also why is obs studio so hard to use 😭

0
Keyboard1000n17

OSPedia logo

i’ve added a back to top button! i also did some other stuff but can’t remember right now. next up on the fix list, the homepage!

Attachment
0
Keyboard1000n17

fixed up the search bar which i’ve been putting off and removing the singular media query partial. i’ve been putting media queries here and there to make it easier for me to find where i have to change stuff. also added another element for the contents box to insert itself before, so if the page doesn’t have #info or .info, it will insert itself before an element with the ID #insertHere. next up, i’ll be adding #insertHere where ever applicable.

Attachment
0
Keyboard1000n17

this is good right? i’m going to change the background color of the scrollbars and fix up the index page and then i’ll finally commit!!!

Attachment
Attachment
Attachment
0
Keyboard1000n17

YAY MY HOURS ARE BACK
also js coming in clutch (css aint tho)

Attachment
0
Keyboard1000n17

i don’t think this is ideal… i’ll have to change it then

Attachment
0
Keyboard1000n17

help what did i do i only remember that i set grid-row of main to 1 instead of 2 in the media query

Attachment
0
Keyboard1000n17

save me

now srsly, is this fine? cuz i dont think it is. also i dont think ive actually refactored anything but whatever, i added sass variables.

Attachment
0
Keyboard1000n17

help i cant do this anymore PLEASE

Attachment
0
Keyboard1000n17

started refactoring. will take a while. after this i’ll add themes… and DEMOS!!! commit will be after a while tho.

Attachment
0
Keyboard1000n17

w chatgpt it told me how to fix that clipping problem! i wasnt gonna figure it out myself

Attachment
0
Keyboard1000n17

commit dropping in 1 or 2 days!!!!! now have to fix:

  • everything going up when i click on the last link in the toc
  • media queries to make it good for everyone : )
Attachment
0
Keyboard1000n17

yall im cooking a bg for the entire website and changing the scrollbars

Attachment
0
Keyboard1000n17

better now! so close!!!!

Attachment
1

Comments

Rei
Rei 4 months ago

umm i recommend to add a dark mode cuz my eyes hurt now :pf:

Keyboard1000n17

getting somwhere… follow for updates :)

Attachment
0
Keyboard1000n17

help i think i have to rewrite the styling from scratch

Attachment
0
Keyboard1000n17

lotta styling. also removed all the details tags and changed all the summary tags to h2 tags. i also worked on this quick links thing.

Attachment
0
Keyboard1000n17

help it took so long pls follow to make it worth it

Attachment
2

Comments

cspythoncoder
cspythoncoder 4 months ago

hey got a small bug on macOs 10.14.6 using brave browser Brave 1.59.64 Chromium: 116.0.5845.163.

when I am opening the website there is a huge glassmorphism thingy which is blocking the view…

Toni
Toni 4 months ago

really love the idea, the website looks great - sadly also experienced the glass thingy blocking your view bug

Keyboard1000n17

finally done with the homepage for the windows section

Attachment
0
Keyboard1000n17

help i cant even remember what i did pls follow to save me

Attachment
0
Keyboard1000n17

here’s my progress so far!

Attachment
0
Keyboard1000n17

started revamping the ui. i had a really good idea last night. i want to do something like the mdn docs! once its finished, you will see :). so far:

  • i figured out why the js i wrote to get the inner height of the browser window wasn’t applying, it was because it only applied whenever the browser would resize (how did i not catch that?).
  • i’ve added max-width: 70ch; to the main element
  • i’m switching to a mobile-first stylesheet so that i don’t need a bunch of rules just to set display: none;
    it’s gonna take a while. pls follow and star my repo and project : )
Attachment
0
Keyboard1000n17

added a close button for the hamburger menu. i have no idea how tf it took me 31 minu-oh wait, i forgot i was styling it too and that took a bit. im finally gonna commit.
edit: wtf what happened to the images? oh well go to the website and open devtools and use that device emulator or if you’re on a phone, just open the site and open and close the menu

Attachment
Attachment
0
Keyboard1000n17

lmfao i was trying to figure out why my menu wasn’t aligning to the right and why right: -15px; seemed to work and eventually i pasted the code into chatgippity and i had another ruleset targeting the same element and there was margin-right: 1rem; there i’m so blind even with glasses that have +3.5 power 😭

Attachment
0
Keyboard1000n17

so i’ve worked on improvements for the hamburger menu because there’s no blur. it took this long because of something about stacking context making the blur container go above the hamburger menu drawer (asked chatgippity after looking at it for 15 minutes without any progress whatsoever). i moved the hamburger menu part out of the nav element, only leaving the menu icon that opens the menu when you click it.
tldr: my blur was going above my hamburger menu because stacking context

Attachment
0
Keyboard1000n17

so it was because i nested a tags… what did i expect i guess i deserved that

Attachment
0
Keyboard1000n17

so my plan was just to modify the pagefind ui styling so that it doesn’t go off the damn phone screen and become a minor constituent of the air and i decided i’d do some homepage improvements too, and now… i think the screenshot tells it all

Attachment
0
Keyboard1000n17

Just added a blur behind the OS logos lol. It took like 5 minutes but the time logged is 5^2 because I couldn’t figure out why tf my overlay styles weren’t working. It was because I was using > instead of <space>. The difference is that <space> means anywhere within an element, and > means a direct descendant of the element. Rookie mistake on my part I thought the Eleventy watch server was tripping lmfao : ).

Attachment
0
Keyboard1000n17

SO much improvement!

  • Finished the fluentUI.scss stylesheet WITH media query
  • Added the html-minifier-next package after checking out other packages
  • Added a bunch of scripts in package.json
  • NEW!: Minified the (built) site! (was painful and the time didn’t even get logged πŸ˜­πŸ™
Attachment
0
Keyboard1000n17

Shipped this project!

Hours: 10.57
Cookies: πŸͺ 219
Multiplier: 20.68 cookies/hr

So far, it’s been coming well. I feel that even with only two devlogs, the project is at shipping quality. I’ve worked on it before and after Summer of Making. I mean, I only join these YSWSs to enjoy some conversation and get rewards for stuff I’d do anyway.

Keyboard1000n17

just worked further on the scss. dont mind the disgusting diffs, it’s minified lol.

Attachment
0
Keyboard1000n17

nearly 10h! (???)
i don’t know why 10h but i’ll take it! i’ve begun finally implementing SCSS on my website. my files aren’t linked to it yet because it’s not complete and i’m planning to do that soon. meanwhile, during the gap between Summer or Making and joining Flavortown:

  • i implemented a unified eleventy template for ALL my website files
  • i also added a convenient table management system for my release history tables that uses JSON to generate a table. i’m thinking about going back though because it’s super unoptimized. like, using the JSON to build a table and then pasting the output into the file.
  • i’ve changed the landing page a little
  • did i mention a search bar?
    go check out everything on the website!
Attachment
0