Open in app
Sign inGet started
Go to the profile of castastrophe
castastrophe in PatternFly Elements
<div class=”rh-cta — component” rh-align=”left” rh-type=”primary” id=”rh-custom-component”> <a class=”rh-cta-link” href=”#” title=”Lorem ipsum”>This is my test</a> </div>

Prefixing: the eternal question

To prefix or not to prefix? The eternal question. In this write-up…

Read more…
Go to the profile of Kendall Totten
Kendall Totten in PatternFly Elements

PatternFly Elements theming hooks: Using CSS variables in a component

CSS variables, a.k.a. custom…

Read more…
2 responses
Go to the profile of Kendall Totten
Kendall Totten in PatternFly Elements

PatternFly Elements theming hooks: CSS “Broadcast” Variables

The idea behind “broadcast” variables is…

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Web Components and SEO

We all understand how important SEO is and how crucial it is for crawlers to be able to understand our content in our…

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Testing your PatternFly Element in React

We’ve built PatternFly Elements to work in most frontend frameworks and React is one of the frameworks that we formally support. So, we must test our components in React.

Prerequisites

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Testing Your PatternFly Element in Angular

We’ve built PatternFly Elements to work in most frontend frameworks and Angular is one of the frameworks that we formally support. So, we must test our components in Angular.

Prerequisites

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Using PatternFly Elements (web components) in your React App

To get web components to work with React it’s pretty easy and straightforward. If you’d like to follow along, go ahead and create a new React CodeSandbox on codesandbox.io. The React sandbox uses create-react-app to scaffold…

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Using PatternFly Elements (web components) in your Vue App

To get web components to work with Vue, it’s pretty easy and straightforward. If you’d like to follow along, go ahead and create a new Vue CodeSandbox on codesandbox.io. The Vue sandbox uses the vue-cli to scaffold an app and you…

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

Using PatternFly Elements (web components) in your Angular App

To get web components to work with Angular, there are a few steps that we need to take. If you’d like to follow along, go ahead and create a new Angular CodeSandbox on codesandbox.io. The Angular sandbox uses the…

Read more…
Go to the profile of Kyle Buchanan
Kyle Buchanan in PatternFly Elements

More Resilient Web Components in Angular (or anywhere else) with MutationObserver

A real-world example…

Read more…
About
PatternFly Elements
PatternFly Elements
An open-source, flexible design system using web components.
More information
Followers
48
Elsewhere