KPC

Kevin Powell - Community

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

Join

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

hurrrrricaaaaane

2/17/2023

Cracked Design only in Instagram-Browser

Hey there one wired shit is going on. A customer of me had a strange instagram browser issue. Maybe anybody here can help. Randomly the instagram browser shows his website not responsive (but it is responsive). It happens not regularly and I cannot replicate this problem but customers of him reported it....

Koicha

2/17/2023

What are other solution to use @use in scss for retrieving nested class names?

I know using @import can work, but it is going to be deprecated, so I don't want to use that. Does anyone have any other solution? Example a nested class: ```css...

vince

2/16/2023

Nested aliases in node-sass create-react-app

Hey guys, I hate to be asking another question so soon but I've legitimately tried every avenue I could for figuring this out and can't find anything on Google, chatGPT, or stack overflow. I'm trying to aggregate partials into 1 partial file and use the variables from the aggregated partials in one file. Here is my Stack overflow post: https://stackoverflow.com/questions/75467857/how-to-correctly-access-nested-aliases-with-sass-node-sass-in-create-react-app?noredirect=1#comment133154900_75467857 Curious if anyone has any ideas?...

KesSaft

2/16/2023

Scroll in absolute item with body overflow: hidden

Hey, I have a body with a fixed sidebar and a absolute main section. Both components are in the body which has a width of 100vw and a height of 100vh. The body has also overflow set to hidden. My Problem is now that when I am in the mobile view, I can scroll like 50vh further down and 50vw further to the side....

JWode

2/16/2023

Honeypot for spam/best practice for mailto links

Evening! Just wondering if anyone has a good link/advice for cutting down spam for forms/mailto links? A while ago I read that for forms you can have some success with an invisible field which a bot will likely check - and filter based on that. I was also considering taking that IP and banning on the backend based on that range or something? (I run fail2ban on the server, but don't really know much about this) RE the mailto link - don't i have a similar problem here too in terms of exposing the email address?...

Å Marlon G

2/16/2023

::before & ::after

Hi people! Two questions: 1. Why isn't my ::after showing up (or to be precise, why is it sized 0 x 0) 2. Why is the height of the ::before so tall?...

SirAlan

2/16/2023

Debugging a Safari redrawing performance issue, causing finished animations to slow down rendering

I have a proof of concept for an interactive tool that leverages javascript to track mouse movement and update custom properties on the html element. There is some css that is centering a radial-gradient at the coordinates of the mouse. It's actually really performant in Firefox, Chrome and Edge. But it's very strained in Safari. In the timelines, I've tracked it down to power being used reapplying intro animations that have already completed. These are CSS animations that are applied to certain elements to make them popup when they are scrolled into view (they have animation-fill-mode:both set). When I turn off all those animations (e.g. just unset all animation-name on all elements), then the effect is very smooth again in Safari. And the intro are smooth when scrolling....

Wolle

2/16/2023

declaring and calling a function in one line strangeness

Can anyone explain, why this returns 'string'?

function testTwo() { return 'return'; }('string')

function testTwo() { return 'return'; }('string')

...

d0kefish

2/15/2023

Passing in data to change Style/HTML

Ill start of by saying I'm very new to CSS/Website making. I'm trying to build a feature where I have a timeline of a day. it should also be possible to add different time slots, lunch break etc. https://codepen.io/d0kefish/pen/WNgNKjL...

vince

2/15/2023

Quick question on design token philosophy

(This might be better for ui/ux) I've recently read Brad Frost's Atomic Design and looked into design tokens. Really cool stuff and seems super useful for bigger projects/scalability. My question is, I'm not sure if I'm using it right. Should I go all in with every css property being a design token, or is it okay to use a mix of both, or other? For example:

kooliris

2/15/2023

Calculate the sum of elements in a matrix diagonally

I'm creating a function sum_diagonal(arr) to calculate the sum of elements in a matrix diagonally but when it reaches the center, the element is repeating. for example: 2 6 4 1 3 5 6 2 2...

kira

2/15/2023

CHANGE COLOR SVG

hi guys plz how can i change the color of an image with svg type????

d0kefish

2/15/2023

Origin/anchor point for scaling

Is it possible to change the point towards where something scales? Ive set my font to 1vw (which might be stupid), and when I make the screen smaller, it seems it scales towards the top left. This is what it seems to be doing top is currently, bottom is what i'd want: https://i.imgur.com/qw7Espr.png Here's the example: ...

stealthy

2/15/2023

Dynamic overflow scroll effect

so I have two sections in a parent , first section has headings and paragraph, second section has no of items, this second section should be scrollable and it should have a max -height of remaining space of the parent. how to achieve that .https://codepen.io/naveen570/pen/NWLWZaE , code pen for reference.

angell1389

2/15/2023

How to answer the best project that you worked in JavaScript?

I did work a lot of projects before like this (Student and mentor project - where student asks a question and mentor answers questions, students questions are matched to mentors based on their ratings and subjects that they have in their profile The tech stack we used, we had mobile app and web app? Web app - is using react just for admin to view the questions asked by student and answered by mentors and some other extra functionalities...

OmIsCool

2/15/2023

Hey folks, I wrote this code to create 2 * 2 grid layout for cards with dot navigation.

It seems to be working but card has to be multiple of 4. If there are 9 cards (which is in the example code) the last dot in the navigation renders wrong card. I've concatenated js/css/html in one page for ease. Codepen: https://codepen.io/Abhi1234567890/pen/yLxLGXV...

home.html

NazCodeland

2/14/2023

css theming

Hey everyone, I been trying to implement a contrast theming palette for my website. What I've managed to do: 1) The site contains light/dark mode toggle button 2) The site contains 4 additional contrast themes. If a user selects a theme, the light/dark mode toggle is turned off. 3) When user visits the site with their own OS contrast mode(Contrast Themes on Windows and Increase Contrast on Mac), the sites contrast themes are hidden, to prevent the user enabling a contrast theme on top of their OS contrast theme. 4) When a user visits from from Mac and they have "Increase Contrast" enabled, I've chosen one of the contrast themes of the site for that request. ...

phyrasaur

2/14/2023

scrollable marquee

I want a marquee that: 1. scrollable (ideally without reimplementing scroll function) 2. continuous 3. change speed on hover This is my weird take but I notice on a higher "speed", scrollTo doesn't appear smooth?...

hermitz

2/14/2023

Crop transparency from a video

so I have a video which have the dimensions of the red square, but it's all transparent except the cyan square, is there a way to remove all the transparency and make the cyan square automatically fit to the size of the video?...

Adarsh

2/14/2023

How to add a bootstrap toast message when internet is not connected

I have a code which shows an alert when Internet is not there. I want to add a bootstrap toast instead of the alert. Does anybody know how to achieve that. Here is my internet status code. ``` constructor(private connectionService: ConnectionService) { this.connectionService.monitor().subscribe((isConnected) => { this.isConnected = isConnected.hasInternetAccess;...

Previous Next

Gaming

Programming

Kevin Powell - Community

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

Kevin Powell - Community

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