Want more? Join the Code Snippet Society!
Font Manipulation
Add Accent Font to Headlines
h1 em, h2 em, h3 em { font-family:var( --meta-font-font-family); font-style:normal !important;}First - assign the font properties for miscellaneous to whatever font you want to replace within a heading. Next, add the code snippet. In the heading, select the word you want to change fonts for and apply the italics to see the effect.
List Sections
Layered List Sections
Step 1: Add Anchor ID
Add an anchor ID to the section: #layeredlist
Step 2: Add Anchor ID
Add this code to the Custom CSS Panel:
section#layeredlist { .user-items-list-simple { grid-template-columns: 1fr !important; grid-gap:0 !important; max-width: unset !important; padding: 0 !important; } .user-items-list-simple .list-item { flex-direction: row; gap: 1rem; border-top:1px solid; padding-block:1rem; transform:translate3d(0px,0px,0px); margin-bottom: -4rem; background-color: var(--siteBackgroundColor); transition:0.5s; padding-inline:4vw; } .user-items-list-simple .list-item:hover { translate:0 -4rem; cursor:pointer; background-color:#F1BDB7; } .user-items-list-simple .list-item > * { margin:0 !important; gap: 1rem; } .user-items-list-simple .list-item-media { flex-basis: 20%; } .user-items-list-simple .list-item-content { display: contents; } .user-items-list-simple .list-item-content__text-wrapper { display: contents; } .user-items-list-simple .list-item-content__title { order: -1; flex-basis: 40%; text-align: left !important; } .user-items-list-simple .list-item-content__description { margin: 0 !important; text-align: left !important; flex-basis:40%; } } @media screen and (max-width:767px) { section#layeredlist { .user-items-list-simple .list-item { flex-wrap:wrap; margin-bottom: 0rem; align-items:center; } .user-items-list-simple .list-item-content__description { flex-basis:100%; } .user-items-list-simple .list-item-content__title { flex:1; } .user-items-list-simple .list-item:hover { translate:unset; } } }