chuckdries/wordpress-monorepo
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

initial commit

Browse Source
This commit is contained in:
Chuck Dries 2023-07-25 13:32:51 -07:00
commit 2d86ead5f9
38 changed files with 33318 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
.gitignore vendored Normal file
View File

@ -0,0 +1 @@
transsocial-link-card

18
gradient-link-card/.editorconfig Normal file
View File

@ -0,0 +1,18 @@
# This file is for unifying the coding style for different editors and IDEs
# editorconfig.org
# WordPress Coding Standards
# https://make.wordpress.org/core/handbook/coding-standards/
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = tab
[*.{yml,yaml}]
indent_style = space
indent_size = 2

30
gradient-link-card/.gitignore vendored Normal file
View File

@ -0,0 +1,30 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Coverage directory used by tools like istanbul
coverage
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Output of `npm pack`
*.tgz
# Output of `wp-scripts plugin-zip`
*.zip
# dotenv environment variables file
.env

46
gradient-link-card/build/block.json Normal file
View File

@ -0,0 +1,46 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 3,
"name": "create-block/gradient-link-card",
"version": "0.1.0",
"title": "Gradient Link Card",
"category": "widgets",
"icon": "button",
"description": "A link displayed as a card with text and a cool gradient hover effect",
"supports": {
"html": false,
"color": {
"gradients": true
}
},
"attributes": {
"title": {
"type": "string",
"source": "text",
"selector": "h2"
},
"href": {
"type": "string",
"source": "attribute",
"selector": "a",
"attribute": "href"
},
"body": {
"type": "string",
"source": "text",
"selector": "p"
},
"style": {
"type": "object",
"default": {
"color": {
"gradient": "linear-gradient(45deg, hsl(348deg 79% 81%) 0%, hsl(336deg 73% 81%) 21%, hsl(321deg 61% 80%) 30%, hsl(296deg 47% 79%) 39%, hsl(269deg 64% 82%) 46%, hsl(244deg 82% 85%) 54%, hsl(224deg 99% 83%) 61%, hsl(211deg 100% 78%) 69%, hsl(203deg 100% 73%) 79%, hsl(197deg 94% 67%) 100%)"
}
}
}
},
"textdomain": "gradient-link-card",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css"
}

1
gradient-link-card/build/index.asset.php Normal file
View File

@ -0,0 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => 'd1293e1606fa95f272fb');

1
gradient-link-card/build/index.css Normal file
View File

@ -0,0 +1 @@
.wp-block-create-block-gradient-link-card{border:1px dotted #333}

1
gradient-link-card/build/index.js Normal file
View File

@ -0,0 +1 @@
(()=>{"use strict";var e,t={259:()=>{const e=window.wp.blocks,t=window.wp.element,r=(window.wp.i18n,window.wp.components),n=window.wp.blockEditor,o=JSON.parse('{"u2":"create-block/gradient-link-card"}');(0,e.registerBlockType)(o.u2,{edit:function({attributes:e,setAttributes:o}){return(0,t.createElement)("div",{...(0,n.useBlockProps)()},(0,t.createElement)("div",{className:"editor-inner"},(0,t.createElement)(r.TextControl,{label:"Title",value:e.title,onChange:e=>o({title:e})}),(0,t.createElement)(r.TextControl,{label:"href",value:e.href,onChange:e=>o({href:e})}),(0,t.createElement)(r.TextControl,{label:"body",value:e.body,onChange:e=>o({body:e})})))},save:function({attributes:e}){return(0,t.createElement)("div",{...n.useBlockProps.save()},(0,t.createElement)("a",{href:e.href},(0,t.createElement)("h2",null,e.title),e.body&&(0,t.createElement)("p",null,e.body)))}})}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var l=r[e]={exports:{}};return t[e](l,l.exports,n),l.exports}n.m=t,e=[],n.O=(t,r,o,l)=>{if(!r){var a=1/0;for(d=0;d<e.length;d++){r=e[d][0],o=e[d][1],l=e[d][2];for(var i=!0,c=0;c<r.length;c++)(!1&l||a>=l)&&Object.keys(n.O).every((e=>n.O[e](r[c])))?r.splice(c--,1):(i=!1,l<a&&(a=l));if(i){e.splice(d--,1);var s=o();void 0!==s&&(t=s)}}return t}l=l||0;for(var d=e.length;d>0&&e[d-1][2]>l;d--)e[d]=e[d-1];e[d]=[r,o,l]},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={826:0,431:0};n.O.j=t=>0===e[t];var t=(t,r)=>{var o,l,a=r[0],i=r[1],c=r[2],s=0;if(a.some((t=>0!==e[t]))){for(o in i)n.o(i,o)&&(n.m[o]=i[o]);if(c)var d=c(n)}for(t&&t(r);s<a.length;s++)l=a[s],n.o(e,l)&&e[l]&&e[l][0](),e[l]=0;return n.O(d)},r=self.webpackChunkgradient_link_card=self.webpackChunkgradient_link_card||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})();var o=n.O(void 0,[431],(()=>n(259)));o=n.O(o)})();

1
gradient-link-card/build/style-index.css Normal file
View File

@ -0,0 +1 @@
div.wp-block-create-block-gradient-link-card{background-position:100%!important;background-size:250%!important;border-radius:10px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);color:#fff;display:flex;flex:1 0 27ch;margin:0;padding:5px;transition:background-position .6s cubic-bezier(.22,1,.36,1)}.wp-block-create-block-gradient-link-card a,.wp-block-create-block-gradient-link-card>.editor-inner{background-color:#fff;border-radius:5px;color:#111;line-height:1.4;opacity:1;padding:1rem 1.3rem;text-decoration:none;transition:opacity .6s ease;width:100%}.wp-block-create-block-gradient-link-card h2{font-size:1.25rem;margin:0;transition:color .6s cubic-bezier(.22,1,.36,1)}.wp-block-create-block-gradient-link-card h2:after{content:"→"}.wp-block-create-block-gradient-link-card:is(:hover,:focus-within){background-position:0!important}.wp-block-create-block-gradient-link-card:is(:hover,:focus-within) a,.wp-block-create-block-gradient-link-card:is(:hover,:focus-within)>.editor-inner{opacity:.8}

26
gradient-link-card/gradient-link-card.php Normal file
View File

@ -0,0 +1,26 @@
<?php
/**
* Plugin Name: Gradient Link Card
* Description: Example block scaffolded with Create Block tool.
* Requires at least: 6.1
* Requires PHP: 7.0
* Version: 0.1.0
* Author: The WordPress Contributors
* License: GPL-2.0-or-later
* License URI: https://www.gnu.org/licenses/gpl-2.0.html
* Text Domain: gradient-link-card
*
* @package create-block
*/
/**
* Registers the block using the metadata loaded from the `block.json` file.
* Behind the scenes, it registers also all assets so they can be enqueued
* through the block editor in the corresponding context.
*
* @see https://developer.wordpress.org/reference/functions/register_block_type/
*/
function create_block_gradient_link_card_block_init() {
register_block_type( __DIR__ . '/build' );
}
add_action( 'init', 'create_block_gradient_link_card_block_init' );

16151
gradient-link-card/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

20
gradient-link-card/package.json Normal file
View File

@ -0,0 +1,20 @@
{
"name": "gradient-link-card",
"version": "0.1.0",
"description": "Example block scaffolded with Create Block tool.",
"author": "The WordPress Contributors",
"license": "GPL-2.0-or-later",
"main": "build/index.js",
"scripts": {
"build": "wp-scripts build",
"format": "wp-scripts format",
"lint:css": "wp-scripts lint-style",
"lint:js": "wp-scripts lint-js",
"packages-update": "wp-scripts packages-update",
"plugin-zip": "wp-scripts plugin-zip",
"start": "wp-scripts start"
},
"devDependencies": {
"@wordpress/scripts": "^26.9.0"
}
}

55
gradient-link-card/readme.txt Normal file
View File

@ -0,0 +1,55 @@
=== Gradient Link Card ===
Contributors: The WordPress Contributors
Tags: block
Tested up to: 6.1
Stable tag: 0.1.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Example block scaffolded with Create Block tool.
== Description ==
This is the long description. No limit, and you can use Markdown (as well as in the following sections).
For backwards compatibility, if this section is missing, the full length of the short description will be used, and
Markdown parsed.
== Installation ==
This section describes how to install the plugin and get it working.
e.g.
1. Upload the plugin files to the `/wp-content/plugins/gradient-link-card` directory, or install the plugin through the WordPress plugins screen directly.
1. Activate the plugin through the 'Plugins' screen in WordPress
== Frequently Asked Questions ==
= A question that someone might have =
An answer to that question.
= What about foo bar? =
Answer to foo bar dilemma.
== Screenshots ==
1. This screen shot description corresponds to screenshot-1.(png|jpg|jpeg|gif). Note that the screenshot is taken from
the /assets directory or the directory that contains the stable readme.txt (tags or trunk). Screenshots in the /assets
directory take precedence. For example, `/assets/screenshot-1.png` would win over `/tags/4.3/screenshot-1.png`
(or jpg, jpeg, gif).
2. This is the second screen shot
== Changelog ==
= 0.1.0 =
* Release
== Arbitrary section ==
You may provide arbitrary sections, in the same format as the ones above. This may be of use for extremely complicated
plugins where more information needs to be conveyed that doesn't fit into the categories of "description" or
"installation." Arbitrary sections will be shown below the built-in sections outlined above.

46
gradient-link-card/src/block.json Normal file
View File

@ -0,0 +1,46 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 3,
"name": "create-block/gradient-link-card",
"version": "0.1.0",
"title": "Gradient Link Card",
"category": "widgets",
"icon": "button",
"description": "A link displayed as a card with text and a cool gradient hover effect",
"supports": {
"html": false,
"color": {
"gradients": true
}
},
"attributes": {
"title": {
"type": "string",
"source": "text",
"selector": "h2"
},
"href": {
"type": "string",
"source": "attribute",
"selector": "a",
"attribute": "href"
},
"body": {
"type": "string",
"source": "text",
"selector": "p"
},
"style": {
"type": "object",
"default": {
"color": {
"gradient": "linear-gradient(45deg, hsl(348deg 79% 81%) 0%, hsl(336deg 73% 81%) 21%, hsl(321deg 61% 80%) 30%, hsl(296deg 47% 79%) 39%, hsl(269deg 64% 82%) 46%, hsl(244deg 82% 85%) 54%, hsl(224deg 99% 83%) 61%, hsl(211deg 100% 78%) 69%, hsl(203deg 100% 73%) 79%, hsl(197deg 94% 67%) 100%)"
}
}
}
},
"textdomain": "gradient-link-card",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css"
}

58
gradient-link-card/src/edit.js Normal file
View File

@ -0,0 +1,58 @@
/**
* Retrieves the translation of text.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-i18n/
*/
import { __ } from "@wordpress/i18n";
import { TextControl } from "@wordpress/components";
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
import { useBlockProps } from "@wordpress/block-editor";
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* Those files can contain any CSS code that gets applied to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import "./editor.scss";
/**
* The edit function describes the structure of your block in the context of the
* editor. This represents what the editor will render when the block is used.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#edit
*
* @return {WPElement} Element to render.
*/
export default function Edit({ attributes, setAttributes }) {
return (
<div {...useBlockProps()}>
<div className="editor-inner">
<TextControl
label="Title"
value={attributes.title}
onChange={(val) => setAttributes({ title: val })}
/>
<TextControl
label="href"
value={attributes.href}
onChange={(val) => setAttributes({ href: val })}
/>
<TextControl
label="body"
value={attributes.body}
onChange={(val) => setAttributes({ body: val })}
/>
{/* <h2>{attributes.title}</h2>
{attributes.body && <p>{attributes.body}</p>} */}
</div>
</div>
);
}

9
gradient-link-card/src/editor.scss Normal file
View File

@ -0,0 +1,9 @@
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
.wp-block-create-block-gradient-link-card {
border: 1px dotted #333;
}

39
gradient-link-card/src/index.js Normal file
View File

@ -0,0 +1,39 @@
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
import { registerBlockType } from '@wordpress/blocks';
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import './style.scss';
/**
* Internal dependencies
*/
import Edit from './edit';
import save from './save';
import metadata from './block.json';
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
registerBlockType( metadata.name, {
/**
* @see ./edit.js
*/
edit: Edit,
/**
* @see ./save.js
*/
save,
} );

30
gradient-link-card/src/save.js Normal file
View File

@ -0,0 +1,30 @@
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
import {
useBlockProps,
__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,
} from "@wordpress/block-editor";
/**
* The save function defines the way in which the different attributes should
* be combined into the final markup, which is then serialized by the block
* editor into `post_content`.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#save
*
* @return {WPElement} Element to render.
*/
export default function save({ attributes }) {
return (
<div {...useBlockProps.save()}>
<a href={attributes.href}>
<h2>{attributes.title}</h2>
{attributes.body && <p>{attributes.body}</p>}
</a>
</div>
);
}

39
gradient-link-card/src/style.scss Normal file
View File

@ -0,0 +1,39 @@
div.wp-block-create-block-gradient-link-card {
flex: 1 0 27ch;
color: #fff;
display: flex;
padding: 5px;
margin: 0;
background-size: 250% !important;
border-radius: 10px;
background-position: 100% !important;
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
0 2px 4px -2px rgba(0, 0, 0, 0.1);
}
.wp-block-create-block-gradient-link-card a, .wp-block-create-block-gradient-link-card > .editor-inner {
width: 100%;
text-decoration: none;
line-height: 1.4;
padding: 1rem 1.3rem;
border-radius: 5px;
color: #111;
background-color: white;
transition: opacity 0.6s ease;
opacity: 1;
}
.wp-block-create-block-gradient-link-card h2 {
margin: 0;
font-size: 1.25rem;
transition: color 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.wp-block-create-block-gradient-link-card h2::after {
content: "→";
}
.wp-block-create-block-gradient-link-card:is(:hover, :focus-within) {
background-position: 0 !important;
}
.wp-block-create-block-gradient-link-card:is(:hover, :focus-within) a, .wp-block-create-block-gradient-link-card:is(:hover, :focus-within) > .editor-inner{
opacity: 0.8;
}

18
trans-pride-heading/.editorconfig Normal file
View File

@ -0,0 +1,18 @@
# This file is for unifying the coding style for different editors and IDEs
# editorconfig.org
# WordPress Coding Standards
# https://make.wordpress.org/core/handbook/coding-standards/
root = true
[*]
charset = utf-8
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true
indent_style = tab
[*.{yml,yaml}]
indent_style = space
indent_size = 2

30
trans-pride-heading/.gitignore vendored Normal file
View File

@ -0,0 +1,30 @@
# Logs
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
# Coverage directory used by tools like istanbul
coverage
# Compiled binary addons (https://nodejs.org/api/addons.html)
build/Release
# Dependency directories
node_modules/
# Optional npm cache directory
.npm
# Optional eslint cache
.eslintcache
# Output of `npm pack`
*.tgz
# Output of `wp-scripts plugin-zip`
*.zip
# dotenv environment variables file
.env

25
trans-pride-heading/build/block.json Normal file
View File

@ -0,0 +1,25 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 3,
"name": "create-block/trans-pride-heading",
"version": "0.1.0",
"title": "Trans Pride Heading",
"category": "widgets",
"icon": "smiley",
"description": "Example block scaffolded with Create Block tool.",
"attributes": {
"content": {
"type": "string",
"source": "text",
"selector": "span",
"default": ""
}
},
"supports": {
"html": false
},
"textdomain": "trans-pride-heading",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css"
}

1
trans-pride-heading/build/index.asset.php Normal file
View File

@ -0,0 +1 @@
<?php return array('dependencies' => array('wp-block-editor', 'wp-blocks', 'wp-components', 'wp-element', 'wp-i18n'), 'version' => '8147b93850cb1ad1a03c');

46
trans-pride-heading/build/index.css Normal file
View File

@ -0,0 +1,46 @@
/*!****************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/editor.scss ***!
\****************************************************************************************************************************************************************************************************************************************/
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
:root {
--accent-gradient: linear-gradient(
45deg,
hsl(348deg 79% 81%) 0%,
hsl(336deg 73% 81%) 21%,
hsl(321deg 61% 80%) 30%,
hsl(296deg 47% 79%) 39%,
hsl(269deg 64% 82%) 46%,
hsl(244deg 82% 85%) 54%,
hsl(224deg 99% 83%) 61%,
hsl(211deg 100% 78%) 69%,
hsl(203deg 100% 73%) 79%,
hsl(197deg 94% 67%) 100%
);
}
.wp-block-create-block-trans-pride-heading h1 {
font-size: 3em;
font-weight: 800;
margin: 0;
}
.wp-block-create-block-trans-pride-heading input[type=text] {
font-family: inherit;
font-weight: 800;
font-size: 3em;
border: 0;
width: 100%;
background-image: var(--accent-gradient);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
background-position: 0%;
padding: 0;
}
/*# sourceMappingURL=index.css.map*/

1
trans-pride-heading/build/index.css.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"index.css","mappings":";;;AAAA;;;;EAAA;AAMA;EACC;;;;;;;;;;;;IAAA;AAYD;;AAGA;EACC;EACC;EACD;AAAD;;AAGA;EACE;EACA;EACA;EACD;EACA;EAEA;EACC;EACA;EACA;EACA;EACA;EACA;AADF,C","sources":["webpack://trans-pride-heading/./src/editor.scss"],"sourcesContent":["/**\n * The following styles get applied inside the editor only.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n:root {\n\t--accent-gradient: linear-gradient(\n 45deg,\n hsl(348deg 79% 81%) 0%,\n hsl(336deg 73% 81%) 21%,\n hsl(321deg 61% 80%) 30%,\n hsl(296deg 47% 79%) 39%,\n hsl(269deg 64% 82%) 46%,\n hsl(244deg 82% 85%) 54%,\n hsl(224deg 99% 83%) 61%,\n hsl(211deg 100% 78%) 69%,\n hsl(203deg 100% 73%) 79%,\n hsl(197deg 94% 67%) 100%\n );\n}\n\n.wp-block-create-block-trans-pride-heading h1 {\n\tfont-size: 3em;\n font-weight: 800;\n\tmargin: 0;\n}\n\n.wp-block-create-block-trans-pride-heading input[type=\"text\"] {\n font-family: inherit;\n font-weight: 800;\n font-size: 3em;\n\tborder: 0;\n\twidth: 100%;\n\n\tbackground-image: var(--accent-gradient);\n -webkit-background-clip: text;\n background-clip: text;\n -webkit-text-fill-color: transparent;\n background-size: 100%;\n background-position: 0%;\n padding: 0;\n}\n\n"],"names":[],"sourceRoot":""}

432
trans-pride-heading/build/index.js Normal file
View File

@ -0,0 +1,432 @@
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./src/edit.js":
/*!*********************!*\
!*** ./src/edit.js ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ Edit)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/i18n */ "@wordpress/i18n");
/* harmony import */ var _wordpress_i18n__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_i18n__WEBPACK_IMPORTED_MODULE_1__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__);
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @wordpress/components */ "@wordpress/components");
/* harmony import */ var _wordpress_components__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(_wordpress_components__WEBPACK_IMPORTED_MODULE_3__);
/* harmony import */ var _editor_scss__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./editor.scss */ "./src/editor.scss");
/**
* Retrieves the translation of text.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-i18n/
*/
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* Those files can contain any CSS code that gets applied to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
/**
* The edit function describes the structure of your block in the context of the
* editor. This represents what the editor will render when the block is used.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#edit
*
* @return {WPElement} Element to render.
*/
function Edit({
attributes,
setAttributes,
isSelected
}) {
const blockProps = (0,_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_2__.useBlockProps)();
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
...blockProps
}, isSelected ? (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.Fragment, null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("input", {
type: "text",
value: attributes.content,
onChange: e => setAttributes({
content: e.target.value
})
})) : (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h1", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, attributes.content)));
}
/***/ }),
/***/ "./src/index.js":
/*!**********************!*\
!*** ./src/index.js ***!
\**********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/blocks */ "@wordpress/blocks");
/* harmony import */ var _wordpress_blocks__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _style_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./style.scss */ "./src/style.scss");
/* harmony import */ var _edit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./edit */ "./src/edit.js");
/* harmony import */ var _save__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./save */ "./src/save.js");
/* harmony import */ var _block_json__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./block.json */ "./src/block.json");
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
/**
* Internal dependencies
*/
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
(0,_wordpress_blocks__WEBPACK_IMPORTED_MODULE_0__.registerBlockType)(_block_json__WEBPACK_IMPORTED_MODULE_4__.name, {
example: {
attributes: {
content: "Tans rights are human rights"
}
},
/**
* @see ./edit.js
*/
edit: _edit__WEBPACK_IMPORTED_MODULE_2__["default"],
/**
* @see ./save.js
*/
save: _save__WEBPACK_IMPORTED_MODULE_3__["default"]
});
/***/ }),
/***/ "./src/save.js":
/*!*********************!*\
!*** ./src/save.js ***!
\*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
/* harmony export */ "default": () => (/* binding */ save)
/* harmony export */ });
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @wordpress/element */ "@wordpress/element");
/* harmony import */ var _wordpress_element__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_wordpress_element__WEBPACK_IMPORTED_MODULE_0__);
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @wordpress/block-editor */ "@wordpress/block-editor");
/* harmony import */ var _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__);
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
/**
* The save function defines the way in which the different attributes should
* be combined into the final markup, which is then serialized by the block
* editor into `post_content`.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#save
*
* @return {WPElement} Element to render.
*/
function save({
attributes
}) {
const blockProps = _wordpress_block_editor__WEBPACK_IMPORTED_MODULE_1__.useBlockProps.save();
return (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("div", {
...blockProps
}, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("h1", null, (0,_wordpress_element__WEBPACK_IMPORTED_MODULE_0__.createElement)("span", null, attributes.content)));
}
/***/ }),
/***/ "./src/editor.scss":
/*!*************************!*\
!*** ./src/editor.scss ***!
\*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "./src/style.scss":
/*!************************!*\
!*** ./src/style.scss ***!
\************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
/***/ }),
/***/ "@wordpress/block-editor":
/*!*************************************!*\
!*** external ["wp","blockEditor"] ***!
\*************************************/
/***/ ((module) => {
module.exports = window["wp"]["blockEditor"];
/***/ }),
/***/ "@wordpress/blocks":
/*!********************************!*\
!*** external ["wp","blocks"] ***!
\********************************/
/***/ ((module) => {
module.exports = window["wp"]["blocks"];
/***/ }),
/***/ "@wordpress/components":
/*!************************************!*\
!*** external ["wp","components"] ***!
\************************************/
/***/ ((module) => {
module.exports = window["wp"]["components"];
/***/ }),
/***/ "@wordpress/element":
/*!*********************************!*\
!*** external ["wp","element"] ***!
\*********************************/
/***/ ((module) => {
module.exports = window["wp"]["element"];
/***/ }),
/***/ "@wordpress/i18n":
/*!******************************!*\
!*** external ["wp","i18n"] ***!
\******************************/
/***/ ((module) => {
module.exports = window["wp"]["i18n"];
/***/ }),
/***/ "./src/block.json":
/*!************************!*\
!*** ./src/block.json ***!
\************************/
/***/ ((module) => {
module.exports = JSON.parse('{"$schema":"https://schemas.wp.org/trunk/block.json","apiVersion":3,"name":"create-block/trans-pride-heading","version":"0.1.0","title":"Trans Pride Heading","category":"widgets","icon":"smiley","description":"Example block scaffolded with Create Block tool.","attributes":{"content":{"type":"string","source":"text","selector":"span","default":""}},"supports":{"html":false},"textdomain":"trans-pride-heading","editorScript":"file:./index.js","editorStyle":"file:./index.css","style":"file:./style-index.css"}');
/***/ })
/******/ });
/************************************************************************/
/******/ // The module cache
/******/ var __webpack_module_cache__ = {};
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/ // Check if module is in cache
/******/ var cachedModule = __webpack_module_cache__[moduleId];
/******/ if (cachedModule !== undefined) {
/******/ return cachedModule.exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = __webpack_module_cache__[moduleId] = {
/******/ // no module.id needed
/******/ // no module.loaded needed
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = __webpack_modules__;
/******/
/************************************************************************/
/******/ /* webpack/runtime/chunk loaded */
/******/ (() => {
/******/ var deferred = [];
/******/ __webpack_require__.O = (result, chunkIds, fn, priority) => {
/******/ if(chunkIds) {
/******/ priority = priority || 0;
/******/ for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
/******/ deferred[i] = [chunkIds, fn, priority];
/******/ return;
/******/ }
/******/ var notFulfilled = Infinity;
/******/ for (var i = 0; i < deferred.length; i++) {
/******/ var chunkIds = deferred[i][0];
/******/ var fn = deferred[i][1];
/******/ var priority = deferred[i][2];
/******/ var fulfilled = true;
/******/ for (var j = 0; j < chunkIds.length; j++) {
/******/ if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
/******/ chunkIds.splice(j--, 1);
/******/ } else {
/******/ fulfilled = false;
/******/ if(priority < notFulfilled) notFulfilled = priority;
/******/ }
/******/ }
/******/ if(fulfilled) {
/******/ deferred.splice(i--, 1)
/******/ var r = fn();
/******/ if (r !== undefined) result = r;
/******/ }
/******/ }
/******/ return result;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/compat get default export */
/******/ (() => {
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = (module) => {
/******/ var getter = module && module.__esModule ?
/******/ () => (module['default']) :
/******/ () => (module);
/******/ __webpack_require__.d(getter, { a: getter });
/******/ return getter;
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/jsonp chunk loading */
/******/ (() => {
/******/ // no baseURI
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "index": 0,
/******/ "./style-index": 0
/******/ };
/******/
/******/ // no chunk on demand loading
/******/
/******/ // no prefetching
/******/
/******/ // no preloaded
/******/
/******/ // no HMR
/******/
/******/ // no HMR manifest
/******/
/******/ __webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
/******/
/******/ // install a JSONP callback for chunk loading
/******/ var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var runtime = data[2];
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0;
/******/ if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
/******/ for(moduleId in moreModules) {
/******/ if(__webpack_require__.o(moreModules, moduleId)) {
/******/ __webpack_require__.m[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(runtime) var result = runtime(__webpack_require__);
/******/ }
/******/ if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ installedChunks[chunkId][0]();
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ return __webpack_require__.O(result);
/******/ }
/******/
/******/ var chunkLoadingGlobal = self["webpackChunktrans_pride_heading"] = self["webpackChunktrans_pride_heading"] || [];
/******/ chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
/******/ chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module depends on other loaded chunks and execution need to be delayed
/******/ var __webpack_exports__ = __webpack_require__.O(undefined, ["./style-index"], () => (__webpack_require__("./src/index.js")))
/******/ __webpack_exports__ = __webpack_require__.O(__webpack_exports__);
/******/
/******/ })()
;
//# sourceMappingURL=index.js.map

1
trans-pride-heading/build/index.js.map Normal file
View File

File diff suppressed because one or more lines are too long

41
trans-pride-heading/build/style-index.css Normal file
View File

@ -0,0 +1,41 @@
/*!***************************************************************************************************************************************************************************************************************************************!*\
!*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/style.scss ***!
\***************************************************************************************************************************************************************************************************************************************/
/**
* The following styles get applied both on the front of your site
* and in the editor.
*
* Replace them with your own styles or remove the file completely.
*/
:root {
--accent-gradient: linear-gradient(
45deg,
hsl(348deg 79% 81%) 0%,
hsl(336deg 73% 81%) 21%,
hsl(321deg 61% 80%) 30%,
hsl(296deg 47% 79%) 39%,
hsl(269deg 64% 82%) 46%,
hsl(244deg 82% 85%) 54%,
hsl(224deg 99% 83%) 61%,
hsl(211deg 100% 78%) 69%,
hsl(203deg 100% 73%) 79%,
hsl(197deg 94% 67%) 100%
);
}
.wp-block-create-block-trans-pride-heading h1 {
font-size: 3em;
font-weight: 800;
margin: 0;
}
.wp-block-create-block-trans-pride-heading span {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
background-position: 0%;
}
/*# sourceMappingURL=style-index.css.map*/

1
trans-pride-heading/build/style-index.css.map Normal file
View File

@ -0,0 +1 @@
{"version":3,"file":"./style-index.css","mappings":";;;AAAA;;;;;EAAA;AAOA;EACC;;;;;;;;;;;;IAAA;AAYD;;AAGA;EACC;EACC;EACD;AAAD;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;AAAF,C","sources":["webpack://trans-pride-heading/./src/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n\n:root {\n\t--accent-gradient: linear-gradient(\n 45deg,\n hsl(348deg 79% 81%) 0%,\n hsl(336deg 73% 81%) 21%,\n hsl(321deg 61% 80%) 30%,\n hsl(296deg 47% 79%) 39%,\n hsl(269deg 64% 82%) 46%,\n hsl(244deg 82% 85%) 54%,\n hsl(224deg 99% 83%) 61%,\n hsl(211deg 100% 78%) 69%,\n hsl(203deg 100% 73%) 79%,\n hsl(197deg 94% 67%) 100%\n );\n}\n\n.wp-block-create-block-trans-pride-heading h1 {\n\tfont-size: 3em;\n font-weight: 800;\n\tmargin: 0;\n}\n\n.wp-block-create-block-trans-pride-heading span {\n background-image: var(--accent-gradient);\n -webkit-background-clip: text;\n background-clip: text;\n -webkit-text-fill-color: transparent;\n background-size: 100%;\n background-position: 0%;\n}"],"names":[],"sourceRoot":""}

15820
trans-pride-heading/package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

20
trans-pride-heading/package.json Normal file
View File

@ -0,0 +1,20 @@
{
"name": "trans-pride-heading",
"version": "0.1.0",
"description": "Example block scaffolded with Create Block tool.",
"author": "The WordPress Contributors",
"license": "GPL-2.0-or-later",
"main": "build/index.js",
"scripts": {
"build": "wp-scripts build",
"format": "wp-scripts format",
"lint:css": "wp-scripts lint-style",
"lint:js": "wp-scripts lint-js",
"packages-update": "wp-scripts packages-update",
"plugin-zip": "wp-scripts plugin-zip",
"start": "wp-scripts start"
},
"devDependencies": {
"@wordpress/scripts": "^26.7.0"
}
}

55
trans-pride-heading/readme.txt Normal file
View File

@ -0,0 +1,55 @@
=== Trans Pride Heading ===
Contributors: The WordPress Contributors
Tags: block
Tested up to: 6.1
Stable tag: 0.1.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Example block scaffolded with Create Block tool.
== Description ==
This is the long description. No limit, and you can use Markdown (as well as in the following sections).
For backwards compatibility, if this section is missing, the full length of the short description will be used, and
Markdown parsed.
== Installation ==
This section describes how to install the plugin and get it working.
e.g.
1. Upload the plugin files to the `/wp-content/plugins/trans-pride-heading` directory, or install the plugin through the WordPress plugins screen directly.
1. Activate the plugin through the 'Plugins' screen in WordPress
== Frequently Asked Questions ==
= A question that someone might have =
An answer to that question.
= What about foo bar? =
Answer to foo bar dilemma.
== Screenshots ==
1. This screen shot description corresponds to screenshot-1.(png|jpg|jpeg|gif). Note that the screenshot is taken from
the /assets directory or the directory that contains the stable readme.txt (tags or trunk). Screenshots in the /assets
directory take precedence. For example, `/assets/screenshot-1.png` would win over `/tags/4.3/screenshot-1.png`
(or jpg, jpeg, gif).
2. This is the second screen shot
== Changelog ==
= 0.1.0 =
* Release
== Arbitrary section ==
You may provide arbitrary sections, in the same format as the ones above. This may be of use for extremely complicated
plugins where more information needs to be conveyed that doesn't fit into the categories of "description" or
"installation." Arbitrary sections will be shown below the built-in sections outlined above.

25
trans-pride-heading/src/block.json Normal file
View File

@ -0,0 +1,25 @@
{
"$schema": "https://schemas.wp.org/trunk/block.json",
"apiVersion": 3,
"name": "create-block/trans-pride-heading",
"version": "0.1.0",
"title": "Trans Pride Heading",
"category": "widgets",
"icon": "smiley",
"description": "Example block scaffolded with Create Block tool.",
"attributes": {
"content": {
"type": "string",
"source": "text",
"selector": "span",
"default": ""
}
},
"supports": {
"html": false
},
"textdomain": "trans-pride-heading",
"editorScript": "file:./index.js",
"editorStyle": "file:./index.css",
"style": "file:./style-index.css"
}

52
trans-pride-heading/src/edit.js Normal file
View File

@ -0,0 +1,52 @@
/**
* Retrieves the translation of text.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-i18n/
*/
import { __ } from "@wordpress/i18n";
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
import { useBlockProps } from "@wordpress/block-editor";
import { TextControl } from "@wordpress/components";
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* Those files can contain any CSS code that gets applied to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import "./editor.scss";
/**
* The edit function describes the structure of your block in the context of the
* editor. This represents what the editor will render when the block is used.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#edit
*
* @return {WPElement} Element to render.
*/
export default function Edit({ attributes, setAttributes, isSelected }) {
const blockProps = useBlockProps();
return (
<div {...blockProps}>
{isSelected ? (
<>
<input
type="text"
value={attributes.content}
onChange={(e) => setAttributes({ content: e.target.value })}
/>
</>
) : (
<h1>
<span>{attributes.content}</span>
</h1>
)}
</div>
);
}

44
trans-pride-heading/src/editor.scss Normal file
View File

@ -0,0 +1,44 @@
/**
* The following styles get applied inside the editor only.
*
* Replace them with your own styles or remove the file completely.
*/
:root {
--accent-gradient: linear-gradient(
45deg,
hsl(348deg 79% 81%) 0%,
hsl(336deg 73% 81%) 21%,
hsl(321deg 61% 80%) 30%,
hsl(296deg 47% 79%) 39%,
hsl(269deg 64% 82%) 46%,
hsl(244deg 82% 85%) 54%,
hsl(224deg 99% 83%) 61%,
hsl(211deg 100% 78%) 69%,
hsl(203deg 100% 73%) 79%,
hsl(197deg 94% 67%) 100%
);
}
.wp-block-create-block-trans-pride-heading h1 {
font-size: 3em;
font-weight: 800;
margin: 0;
}
.wp-block-create-block-trans-pride-heading input[type="text"] {
font-family: inherit;
font-weight: 800;
font-size: 3em;
border: 0;
width: 100%;
background-image: var(--accent-gradient);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
background-position: 0%;
padding: 0;
}

44
trans-pride-heading/src/index.js Normal file
View File

@ -0,0 +1,44 @@
/**
* Registers a new block provided a unique name and an object defining its behavior.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
import { registerBlockType } from "@wordpress/blocks";
/**
* Lets webpack process CSS, SASS or SCSS files referenced in JavaScript files.
* All files containing `style` keyword are bundled together. The code used
* gets applied both to the front of your site and to the editor.
*
* @see https://www.npmjs.com/package/@wordpress/scripts#using-css
*/
import "./style.scss";
/**
* Internal dependencies
*/
import Edit from "./edit";
import save from "./save";
import metadata from "./block.json";
/**
* Every block starts by registering a new block type definition.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-registration/
*/
registerBlockType(metadata.name, {
example: {
attributes: {
content: "Tans rights are human rights",
},
},
/**
* @see ./edit.js
*/
edit: Edit,
/**
* @see ./save.js
*/
save,
});

27
trans-pride-heading/src/save.js Normal file
View File

@ -0,0 +1,27 @@
/**
* React hook that is used to mark the block wrapper element.
* It provides all the necessary props like the class name.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/packages/packages-block-editor/#useblockprops
*/
import { useBlockProps } from "@wordpress/block-editor";
/**
* The save function defines the way in which the different attributes should
* be combined into the final markup, which is then serialized by the block
* editor into `post_content`.
*
* @see https://developer.wordpress.org/block-editor/reference-guides/block-api/block-edit-save/#save
*
* @return {WPElement} Element to render.
*/
export default function save({ attributes }) {
const blockProps = useBlockProps.save();
return (
<div {...blockProps}>
<h1>
<span>{attributes.content}</span>
</h1>
</div>
);
}

37
trans-pride-heading/src/style.scss Normal file
View File

@ -0,0 +1,37 @@
/**
* The following styles get applied both on the front of your site
* and in the editor.
*
* Replace them with your own styles or remove the file completely.
*/
:root {
--accent-gradient: linear-gradient(
45deg,
hsl(348deg 79% 81%) 0%,
hsl(336deg 73% 81%) 21%,
hsl(321deg 61% 80%) 30%,
hsl(296deg 47% 79%) 39%,
hsl(269deg 64% 82%) 46%,
hsl(244deg 82% 85%) 54%,
hsl(224deg 99% 83%) 61%,
hsl(211deg 100% 78%) 69%,
hsl(203deg 100% 73%) 79%,
hsl(197deg 94% 67%) 100%
);
}
.wp-block-create-block-trans-pride-heading h1 {
font-size: 3em;
font-weight: 800;
margin: 0;
}
.wp-block-create-block-trans-pride-heading span {
background-image: var(--accent-gradient);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 100%;
background-position: 0%;
}

26
trans-pride-heading/trans-pride-heading.php Normal file
View File

@ -0,0 +1,26 @@
<?php
/**
* Plugin Name: Trans Pride Heading
* Description: Thick blocky text with a pleasant trans pride gradient on it.
* Requires at least: 6.1
* Requires PHP: 7.0
* Version: 0.1.0
* Author: Chuck Dries <chuckdries.com>
* License: GPL-2.0-or-later
* License URI: https://www.gnu.org/licenses/gpl-2.0.html
* Text Domain: trans-pride-heading
*
* @package create-block
*/
/**
* Registers the block using the metadata loaded from the `block.json` file.
* Behind the scenes, it registers also all assets so they can be enqueued
* through the block editor in the corresponding context.
*
* @see https://developer.wordpress.org/reference/functions/register_block_type/
*/
function create_block_trans_pride_heading_block_init() {
register_block_type( __DIR__ . '/build' );
}
add_action( 'init', 'create_block_trans_pride_heading_block_init' );