Bhavya’s Portfolio
- 2 Devlogs
- 7 Total hours
Buiding a website for my portfolio
Ship #1
Pending review
@bhavyavashisth
on
Bhavya’s Portfolio
I have made a personal portfolio website using HTML,CSS and JS.The home page has the profile pic in gif formate,about me ,email,blogs and skills.Links of my github and x.
There were some parts which were challenging:
1.The dark mode pfp: My first pass used a css filter to turn the gif pfp into a red silhouette,which worked terrible for my pfp like it makes the pfp straight up disappeared against the dark background.
2.Locking the colock to IST: First version used the viewer’s local timezone,so it read BST in London>fixed with Int.DateTimeFormate and timeZone:“Asia/Kolkata”
Things of which i am proud of the most is how much good website i made with the most minimalism type work like it will only took 20 to 30sec to the viewer to scroll through the website and know about me if he is reading the blogs then story is different and the other things is color palette i chose for the website which goes perfectly with my pfp and looks good in both dark made and light mode in which light mode ain’t looking like a simple white layer rather then its something which is unique in my eyes.
Things should people know so they can explore my site:
Theme toggle is the small sun/moon button in the top-right.
The ist clock on the home page is locked to Asia/Kolkata so it shows the right time no matter where you open it from.Updates every 30s
@bhavyavashisth
on
Bhavya’s Portfolio
2h 42m 11s logged
devlog -#2
So i have to remove some of the things which i added last time as upcoming features:
CVE
Hobbies
I removed them as no one cares what your hobbies and to be honest i tried and wrote the entire code but the results ain’t satisfying so i just deleted the code as i left in the website what i like , i really like to write blogs and kinda find it enjoyable to tell how did i and why did i kinda like it so i have added another blog “Reverse engineering a small CTF binary in C”. You can read the blog on the website if you find the title interesting.
As of now the website is complete and i will try my best not make anymore changes “Minimalism is best imo”
@bhavyavashisth
on
Bhavya’s Portfolio
4h 39m 49s logged
devlog -#1
Ok so i am making my portfolio for 4 times now.This is one of the final struck so i don’t forgot what i did and why and everyone who is reading this can yell at me about what i got wrong lol.
The goal:
I am fed up from building a big ahh website therefor this time and one last time i want to make a minimalist website telling about me , profile pic, name,one line what i do a short paragraph, and a location pin with live clock that’s it. The kind of page you read in 20 sec and walks away knowing who i am.
The stack
html+css+ javascript
The dark mode ate my pfp:
ok so originally ideas was to have a character gif to turn into a red tinted shadow in dark mode. Looked good on paper but it was one of the bad idea which didn’t turned out to be as i thought so i need to swap the pfp with a simple gif of a my fav. character Reze from chainsaw men.
The cropping of pfp:
The gif i used was was a portrait jpg so the character’s face got chopped
Fix: I just changed the focus of the pfp from full torso to face only which turned out to be good.
The ist clock:
This was a 10 line function and i still managed to mess it up, First version uses the local viewer’s local time zone so if anyone opened in london it would’ve showed the BST not IST.
Fixed the clock to Asia/Kolkata timezone regarless of where visitor is.The clock updates every 30 sec, which is enough that no one notices the drift and cheap enough for not waste cpu.
Hover animation:
The page barely has any motion by default. I added a few small ones.
- Nav links get a red underline that grows from the left
- Skill cark lifts 2 px and turn their border into red when hover
3.The theme button rotates 15 degree when you point at it - The pfp zooms 4% on hover, clicked the circle so it doesn’t leak
The red glow bulb:
There’s a fixed radial gradient in the top left corner that gives the page soft “Designed website” feel.
What is left to do:
- need to write about my hobbies
- Add another blog as of now only wrote one fully and some coming soon blogs
- CVE
Thats it the most time consuming thing was to write about me , blog and you can’t forget the clock
Thats it, as of now will write about my hobbies , make a simple cve
