@EndLess9

Now it’s pretty!

Previously the wordle solver worked, so this time I only focused on style.css.

It works!

I now have a fully working wordle solver!.

It’s using a word list i created in json using a list of all the wordle words. The filtering process uses for loops and if statements to filter out the words that qualify the constraints.

Set up the basic html structure of what the website will look like.

• It has 5 boxes at the top for green letters

How mine is different from other wordle solvers:

• You can add the yellow letters and cross off which position they can’t be in, this is a feature that no other wordle solver that I’ve used has.

• An of course a place to enter gray letters

Devlog #3:
Previously the little guy have a pretty solid cylindrical shape and it looked fine, but I wanted to try something different…I used the conic tool and made it’s body wider right above the base. This makes it’s body look more dynamic. Although this was a very simple change it took be about 30 minutes of trial and error before I got it right.

Also…
This will likely be the last devlog for this project since all the modeling is basically done, all that’s left is to print it.

Body and Legs:
I scrapped my old technique. I adopted a new one where i create a normal rectangle and then I create a semi-circle on the top and bottom. Very similar to my old technique, but this time i only extrude the rectangle, and I use the revolve tool to create a sphere at the bottom and the top to give it a better look.

Eyes and backpack:
I also used the rectangle tool to sketch out the eyes and the backback and then I extruded it and used fillet to give it rounded edges. However, its still pretty basic as of now. Soon I will work more on them if needed or I might improve the body and legs.

I also removed a chunk from the bottom to make it flat for the among us character can sit on my table.

After many failed sketches and techniques I used the 1 rectangle + 2 3 point arc technique to make pill like shapes that I’m using to make the body and the legs. I also added a rectangle at the bottom to remove a part of the body to make it’s bottom flat. And for the legs I used the fillet tool at the correct proportions to make it round but also flat at the bottom.

Devlog #3
With a little bit of javascript I made the search bar functional, you can see me using it in the GIF attached below.

I also added a new feature that shows the time and date at the top left of the screen.

I also created the ReadME for this project.

Devlog #2:

Made a section under the shortcuts for the NASA science stuff about Eclipse paid. Including its picture and a paragraph. I also added video compatibility so if NASA releases a video my site can load it.

I also set up the vite config.

Then I deployed the site on github pages url: https://endlessdude.github.io/SimpleTab/

Devlog #1

• I created the search bar using html and css. The search bar isnt functional yet so I haven’t used any javascript.

• I created a place under the search bar for shortcuts. I also only used html and css for this since js wasn’t needed. By clicking any of the 4 icons you are redirected to the application in a new tab.

• I also set up the .env with the nasa api’s and used java script to get information through the api’s, but I haven’t really made anything using it in my tab.

Devlog #3Changed the body’s color to black, and the header’s color to red instead of cyan.1. Nav bar:- Increased height- The Nav bar is now white, the opened page will appear as red and the ones that aren’t opened will be black2. Home:Added 2 bigger buttons that lead the user to the about me or projects page.3. About me:Here I wrote my introduction and added pictures of video games, animes, and f1 drivers that I like.4. Projects:Here I added hyper linked images of some of my programing projects.5. Readme:I wrote a basic readme for my repo.

Devlog #2

I haven’t done much work in the website yet, but after about 30 minutes I figured out how to create separate pages for each href in my project.

How I did it:
I used some js to comepletely hide the sections for the hrefs while they weren’t selected in the nav bar.

I also added some css to make the selected button look darker to show that it’s selected.

Devlog #1:

This is the first time I’m making a website from scratch without AI or video tutorials so it took me a while to create a simple heading for my website and the nav bar.

Here is what I did to the nav bar’s buttons:

• text color: white
• bold
• un-underlined
• added a border radius of 7px to give it curvey edges
• changed the background to brown
• added a padding of 5px

nav bar:

• vertically centered it
• horizontally aligned it to the right
• added a gap of 40px between each href

Heading:

• gave it a height of 40px
• gave it a background color of bisque

Devlog #3

I added 2 new features and wrote my readme.

Feature #1: Orange Keys
By checking off this check-box the white keys in the piano simply become orange. I did this by creating new css styling for the orange keys, created a check-box using html, and then used a event listener in JS to switch the white keys css styling with the orange keys.

Feature #2: Trial Song
For this feature I basically created a box above the piano with the notes for the song: Mary had a little lamb. Instead of using musical notes I used the letters on the piano keys so everyone can easily play it.

Devlog #2:

Phase 1:
In phase one I created the piano keys using css. Then I used html to reverse the gradient of the piano keys to make it look like they are pressed. Then I used html again to write letters on the keys. These letters will later be used to play the piano though your computer’s keyboard.

Phase 2:
In phase 2 I added the notes for the keys of the piano. I added the data set for each key in html which corresponds to the letter of each key. Then using javascript the corresponding sound will be played when the key is clicked using the cursor.

Phase 3:
In phase 3 I added event listeners in my javascript file which play the piano’s notes when you press letters on your keyboard. I also added a 150ms cool down which untoggles the active piano keys, without this the piano keys look so they are pressed down even after releasing the key.

Devlog #1

I used html and css to create the top part of the piano which shows the header(Name of the Project), a slider which controls the volume, and a sliding checkbox that shows/hides the letters on the piano keys.

Currently the letters for the piano keys are in the top part but soon when the piano keys are made they will be shown individually on the keys.