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

Custom WordPress Favicon does not appear on all pages (Chrome)

Favicon appears on most pages, with the exception of 3. Nothing special about how those 3 pages have been setup. Identical to the ones that are currently displaying favicon properly. All works fine in FireFox but Chrome keeps showing default WP favicon on those 3 pages. This is the code I put inside my <head> tag <link rel="icon" href="<?php echo esc_url( get_template_directory_uri() ); ?>/favicon.ico" type="image/x-icon" />...

SASS stops working seemingly out of nowhere

Hello, I have had this problem multiple times in multiple projects where my SASS stops working seemingly out of nowhere. No changes appear on the website anymore, but changes in the css file do appear as they should. So somewhere the connection seems lost? I haven't been able to find the right wording for my question so google hasn't been able to help.. Thanks in advance!...

Is there a better way of positioning this graphic 🤔

Hello, I have a graphic which sits in the top right corner of its container. Currently I have absolutely positioned it, and it feels like a poor solution as it clearly isn't going to work on some screens unless I add something for every permutation. Here is my current SCSS…...

image set to 1000px !important but still renders as 0px?

I have an image that I want to expand to fill the page. in other instances, this image renders out fully perfectly fine with the exact same css yet in this instance it always renders as 0px. why is this?

Front end Page

can someone send me the code of this tutorial, Thankss!!!

I neeeed heeeelp

Can anyone tell me how can i do this one

Navbar issues....please assist!

For some reason, my justify content: space between or any of those wont work....I tried everything. Trying to get the text part of the nav bar to the far right of the screen. Any advice? I have the flex on. screenshots included! html, css and alert

Ways to take user input in JS?

Tasked with building a library app from odin project, I've created my initial setup, next is to create an addBookToLibrary function that takes user input then saves the new book object as an array. I'm likely overthinking this as I did previous projects on the cli and used prompt-sync, for this there's probably a way of doing it with inputs text fields...?...

TypeScript `|` Combinator

I have the following code: ```typescript ceramic.did = new DID({ provider: threeID.getDidProvider(), resolver: {...

can I make a reusable html code like a function?

(not really sure how to call it) let's say that I have a large SVG with a css animation and that I want to use it multiple times inside of my html file (it can't be a php file . . . I know, that would solve it) can I make something like a function or definition of my pseudo code where I will define this chunk of code once, and everytime I need to place it down I will just use that variable/definition instead of copy-pasting it like 20 times? (I know that I can create pseudo-class in which I can paste this svg via link in the content but I wouldn't be able to controll and animate separate parts of it)...

CSS Nesting Conventions

Loved the video on nesting, Kevin - really exciting to see the power that might have. One thing which occurred to me was around the nesting of media queries into other rules: ```css...

Please, how do I achieve this border design?

I only need to know how to create that bottom right corner of the image.

stroke-dasharray is not full pathLength

in js line #27, I have to double the gap in the dasharray or else the linecap of the next dash will show up I'm not sure where I did wrong blobthink https://codepen.io/petpeeve/pen/oNQdpvL

Responsive site designed for mobile screens. Want media queries for Desktop.

I have made a site in react. I have tried to put it into a codepen. Most of the functionality doesnt work well in the codepen, but it is not necessary for styling. I want some front-end dev to make this into a desktop site with good visual hierarchy using the existing elements by changing just the positioning and width/ max-width of the elements. I want changes to be made in the - Navbar - .container div - .control-panel div...

Modern UI custom checkbox. Feedback

I have made a custom checkbox using vanilla css. Want to know how practical and useful it can be. https://codepen.io/senra/pen/dyQeqjV

Flexbox Scaling issues:

My portfolio site is having issues with flexbox not scaling to be the same size. The services section is inside one div with an ID of Services. I thought I had everything set up in the css to keep all services listed the same size, however they scale individually. Also, under the contact me section my email link and calendly link seem to become attached at different view port sizes. When the view port is smaller, they are separate, however as the page size increases they seem to merge. Thank you for the suggestions in advance. Replit with my code: https://replit.com/@Snowy7949/Demo-Site#index.html...

SVG Animation Layer / Priority kind of question..,

Hi all, got a quick and simple question, Why is it that, when I re-organize the entire (.HTML) code that contains the SVG Animation, that, certain paths are overlapping / being brought to the front as shown..? Eeh Edit: The original .html is just a lot of <paths> like this one for example: ```...

Positioning containers inside a flex container, using the "middle portion of the page"

Really poorly illustrated but I'm effectively trying to accomplish this. My portfolio (https://www.callum-laing.com/) is one of those where I'm not fully utilizing the entire width of the page. Something I've always struggled with, and hoped that learning grid would maybe help with, is trying to have my Contact section split like the image I've attached. I did attempt grid-areas but that just ended up with the form on the far-left side of the page, and the socials right next to it. Flex is probably my best bet but I'm not really sure how to go about handling coding it. Ignore the mess, I've just copy pasta'd my portfolio code into a codepen, scroll to the bottom for container section 😄 https://codepen.io/pen/...

hey, can anyone help me achieve this border design using the css clip property

I have an image, and I would like to have this shape (a semi circle or a triangle on the right or left border) of the image

ok so i have a doubt

i am using astro + netlify cms and when i use an orderd list i want to use a grid instead of <ol> how can i do that seamlessly ig