I've been having an issue trying to import material. I've used similar code to the examples they have on material.angular.io yet I get the "inject() must be called from an injection context..." error. I've just been trying to get this…
I am trying to create a hamburger menu in mobile view. When in mobile view the nav-item gets hidden and when i click the menu icon the nav-items will be displayed. But after clicking on the icon and changing the…
I'm working in SolidJs and using HopeUi for some components. I use the grid component from HopeUi, and I want to fill one of the grids with a canvas component. The code for my App currently looks like this: import…
this is my HTML code: .search-bar{ width: 40px; height: 45px; transition: 0.7s; } .search-icon { top: .4%; right: 5%; width: 35px; margin-left: 300px; cursor: pointer; box-sizing: border-box; } .search-bar:focus{ cursor: pointer; width: 200px; outline: none; } .search-btn{ background-color: transparent; outline:…
import React,{useState} from "react"; const friendsArray = [ { name:"Lalit", age: 23, }, { name:"Neha", age: 22, }, { name:"Piyush", age: 20, }, ] function Arrex(){ const [arr,setArr] = useState(friendsArray) const handleclick=()=>{ setArr((prevArr)=>[ ...prevArr, { name:"Shubham", age:25, }]) } const…
I'm currently working on a React project where I'm using Bootstrap to style my components. I have a JSX component that I want to align to the left on my webpage, but for some reason, it doesn't work. Here's my…
Why are frontend frameworks able to create custom attributes on html elements like Vue for instance <div v-for="..."> Html validators complain if I make up my own. <div something> Telling me I should pretend data- like this <div data-something> I…
I've been learning the basics of front-end web dev and started doing "The Odin Project" I saw an example of a website that I saw on Git-Hub that used HTML and CSS only. I tried taking some inspiration and making…
getCheckStatus(checkStatus: string) { let statusClass = ''; if (checkStatus === 'Completed') { statusClass = 'mat-focus-indicator btn--primary__button mat-raised-button mat-button-base'; } else { statusClass = 'mat-focus-indicator mat-raised-button mat-button-base mat-button-disabled'; } const button = document.createElement('button'); button.className = statusClass; button.textContent = 'Close'; button.addEventListener("click", ()…
I'm diving into the world of CSS animation and attempting to replicate the card shuffling animation seen: https://go.topcreditcardfinder.com/ Here's a glimpse of what I've achieved so far: https://youtu.be/GDIJ2K22cnY I've managed to achieve the basic movement, but I'm struggling with improving…