-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Added initial commit with working version
- Loading branch information
0 parents
commit 4bed4e9
Showing
77 changed files
with
2,101 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,52 @@ | ||
<?php | ||
/** | ||
* APSC Blocks. | ||
* | ||
* A plugin for Applied Science which adds additional blocks to the Gutenberg editor based | ||
* on the APSC Style Guide. | ||
* | ||
* @package APSCBlocks | ||
* @author Rich Tape | ||
* @license GPL-2.0-or-later | ||
* | ||
* @wordpress-plugin | ||
* Plugin Name: APSC Blocks | ||
* Plugin URI: https://github.com/ubc/apsc-blocks | ||
* Description: A plugin for Applied Science which adds additional blocks to the Gutenberg editor based on the APSC Style Guide. | ||
* Version: 1.0.0 | ||
* Requires at least: 5.2 | ||
* Requires PHP: 7.2 | ||
* Author: Rich Tape | ||
* Author URI: https://richardtape.com | ||
* Text Domain: apsc-blocks | ||
* License: GPL v2 or later | ||
* License URI: http://www.gnu.org/licenses/gpl-2.0.txt | ||
*/ | ||
|
||
namespace UBC\APSC\Blocks; | ||
|
||
// If this file is called directly, abort. | ||
if ( ! defined( 'ABSPATH' ) ) { | ||
die; | ||
} | ||
|
||
define( 'UBC_APSCBLOCKS_PLUGIN_DIR', plugin_dir_path( __FILE__ ) ); | ||
define( 'UBC_APSCBLOCKS_PLUGIN_URL', plugin_dir_url( __FILE__ ) ); | ||
|
||
define( 'UBC_APSCBLOCKS_DESIGN_SYSTEM_URL', 'https://release-design-system-3-0--apsc-design-system.netlify.app/apsc-base.min.css' ); | ||
define( 'UBC_APSCBLOCKS_DESIGN_SYSTEM_VERSION', '1.0.0' ); | ||
|
||
require_once UBC_APSCBLOCKS_PLUGIN_DIR . 'inc/class-apsc-blocks.php'; | ||
|
||
// Instantiate early on plugins_loaded. | ||
add_action( 'plugins_loaded', __NAMESPACE__ . '\\initialize_apsc_blocks' ); | ||
|
||
/** | ||
* Initializes the plugin. | ||
* | ||
* @since 1.0.0 | ||
* @return void | ||
*/ | ||
function initialize_apsc_blocks() { | ||
$apsc_blocks = new APSC_Blocks(); | ||
}//end initialize_apsc_blocks() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,67 @@ | ||
/** | ||
* This file is specifically for Block Editor overrides. There are some misalignments between | ||
* WordPress core styles, the CLF styles, the Block Editor styles, and the APSC Style Guide. This | ||
* file tweaks the editor styles to match the front-end as closely as possible. | ||
*/ | ||
|
||
/** | ||
* Card Block overrides. ======================================================================== | ||
* | ||
* The card blocks in the editor all have a margin-top except the first card. On the front-end | ||
* none of the cards have a margin top so we remove the margin-top from the editor. | ||
*/ | ||
.editor-styles-wrapper :where(body .is-layout-flow) .card-columns__two .wp-block-media-text.card, | ||
.editor-styles-wrapper :where(body .is-layout-flow) .card-columns__three .wp-block-media-text.card, | ||
.editor-styles-wrapper :where(body .is-layout-flow) .card-columns__two .wp-block-group.card, | ||
.editor-styles-wrapper :where(body .is-layout-flow) .card-columns__three .wp-block-group.card { | ||
margin-top: 0; | ||
} | ||
|
||
/** | ||
* FontAwesome Include. ======================================================================= | ||
* | ||
* FontAwesome isn't available by default in the editor as it's part of the CLF stylesheet only | ||
* loaded in the editor. | ||
*/ | ||
@font-face { | ||
font-family: 'FontAwesome'; | ||
src: url('https://cdn.ubc.ca/clf/7.0.4/font/font-v4/fontawesome-webfont-ubc-v4.eot'); | ||
src: url('https://cdn.ubc.ca/clf/7.0.4/font/font-v4/fontawesome-webfont-ubc-v4.eot?#iefix') format('embedded-opentype'), url('https://cdn.ubc.ca/clf/7.0.4/font/font-v4/fontawesome-webfont-ubc-v4.ttf') format('truetype'), url('https://cdn.ubc.ca/clf/7.0.4/font/font-v4/fontawesome-webfont-ubc-v4.woff') format('woff'); | ||
font-weight: 400; | ||
font-style: normal; | ||
} | ||
|
||
/** | ||
* Gutenberg overrides. ============================================================================== | ||
* | ||
* The gutenberg plugin does some super interesting things. Primarily it decides to use a serif font | ||
* by default in the editor. Which is great. We don't want that. | ||
*/ | ||
:where(.editor-styles-wrapper) { | ||
font-family: "Whitney SSm A","Whitney SSm B",Arial,sans-serif; | ||
} | ||
|
||
/** | ||
* Just a little nicety. When we're using the hero, it already has a pull-up of 3em to counteract the | ||
* padding that is applied by the APSC Styleguide. This means, in the editor, it sits on top of the actual | ||
* page title. This is fine, as we use the title block anyway, but it kinda leaves a weird gap at the top | ||
* of the screen. It'll be a nicer experience if we but the hero block up to the top. Won't impact front-end. | ||
*/ | ||
.is-root-container.is-desktop-preview>.ubc-clf-full.apsc-hero { | ||
margin-top: 0 !important; | ||
} | ||
|
||
.is-root-container.is-desktop-preview > .ubc-clf-full.apsc-hero:first-child { | ||
margin-top: -7.1em !important; | ||
} | ||
|
||
/** | ||
* The Footer Graphic | ||
*/ | ||
@media (min-width: 640px) { | ||
.background--svg-feature { | ||
background-repeat: no-repeat; | ||
background-position: 100% 0%; | ||
background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 300' fill='none' style='&%2310;'%3e%3cg clip-path='url(%23clip0)'%3e%3cpath d='M134.438 398.059L227.179 299.55' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M74.5 228.5L206.211 81.587' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M227.078 299.65L206.11 81.6871' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M344.409 82.3232L206.211 81.5872' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M211 257.5L150.611 214.875' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M75 228.5L150.511 214.874' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M227.078 299.65L150.51 214.974' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M344.409 82.322L150.511 214.874' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.587L150.611 214.875' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M344.409 82.3218L128.764 -99.2982' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5869L128.864 -99.2971' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M344.409 82.3218L46.5 -28.5' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5869L85.98 -21.5161' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M150.511 214.874L47.5 -27' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M344.409 82.3218L124.489 -62.6292' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5869L124.59 -62.7281' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M150.511 214.874L124.489 -62.629' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5869L440.581 6.34091' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5869L449.449 -15.9931' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M150.511 214.874L322.776 447.171' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M227.078 299.65L160.059 435.451' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M150.511 214.874L207.5 233' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M74.5 228.5L208 298.5' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M227.078 299.65L181.717 361.112' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M206.211 81.5872L177 232.5' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3cpath d='M150.511 214.874L205.5 298.5' stroke='white' stroke-miterlimit='10' stroke-linecap='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath id='clip0'%3e%3crect width='207' height='354' fill='white' transform='translate(0 -25)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e"); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
/** | ||
* Adjustments for the Query Loop Card Pattern. | ||
*/ | ||
.wp-block-query.apsc-card-as-query-loop-template .card.wp-block-group a { | ||
color: inherit; | ||
display: inherit; | ||
font-size: inherit; | ||
opacity: inherit; | ||
} | ||
|
||
.wp-block-query.apsc-card-as-query-loop-template ul { | ||
list-style-type: none; | ||
} | ||
|
||
.wp-block-query.apsc-card-as-query-loop-template .card__subhead.wp-block-post-terms a, | ||
.wp-block-query.apsc-card-as-query-loop-template .wp-block-post-title a { | ||
text-decoration: none; | ||
} | ||
|
||
.wp-block-query.apsc-card-as-query-loop-template .card__tags a { | ||
background: #e6e6e6; | ||
font-size: .875rem; | ||
line-height: 1.25; | ||
margin: 0 !important; | ||
padding: .5rem 1rem; | ||
text-decoration: none; | ||
} | ||
|
||
.wp-block-query.apsc-card-as-query-loop-template .card__tags .wp-block-post-terms__separator { | ||
display: none; | ||
} | ||
|
||
/** | ||
* This is...weird. The Block editor itself does this. | ||
*/ | ||
body .is-layout-constrained.card > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { | ||
margin-left: 0 !important; | ||
margin-right: 0 !important; | ||
} | ||
|
||
/** | ||
* When the theme option is set to hide the address bar, a body class of 'apsc-hide-address-bar' is added. | ||
* We use that to hide the address bar and the 'to top' container. | ||
*/ | ||
body.apsc-hide-address-bar #ubc7-unit-footer, | ||
body.apsc-hide-address-bar #ubc7-footer .ubc7-back-to-top { | ||
display: none; | ||
} |
18 changes: 18 additions & 0 deletions
18
inc/blocks/cards/horizontal-image-right/horizontal-image-right.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
<!-- wp:media-text {"align":"wide","mediaPosition":"right","mediaId":1542,"mediaLink":"https://apsc-brand.sites.olt.ubc.ca/guidelines/graphic-devices/engineering-graphic-device-gradient/","mediaType":"image","className":"card card\u002d\u002dhoriz"} --> | ||
<div class="wp-block-media-text alignwide has-media-on-the-right is-stacked-on-mobile card card--horiz"> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Engineering</h3> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph --> | ||
<p>This card has some paragraph text description</p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
<figure class="wp-block-media-text__media"> | ||
<a href="https://apsc.share.ubc.ca/servicesresources/communications/BrandDownloads/Forms/Engineering.aspx"> | ||
<img src="https://apsc-brand.sites.olt.ubc.ca/files/2020/09/ENGINEERING-graphic-device-gradient.png" alt="Engineering graphic device over gradient" class="wp-image-1542 size-full"/> | ||
</a> | ||
</figure> | ||
</div> | ||
<!-- /wp:media-text --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Horizontal Image Right Card", | ||
"slug": "apsc-block-patterns/card-horizontal-image-right", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "Set up as a group of Media & Text blocks. The class card-rows is applied to the group, both the classes card card--horiz are applied to each Media & Text block, the card links are applied on the image. Cards are displayed horizontally with the image on the right. On smaller screens (<640px), cards revert to a vertical display with the image on top." | ||
} |
18 changes: 18 additions & 0 deletions
18
inc/blocks/cards/horizontal-img-left/horizontal-image-left.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
<!-- wp:media-text {"align":"wide","mediaId":1531,"mediaLink":"https://apsc-brand.sites.olt.ubc.ca/downloads-redev/apsc-graphic-device-gradient/","mediaType":"image","className":"card card\u002d\u002dhoriz"} --> | ||
<div class="wp-block-media-text alignwide is-stacked-on-mobile card card--horiz"> | ||
<figure class="wp-block-media-text__media"> | ||
<a href="https://apsc.share.ubc.ca/servicesresources/communications/BrandDownloads/Forms/PersonalViews.aspx?PageView=Personal&ShowWebPart={96F6C637-2EA2-4554-AABF-CFBC6A2ABF5B}"> | ||
<img src="https://apsc-brand.sites.olt.ubc.ca/files/2020/09/APSC-graphic-device-gradient.png" alt="APSC graphic device over gradient" class="wp-image-1531 size-full"/> | ||
</a> | ||
</figure> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Faculty</h3> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph --> | ||
<p></p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
</div> | ||
<!-- /wp:media-text --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Horizontal Image Left Card", | ||
"slug": "apsc-block-patterns/card-horizontal-image-left", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "Set up as a group of Media & Text blocks. The class card-rows is applied to the group, both the classes card card--horiz are applied to each Media & Text block, the card links are applied on the image. Cards are displayed horizontally with the image on the left. On smaller screens (<640px), cards revert to a vertical display with the image on top." | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
<!-- wp:media-text {"align":"wide","mediaId":1546,"mediaLink":"https://apsc-brand.sites.olt.ubc.ca/guidelines/graphic-devices/nursing-graphic-device-gradient/","mediaType":"image","className":"card"} --> | ||
<div class="wp-block-media-text alignwide is-stacked-on-mobile card"> | ||
<figure class="wp-block-media-text__media"> | ||
<a href="https://apsc.share.ubc.ca/servicesresources/communications/BrandDownloads/Forms/Nursing.aspx"> | ||
<img src="https://apsc-brand.sites.olt.ubc.ca/files/2020/09/NURSING-graphic-device-gradient.png" alt="Nursing graphic device over gradient background" class="wp-image-1546 size-full"/> | ||
</a> | ||
</figure> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Nursing Large</h3> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph --> | ||
<p>This card has some paragraph text description</p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
</div> | ||
<!-- /wp:media-text --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Large Card", | ||
"slug": "apsc-block-patterns/card-large", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "A single large card." | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
<!-- wp:media-text {"align":"wide","mediaId":1542,"mediaLink":"https://apsc-brand.sites.olt.ubc.ca/guidelines/graphic-devices/engineering-graphic-device-gradient/","mediaType":"image","className":"card card\u002d\u002dgray"} --> | ||
<div class="wp-block-media-text alignwide is-stacked-on-mobile card card--gray"> | ||
<figure class="wp-block-media-text__media"> | ||
<a href="https://apsc.share.ubc.ca/servicesresources/communications/BrandDownloads/Forms/Engineering.aspx"> | ||
<img src="https://apsc-brand.sites.olt.ubc.ca/files/2020/09/ENGINEERING-graphic-device-gradient.png" alt="Engineering graphic device over gradient" class="wp-image-1542 size-full"/> | ||
</a> | ||
</figure> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Engineering Light Grey</h3> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph --> | ||
<p>This card has some paragraph text description</p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
</div> | ||
<!-- /wp:media-text --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Light Grey Card", | ||
"slug": "apsc-block-patterns/card-light-grey", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "A single Light Grey Card" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,18 @@ | ||
<!-- wp:media-text {"align":"wide","mediaId":1531,"mediaLink":"https://apsc-brand.sites.olt.ubc.ca/downloads-redev/apsc-graphic-device-gradient/","mediaType":"image","className":"card"} --> | ||
<div class="wp-block-media-text alignwide is-stacked-on-mobile card"> | ||
<figure class="wp-block-media-text__media"> | ||
<a href="https://apsc.share.ubc.ca/servicesresources/communications/BrandDownloads/Forms/PersonalViews.aspx?PageView=Personal&ShowWebPart={96F6C637-2EA2-4554-AABF-CFBC6A2ABF5B}"> | ||
<img src="https://apsc-brand.sites.olt.ubc.ca/files/2020/09/APSC-graphic-device-gradient.png" alt="APSC graphic device over gradient" class="wp-image-1531 size-full"/> | ||
</a> | ||
</figure> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Faculty Medium</h3> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph --> | ||
<p>This card has some paragraph text description</p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
</div> | ||
<!-- /wp:media-text --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Medium Card", | ||
"slug": "apsc-block-patterns/card-medium", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "A single medium card." | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Text-Only Large Card", | ||
"slug": "apsc-block-patterns/text-only-card-large", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "Text-Only Large Card" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
<!-- wp:group {"className":"card "} --> | ||
<div class="wp-block-group card"> | ||
<!-- wp:heading {"level":3} --> | ||
<h3 class="wp-block-heading">Large content card</h3> | ||
<!-- /wp:heading --> | ||
|
||
<!-- wp:paragraph --> | ||
<p>This is an example of a large content card.</p> | ||
<!-- /wp:paragraph --> | ||
|
||
<!-- wp:paragraph --> | ||
<p><a href="#">The link</a></p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Text-Only Light Grey Card", | ||
"slug": "apsc-block-patterns/text-only-light-grey-medium", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "Text-Only Light Grey Card" | ||
} |
13 changes: 13 additions & 0 deletions
13
inc/blocks/cards/text-only-light-grey/text-only-light-grey.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
<!-- wp:group {"className":"card card\u002d\u002dgray "} --> | ||
<div class="wp-block-group card card--gray"><!-- wp:heading --> | ||
<h2 class="wp-block-heading">Light Gret Text Only Content card</h2> | ||
<!-- /wp:heading --> | ||
|
||
<!-- wp:paragraph --> | ||
<p>This is a H2 heading. The optional paragraph accompanying the heading.</p> | ||
<!-- /wp:paragraph --> | ||
|
||
<!-- wp:paragraph --> | ||
<p><a href="#">this is the link</a></p> | ||
<!-- /wp:paragraph --></div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "Text-Only Medium Card", | ||
"slug": "apsc-block-patterns/text-only-card-medium", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "Text-Only Medium Card" | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
<!-- wp:group {"className":"card "} --> | ||
<div class="wp-block-group card"><!-- wp:heading --> | ||
<h2 class="wp-block-heading">Text Onnly Light Grey Content card</h2> | ||
<!-- /wp:heading --> | ||
|
||
<!-- wp:paragraph --> | ||
<p>This is a H2 heading. The optional paragraph accompanying the heading.</p> | ||
<!-- /wp:paragraph --> | ||
|
||
<!-- wp:paragraph --> | ||
<p><a href="#">this is the link</a></p> | ||
<!-- /wp:paragraph --></div> | ||
<!-- /wp:group --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
{ | ||
"title": "v3 With Subtitle and Date", | ||
"slug": "apsc-block-patterns/card-with-subtitle-and-date", | ||
"categories": ["apsc-block-patterns"], | ||
"description": "A single card with subtitle and date." | ||
} |
26 changes: 26 additions & 0 deletions
26
inc/blocks/cards/v3-with-subtitle-and-date/v3-with-subtitle-and-date.php
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
<!-- wp:media-text {"mediaId":18866,"mediaLink":"https://apsc-collab-dev.sites.olt.ubc.ca/enve-1/","mediaType":"image","className":"card"} --> | ||
<div class="wp-block-media-text is-stacked-on-mobile card"> | ||
|
||
<figure class="wp-block-media-text__media"> | ||
<img src="https://apsc-collab-dev.sites.olt.ubc.ca/files/2023/05/ENVE-1-940x628.jpg" alt="Two people look at maps on the coast with the Vancouver skyline in the background." class="wp-image-18866 size-full"/> | ||
</figure> | ||
<div class="wp-block-media-text__content"> | ||
<!-- wp:paragraph {"placeholder":"Content…","className":"card__subhead"} --> | ||
<p class="card__subhead">UBC APPLIED SCIENCE</p> | ||
<!-- /wp:paragraph --> | ||
<!-- wp:heading --> | ||
<h2 class="wp-block-heading">Shaping tomorrow's cities</h2> | ||
<!-- /wp:heading --> | ||
<!-- wp:paragraph {"className":"card__body"} --> | ||
<p class="card__body">For the first time in human history, the majority of the world's population lives in cities. </p> | ||
<!-- /wp:paragraph --> | ||
<!-- wp:paragraph {"className":"card__footer"} --> | ||
<p class="card__footer">December 20, 2023</p> | ||
<!-- /wp:paragraph --> | ||
</div> | ||
</div> | ||
<!-- /wp:media-text --> |
Oops, something went wrong.