The words Under construction in black text on a yellow background with diagonal black stipes surrounding it
I'm in the process of moving my site. It's still a work in progress. Please excuse the mess and broken links.

Update A Parent CSS Stylesheet From A Web Component

TODO: Pull subtitle into page object

Debugging Stuff

I'm moving stuff around right now. All this below is helping me figure out where to put stuff

        -- title

Update A Parent CSS Stylesheet From A Web Component

You can update a page's CSS custom property variables 
from inside a web component like this:

-- html

<div id="alfa">alfa</div>


-- css
-- show

#alfa {
  border: var(--main-border-primary-base);

-- script
-- show
-- title: Component

  class extends HTMLElement {    
    constructor() {
      this.attachShadow({mode: 'open'})
      const tempHolder = document.createElement("div")
      const tempString = `
  <button id="changeButton">Change It</button>
      tempHolder.innerHTML = tempString
      const el = tempHolder.childNodes[1].content.cloneNode(true)
        () => {

            '--main-border-primary-base', '1px solid #ff2233'

-- categories
-- CSS 
-- JavaScript
-- Web Components 

-- metadata
-- date: 2023-09-02 00:27:31
-- id: 2upfwgsg
-- site: aws
-- type: post
-- status: published