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

help

How to make a input range

Hey guys i dont know how to change the color of the bar, i ask to gpt and he give a lot of css, there is onother way?(the blue is what i have and the other is what i want )
No description

Landing Page Feedback

I'm working a lead generation landing page for a restaurant. I still need to add more animations on the text and svgs, and add brand logos . I would appreciate if someone could provide feedback on what I have so far. Does any of the layout need to change? Thanks. Here's the live website https://lauriejefferson.github.io/restaurant-landing-page/ and here's the GitHub repo link https://github.com/lauriejefferson/restaurant-landing-page

Virtual Machine (VM) vs Docker

Hello guys, sorry to disturb you all... I just have a quick question about one of the tools used in DevOps. I was reading that Docker is one of the tool used. I've read a bit about it and from what I've understood, it's just a package/container that contains standardized units (runtime, dependencies, code, etc...) that can be run anywhere (when we say anywhere, this means on any OS and machine independent ?). My question is, why do we need to use docker... I've never used it but I know it's extensively used. I know when we need to "deploy" an app, we would use docker, but why ? When we say "deploy" an app using docker, where is it deploy? Last question, how is a docker different to a virtual machine and when is one better than the other? I read that VMs have specific resource allocated to them while they are running, while dockers share resources....

I'm trying to recreate the carousel from a website with purely CSS (no or minimal JS)

I've had various failed attempts and about to give up and use a bloated library Site: https://madebyshape.co.uk/about/...

Similar to "Text-Wrap: Balance" or "Text-Wrap: Pretty" but for Flexbox or Grid Layout Models

When displaying any number of elements (whether all elements are the same width or not) using CSS grid, I'd like an efficient way of displaying them so that they wrap in a smart way so that they look more balanced. Both "text-wrap: balance" and "text-wrap: pretty" do its best to eliminate single words on a new line in a wrapped paragraph of text. Balance aims to balance the number of characters on each line, and Pretty tries to favor good typography and keep from having a single word be all by i...

Can a FE only app (React/NextJS) read CSV from a user without submitting to a backend?

Based on my knowledge, this isn't possible, but I thought I'd ask as FE advances faster than I (a backend dominant full-stack) can keep up with. Is it possible for me to create a mini app, using something like NextJS, to take a file a user submits and do some work based on it? If it matters, I want to take the data to fill a template (create name tags with barcodes). Best as I know and have been able to google, a NextJS app can read something out of public, but I haven't seen anything about reading something straight from the user, without first submitting to a backend....

What is your favorite off-white/off-black color to use in web design?

Give me your best off-white and off-black colors that you use to take your web designs to the next level! Off the top of my head, I know of: #FAFAFA (for white)...

Hero Section

i want to make my hero image expand with the content inside it like the Story Graph my effort got me to second pic and i am lost why it is behaving this way...
No description

text-overflow: ellipsis not work

Hi guys, I want to truncate the text by using truncate class of tailwind css but it does not work. I also try to add min-witdth:0 but still not work. Can anyone help me?
No description

how to make the hero section layout?

I need a container for this right ? The purple gradient image on the right side of the womans image confuses me
No description

Feedback on Website Design & Visual Appeal

We have just completed the development of our website and would love to get your feedback on its design. At the moment, the content, button titles, and text are placeholders and will soon be replaced with the final content. Could you let us know how the overall layout looks? Do the background colors, images, and animations appear balanced, or are they too extreme or too subtle? We would appreciate any suggestions on how to improve the visual appeal. Thank you for your time and feedback!...

Can you add back the april fools content for CSS carousels, I was just totally unable to find it

I only found it manually in my history on Youtube (searching Kevin didn't find it) and but has a lot of useful content. I am a Patreon, but I never use that except for funding you as I am a Youtube Premium subscriber anyway. Probably I would have had to turn there next I guess. However, this is really an important bit I am missing for my product page, and the first one in a while that triggered me to want to act on it right away....

height changing on transition when it's not expected

Hey folks can anyone explain this issue right here https://play.tailwindcss.com/B78fB3wSNF whenever I hover or focus on the link I see scale transition which is expected but I also see the height changing but adding after:will-change-transform fixes the issue so can anyone explain why height is changing in transition

Dynamyc SCSS classes with % value

Hello, I'm replacing a deprecated Angular library and I'm trying to create a class in this way: ```scss $fxflexValues: (19, 100); @each $value in $fxflexValues { .flex--fx#{$value} {...

Proxy vs Reverse Proxy

Hello guys, I was just reading a bit about proxy and reverse proxy. Can someone confirm whether my understand is correct please: 1. In proxy (forward proxy), the proxy hides the ip of the clients, so we don't know who request what. 2. In contrast, for reverse proxy, the ip of the servers are hidden. We don't know how sent what. ...

Bringing back the drop-down issue in 2025 .

Hi everyone I’m here to talk about dropdowns. First what is a drop-down : Is <details> a drop-down ? Is <select> a drop-down ?...

How to make this layout ? Esp the top part where it is supposed to be a slider.

I was thinking that it should be done with grid but the slider makes me think it should be done with flexbox. Thoughts?
No description

How Can I Make A Dynamic Tree Component?

Hi, I would like to generate a specific html structure for a binary tree given a JSON in input. Hopefully I can explain the requirement well enough. Each node of my tree is either an Expression or a Literal. - Each Expression has a left and right child node and an operator...
No description

Some fun beginner projects we could do as a server

I'm interested in some ideas for beginner-ish project ideas people in here could team up with. Anyone have ideas? I'm open to anything

Questions about Slide-out Drawers

On mobile, I see some hamburger menus when activated have a screen appear from the left. First off, is this called a "drawer"?...