feelgooddd
@feelgoodddAll solutions
URL shortening with dropdown hamburger nav on smaller screens
#accessibilitySubmitted about 1 month agoI would like help with naming conventions i feel like my function and class names may not follow any standards which are used in the professional field. I have heard about BEM but have not yet learned or used it. I do not know how clear my code reads to someone coming into my project with fresh eyes.
I also do not think my css is organized well, I tried to keep it structured in a way where the classes are organized in the order which they appear on the page but somewhere in the middle I started adding new classes and it got messy quickly. I would like advice on how you deal with a growing css file. Do you split it into separate css files ? Should I maybe learn and use sass/scss? Any advice in making the code more eligible would be great.
I also barely used utility classes so there I'd a bunch of reused code especially for margins and padding. Would you tackle this issue by using a framework or would a framework be too much for a project this small and instead I should write my own custom helper classes ?
Using HTML/CSS/JS populating cards from JSON file
Submitted 5 months agoI have added comments for my confusing spaghetti code.
I don't like the way I implemented the eventlisteners for the All/Active/Inactive buttons. Currently it adds an eventlistener 12 times to each of these buttons because i have it in my foreach loop which adds cards to my page.
because of this I have 12 * 3 = 36 event listeners for 3 buttons.
But I could not think of a way to do it otherwise because if I try to move the event listeners and the functions which they trigger outside of the foreach loop I can not access the card that I want to affect. Any help is appreciated with how to move these event listeners outside of the loop so they only need to be added once to each button. app.js
Basic Static Component using React with Vanilla CSS
#react#viteSubmitted 6 months agoI want help with making my Components more reusable. How would you go about splitting this project up into more separate components? I know the question is vague but I think I have too much hard-coded stuff and would like someone who is more experienced than me with React to give some insight into how they would approach this project using React.
(Also I know I have all of my components in 1 file and should split them into separate files, but since it is a very small project I just left them all in the app.jsx)
Responsive signup page with Form using Vanilla JS + CSS(No Frameworks)
Submitted 7 months agoIn my javascript I changed the input.style on many different properties for the background and it looks ugly and inefficient. If anyone could advise me on a way to do this in a cleaner way and give an example that would be amazing. Please help!!
Landing page using vanilla CSS Grid + Flex / No frameworks
Submitted 7 months agoI don't like the way I did the header. I made it a div with a background of the image, and through a series of background image manipulation such as positioning the background on its Y axis I got it to appear almost how I wanted. I am not a fan of how much blue space I have between the nav bar and the orange. I got frustrated and gave up accepting the way it looks finally.
If you have any advice about positioning the image as a background and making it look nice that would be appreciated.
Notification page using Vanilla JS and CSS
Submitted 7 months agoAnything about my markup and if I overdid it with divs, if there is any cleaner or better way I could have written my markup.
Contact form using emailJS
Submitted 7 months agoI don't like the way I used visibility: hidden instead of display: hidden in my project. It leaves a lot of white space between the different sections. But when I use display: hidden my input shift up and down on the page ruining the whole layout.
For example(using display: hidden) First name and Last name are side by side, if the error text below First name is visible but the the error text below last name is hidden then the layout would shift first name upwards to fit the error text below it making first name and last name not line up side by side anymore.
Tip Calculator with colour slider at bottom using CSS/JS
Submitted 8 months agoI don't think the way I did the colour scheme change was the most efficient. I used Javascript to record all of the colours in my CSS :root variable as JS variables and then changed them within JS. If you have another way for me to change the colour scheme then please write a message telling me how you would tackle this.
Advice Generator using adviceslip API
Submitted 8 months agoCSS styling and html formatting could probably be better, any advice on what you would do differently would be appreciated.
Responsive Huddle Landing Page
Submitted 11 months agoIn the following image you can see what the webpage looks like when viewed from my friends iPhone 14 on Safari iOS. This is not what it looks like on PC nor what it looks like on a samsung Galaxy S10, nor on an iPhone 13. Any help to fix this would be appreciated.
https://imgur.com/a/MqzFr0i
Image below is what it looks like on most other devices.
https://imgur.com/a/x8AiW7G
Order Summary Page using flexbox
Submitted 11 months agoIf anyone can help look over my flex containers and items and give me feedback if I've implemented and used them correctly or if there is a better and more efficient way I could have used them please give me critique here so I can improve my skills using flex.
Beginner recipe page using HTML/CSS
Submitted 11 months agoI faced issues, and did not solve how to create a border-bottom under each table row in my table. The project JPEG showed a line between each row in the table in the Nutrition section.