text-shadow: <offset-x> <offset-y> <blur-radius> <color>;In diesem Beispiel erstelle ich einen weißen Text mit einer schwarzen Kontur von 1px
<!DOCTYPE html>| Please answer the following settings for generating a CSS clamp() value. I will not proceed until you provide all the values (or confirm the defaults): | |
| Clamp() Generation Settings | |
| 1. What is the base rem size? (default: 10px) | |
| 2. What is the min viewport width? (default: 380px) | |
| 3. What is the min size in pixels? (default: 15px) | |
| 4. What is the max viewport width? (default: 1600px) | |
| 5. What is the max size in pixels? (default: 18px) | |
| ________________________________________ | |
| 📐 Choose a spacing scale ratio (case-insensitive) | |
| Options: |
| li.has-settings { | |
| background-color: rgba(252,87,120, .5) !important; | |
| } | |
| span.bricks-svg-wrapper::after { | |
| display: none !important; | |
| } |
| /* https://www.youtube.com/watch?v=hy8W7cBdcaE */ | |
| /* Apply this code to the parent element of a card design and ensure you have at least one link applied - typically the heading */ | |
| %root% { | |
| position: relative; | |
| } | |
| %root% h3 a::before { | |
| content: ''; |
| <!DOCTYPE html> | |
| <html lang="de"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Document</title> | |
| <style> | |
| .parent { | |
| width: 100%; |
| /* This CSS is in a custom class of the Card Element */ | |
| %root% { | |
| position: relative; | |
| } | |
| %root%:hover { | |
| translate: 0 -.25rem; | |
| } |
| /* Either pass the code in your Bricks settings -> Custom Code -> CSS, or - if you already have a Code manager active: Set the css to for "logged in users only". */ | |
| html { | |
| margin-top: 0px !important; | |
| } | |
| #wpadminbar { | |
| top: 4px; | |
| margin: 0 5px 0 5px; | |
| transition: all ease-in-out .2s; |
| %root% { | |
| --icon-url: url(/wp-content....svg); | |
| --icon-color: var(--primary); | |
| --icon-offset: 0 .5ex; | |
| --icon-size: 1em; | |
| --icon-gap: .5em; | |
| --icon-display: flex; | |
| --list-indent: 0; | |
| } |
| /* Make the edited icon bigger */ | |
| .bricks-panel-controls .has-setting .indicator { | |
| background-color: currentColor; | |
| background-color: var(--bricks-color-secondary); | |
| border-radius: 0%; | |
| display: inline-block; | |
| height: 20px; | |
| width: 6px; | |
| } |
https://automaticcss.com/docs/overlay-classes/ Angepasst auf Core Framework
.overlay--primary-10 {
--overlay-background: var(--primary-10);
}
.overlay--primary-20 {
--overlay-background: var(--primary-20);