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

custom cursor effect

Someone posted this awhile ago asking about the custom cursor (I think it’s only visible on desktop) and I’m trying to figure out how these hover effects work. From what I can tell the button has its hover effect and on hover the custom cursor is transparent so it just looks like the cursor is becoming the hover state. Anyone else have any thoughts on this ? The timing seems a little tricky on when the cursor goes transparent and how it’s animated out and in. It’s a site for accessibility so would be ironic if so but any issues with this kind of effect being inaccessible for those using assistive technology? https://design.google/library/designing-global-accessibility-part-1...

need to couple class to my js file

ps im tired it is 1 at night here trying to fix it
No description

white color!white background

Hey guys!I have a problem:) my text color is always white,but the background can change!the problem is : when user wants to choose white background,what do you recomend?maybe you can help me with a good text-shadow👩🏻‍💻 I have tried many shadows but they just didnt look well...

how do I make an infinite horizontal scroll

How do I make an infinite horizontal image scroll

Overflow

Hi everyone, Im trying to make a portfolio with some projects. I wanna make a "one pager", so when you scroll down each project description will have "its own" page....
No description

Bootstrap

Hello, There is an issue with the div number 3, where it skips a line (at width = 1263 pixels and below to be exact) eventho it's not supposed to, unless the screen is very small. Am i missing something? Thank you in advance. --------------...
No description

characters count using js

I am unable to count the characters in an input tag . I want something like when the user will enter a key it should show me the updated value after each key enter.But first time when i type nothing happens and when i click on sumbit and than again enter key than it works . here is my website link"https://talhamustafa1.github.io/Phishing-Training-Website/learn.html" at the end of this webpage there will be accordian which when clicked will show a input tag with sumbit button
No description

Grid template rows - Height Auto

Hi there, How would I make these grid items all the same height using auto? How do I declare this on the grid template row? https://www.briansboros.com/blog...

react native error

hi I’m currently facing this error. I’m running the app but this error is popping up. I’m using the app to run on emulator. And urgent help
No description

Media Query in Safari iOS

```CSS @media (width:375px) and (height:812px) and (orientation: portrait) { .iphone-12-mini-13-mini:bg-green-500 { --tw-bg-opacity: 1; background-color: rgb(34 197 94 / var(--tw-bg-opacity));...
No description

is it a bad practice to use <br> to break line at a specific word in html?

i have 4 words and i simply for visual need of a design need to break the line at word 2, is using <br> okay professionally? and if not what would be a css alternative ?
No description

How to see LCH colour previews in VSC?

Is there any way to get colour previews for the new(ish) LCH colours? Ideally I could also click-convert them to the other respective colourspaces, as VSC handily allows (for the colour spaces it supports!) Even an online webapp to do this would help, which I can't seem to find....
No description

what is wrong here

i know to solve this problem we will use apply but i don't understand why?
No description

React 'state' issue, looking for explanation

The best I can do because of work permissions is share a pastebin copy (att'd) of the react component I'm working with. Luckily my problem doesn't go beyond the scope of this component anyhow. I'm returning two major pieces of html inside of the component's return div: 1. a <FullCalendar/> component, which has an event listener on it for clicking/interacting with 'events' in the calendar.. and...
No description

tooltip don't overflow parent right edge

i have a tooltip that's top left is the cursor position. is it possible, in css, to constrain the right edge of the modal to the right edge of the parent (so no overflow)...
No description

Help Replicating This

As a tool to learn new techniques, I'm recreating things I find on the web. Today I'm trying to do the mouseover image effect seen on this website (while in desktop screen sizes) https://en.bazil.fr/ I managed to get close with this react hook... ```js import { useEffect, useRef } from "react";...

Transition in tailwind for grid ?

I have the code set up. I wrote grid grid-cols-[3.5rem] and then with mouse on enter attribute I change it to 14.5rem and on out back to 3.5rem the JS works fine. It used to work but for some reason it doesn't work anymore. I set up in tailwind.config.js grid property...

Responsive Double Image CSS Layout

How would you lay this out at desktop (1920), tablet (834), and mobile (375)? I reached for grid but I'm having particular difficulty with the fact that the two images need to maintain their relationship to each other, which makes using a grid impossible (or so I thought). I've created two divs and used flex to make the content change at smaller screens....
No description

I need help

so i used the code from this video https://www.youtube.com/shorts/TgOWjuOweHQ and it is not working

Need Advice Regarding JavaScript

So I've been wanting to starting learning JavaScript I just wanted to ask if there's any tips anyone can give me and what websites/videos you'd recommend me going to so I can start learning JavaScript