Kevin Powell - Community

KPC

Kevin Powell - Community

A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.

Join

front-end

resources

back-end

ui-ux

os-and-tools

Need recommendation for my new webapp

Hello guys !I need help on a project I am currently undertaking. I aim to develop a simple website that allows users to book appointments using a date picker. The booking results should be sent via email to both the user and the website administrator. I would appreciate your recommendations on any additional requirements or technologies that would be beneficial for this project....

Suggest me 3 frontend projects so i can add them in my resume to get my first job.

I want a job as soon as possible but i dont have any projects in my resume can you suggest me 3 projects so i can add in my resume to get my first job on good pay scale.

How as a 1 year front end developer sharpen the skills

Hello everyone i have experienced using html css and bootstrap but as you all know I'm still lacking sometimes to build good front end landing page website or projects of my own and guide me also how can I find and get projects so that I use my expertise I have previously build some projects of my own you can check by clicking the link below: https://extraordinary-kringle-f2eb73.netlify.app/ https://darling-salamander-7811c7.netlify.app/...

Creating a Array of objects from the union type.

Consider
type Gender = "Male" | "Female"
type Gender = "Male" | "Female"
I want to create a custom array of object with a prop value to be in Gender Union...

how to add classes in react

<Link to="/" className={(pathname === '/') ? 'active' : ''} ><li>Home</li></Link>
<Link to="/" className={(pathname === '/') ? 'active' : ''} ><li>Home</li></Link>
i want to add classes to link tag but im not able to do it.. help...

What's causing the different sizing of my left panel on two different pages?

Home: https://blacklodgeresearch.github.io/website/ About: https://blacklodgeresearch.github.io/website/about/ Same template HTML. Same CSS. Different content on the right. The "about" page having more content pushes the left panel over, and that's not what I want. ...

Using API's

Hey everyone, Right now I'm currently trying use a few API's with a streaming program called Lumia Stream. I'm still fairly new to working with API's, and have a few questions. Right now I'm trying to use the newly released Threads(.net) API, as well as the Instagram API for some potential automations....
No description

Drawer div

Ok so basically imagine this. There are 2 different sized divs. One at top (200px x 50px), the other at bottom (200px x 200px). The bottom div has a content in it, lets say a canvas. What I want to know is, how can I make it so the bottom div could move up and down. But when it moves up, like a magic drawer the contents behind the top div shouldn't be visible. If I just did a basic translation, due to bottom being bigger, the contents will be visible from outside. I also can't really resize the bottom div due to its contents (in this case canvas, the drawing inside would get squeezed)...

Getting white space when keyboard appears in mobile browser

I have this chat app in HTML CSS and JavaScript, when I click the input field in mobile the virtual keyboard appears but it is adding a white space. How to remove this whitespace, any idea? Here is the codepen: https://codepen.io/jawad-ul-hassan/pen/JjQvaNr...

i want to change color of the active nav link in react

```const Navbar = () => { const {pathname} = useLocation(); return (...

Input inner text limit

Question might be a bit weird but basically in the screen you can see an html input element with a value in it. Its value rn is, 12.123456. As you can see, it gets cut after 12 with a HUGE space at the right size. This has no inner padding/margin, this is default behavior. How can I at least decrease that space at the end ?
No description

How to Center Navigation Content and Ensure Background Stretches Full Width on Large Screens?

Hello everyone, I'm trying to optimize my website's navigation bar for large screens, and I'm facing two issues: 1. The content inside the navigation bar is not centered when the screen width exceeds 800px....

How much is too much css? (cube css)

Hey guys, I built this webpage, i used cube CSS, came up with some composition classes, utitlity classes and some button and card classes. My total lines of code came to about 300. It does have animations on hover for the nav bar(dropdown menu with border color lighting up) I'm worried it seems like a lot, however the cube method has allowed my code to be easily modified, is understandable and editable (more than my bem), it's also lead to nice efficient lines of code in certain places. I want to know what you guys think? too much? or does the amount not matter...
No description

Broken images do not respect css?

I am using a headless cms approach, and my backend got hacked -.- I noticed something: when image links are broken, besides the obvious effect of them not appearing, they won't respect our CSS. I am using grid, I am setting img as block and the whole max-width 100% thing, and I tested with huge placeholder images, but they fit as I would expect. Broken links generate overflow though. ...

Unable to apply Display Flex in ReactJs.

I am trying to map my card content and show them as rows but the cards are stacked vertically. I have spent more than two hours on this. Could anyone look into this please?
No description

Why is my top grid area so tall? Why is my address not aligned right?

https://blacklodgeresearch.github.io/website/about/ I'm using grid-template-areas to define an area for the name of the hackspace top left, and nav bar for the rest of the top row. It appears to have more vetical height than I as expecting, and I would prefer it to collapse down to the max-height of the hackspace's name (plus some padding that I understand). My browser inspector tells me that the vertical height is large, not the padding or the margin....

How do I use the CSS Grouping selector for several children

I want to set the style of a, a:hover, a:visitied and a:active, in the nav section of my site separately from the rest of the site. I thought I'd use a CSS selector of nav a, a:hover, but this selects nav a and a:hover not nav (a and a:hover). Is there a ... brackets for this, like for math?

Math in JS.

Can anyone please go through the code and let me know why converting from dollar to cents gives wrong result Steps: $32.5:Converting to cent->32*100=3200. value after decimal point is cent =0005. $10 to be charged extra if cost is less than $40 so $10 gets converted into cents as =1000...

react snippets not working

i tried to type createBrowserRouter and ReactDOM, but i got no snippet suggestion even though i have the react snippets installed