mirror of
https://github.com/WordPress/five-for-the-future.git
synced 2025-07-03 01:31:17 +03:00
Update styles
This commit is contained in:
Kelly Dwan
parent
6113ce0c7f
commit
bf7fdf7927
|
|
@ -23,6 +23,7 @@
|
|||
@import "archive";
|
||||
@import "entry-content";
|
||||
@import "page";
|
||||
@import "pledge-contributors";
|
||||
@import "pledge-list";
|
||||
@import "pledge-single";
|
||||
@import "site-content";
|
||||
|
|
|
|||
|
|
@ -8,8 +8,13 @@
|
|||
}
|
||||
|
||||
h2 {
|
||||
margin-top: ms(10);
|
||||
font-size: ms( 2 );
|
||||
font-weight: 400;
|
||||
color: $color__text-heading;
|
||||
}
|
||||
|
||||
> :first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
52
themes/wporg-5ftf/css/components/_pledge-contributors.scss
Normal file
52
themes/wporg-5ftf/css/components/_pledge-contributors.scss
Normal file
|
|
@ -0,0 +1,52 @@
|
|||
.pledge-contributors {
|
||||
|
||||
h3 {
|
||||
margin-top: 0;
|
||||
font-size: ms(-1);
|
||||
color: $color__text-lighter;
|
||||
}
|
||||
|
||||
.pledge-contributor__avatar {
|
||||
display: inline-block;
|
||||
background: $color-gray-light-700;
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
&.has-contrib-names {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
margin: ms(2) 0;
|
||||
list-style: none;
|
||||
justify-content: space-between;
|
||||
|
||||
li {
|
||||
margin: 0 auto 40px;
|
||||
width: calc( 50% - 20px );
|
||||
|
||||
@include breakpoint( $breakpoint-small ) {
|
||||
width: calc( 33% - 48px );
|
||||
min-width: 170px;
|
||||
}
|
||||
}
|
||||
|
||||
li:first-child:last-child {
|
||||
width: 100%;
|
||||
|
||||
a {
|
||||
max-width: 280px;
|
||||
}
|
||||
}
|
||||
|
||||
.pledge-contributor__avatar {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.pledge-contributor__name {
|
||||
display: block;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -45,7 +45,7 @@ body.archive.post-type-archive-5ftf_pledge {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.page-header-controls {
|
||||
font-size: ms(-2);
|
||||
|
||||
|
|
@ -78,4 +78,9 @@ body.archive.post-type-archive-5ftf_pledge {
|
|||
grid-row: 2;
|
||||
}
|
||||
}
|
||||
|
||||
.entry-title {
|
||||
font-size: ms(2);
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,4 +5,53 @@ body.single.single-5ftf_pledge {
|
|||
padding: 0 10px;
|
||||
max-width: $size__site-main;
|
||||
}
|
||||
|
||||
.entry-header {
|
||||
margin: ms(12) 0;
|
||||
padding-bottom: ms(4);
|
||||
border-bottom: 1px solid $color-gray-light-500;
|
||||
|
||||
@include breakpoint( $breakpoint-mobile ) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
> div {
|
||||
flex: auto;
|
||||
}
|
||||
|
||||
.entry-image {
|
||||
max-width: 330px;
|
||||
}
|
||||
}
|
||||
|
||||
@include breakpoint( 0, $breakpoint-mobile ) {
|
||||
text-align: center;
|
||||
|
||||
.entry-image {
|
||||
margin-top: ms(2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.entry-title {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.entry-image__logo {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.pledge-company-description {
|
||||
max-width: $size__content-width;
|
||||
}
|
||||
|
||||
.team-grid {
|
||||
margin-top: ms(2);
|
||||
}
|
||||
|
||||
.entry-footer {
|
||||
margin-top: ms(2);
|
||||
border-top: 1px solid $color-gray-light-500;
|
||||
padding-top: ms(2);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
padding: 0;
|
||||
|
||||
.site-main {
|
||||
margin: 0 auto;
|
||||
margin: 0 auto ms(8);
|
||||
padding: 0 ms( 2 );
|
||||
max-width: calc( #{ $size__content-width } + #{ ms( 2 ) * 2 } );
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
article.type-5ftf_pledge {
|
||||
/* Styles */
|
||||
|
||||
.entry-image__placeholder {
|
||||
background: $color-gray-light-100;
|
||||
|
|
@ -21,33 +20,16 @@ article.type-5ftf_pledge {
|
|||
}
|
||||
}
|
||||
|
||||
.entry-header a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.entry-title {
|
||||
margin-top: 0;
|
||||
font-size: ms(2);
|
||||
font-weight: 400;
|
||||
|
||||
a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.entry-content {
|
||||
font-size: ms(-1);
|
||||
color: $color__text-darker;
|
||||
}
|
||||
|
||||
.pledge-contributors h3 {
|
||||
margin-top: 0;
|
||||
font-size: ms(-1);
|
||||
color: $color__text-lighter;
|
||||
}
|
||||
|
||||
.pledge-contributor__avatar {
|
||||
display: inline-block;
|
||||
background: $color-gray-light-700;
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@ use WordPressDotOrg\FiveForTheFuture\Contributor;
|
|||
use WordPressDotOrg\FiveForTheFuture\XProfile;
|
||||
use WP_Post;
|
||||
|
||||
use const WordPressDotOrg\FiveForTheFuture\PledgeMeta\META_PREFIX;
|
||||
|
||||
$contribution_data = XProfile\get_aggregate_contributor_data_for_pledge( get_the_ID() );
|
||||
|
||||
$contributors = Contributor\get_contributor_user_objects(
|
||||
|
|
@ -22,13 +24,13 @@ get_header(); ?>
|
|||
|
||||
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
|
||||
<header class="entry-header">
|
||||
<div class="">
|
||||
<?php the_title( '<h2 class="entry-title">', '</h2>' ); ?>
|
||||
<span>
|
||||
<div>
|
||||
<?php the_title( '<h1 class="entry-title">', '</h1>' ); ?>
|
||||
<span class="pledge-url">
|
||||
<?php
|
||||
printf(
|
||||
'<a href="%1$s">%1$s</a>',
|
||||
esc_url( $post->{'5ftf_org-url'} )
|
||||
esc_url( $post->{ META_PREFIX . 'org-url' } )
|
||||
);
|
||||
?>
|
||||
</span>
|
||||
|
|
@ -45,12 +47,14 @@ get_header(); ?>
|
|||
</header>
|
||||
|
||||
<div class="entry-content">
|
||||
<h3><?php esc_html_e( 'About', 'wporg' ); ?></h3>
|
||||
<h2><?php esc_html_e( 'About', 'wporg' ); ?></h2>
|
||||
|
||||
<?php echo wp_kses_post( wpautop( $post->{'5ftf_org-description'} ) ); ?>
|
||||
<div class="pledge-company-description">
|
||||
<?php echo wp_kses_post( wpautop( $post->{ META_PREFIX . 'org-description' } ) ); ?>
|
||||
</div>
|
||||
|
||||
<?php if ( ! empty( $contributors ) ) : ?>
|
||||
<h3><?php esc_html_e( 'Contributions', 'wporg' ); ?></h3>
|
||||
<h2><?php esc_html_e( 'Contributions', 'wporg' ); ?></h2>
|
||||
|
||||
<p>
|
||||
<?php
|
||||
|
|
@ -85,16 +89,18 @@ get_header(); ?>
|
|||
</ul>
|
||||
<?php endif; ?>
|
||||
|
||||
<h3><?php esc_html_e( 'Contributors', 'wporg' ); ?></h3>
|
||||
<h2><?php esc_html_e( 'Contributors', 'wporg' ); ?></h2>
|
||||
|
||||
<?php if ( ! empty( $contributors ) ) : ?>
|
||||
<ul class="contributor-grid">
|
||||
<ul class="pledge-contributors has-contrib-names">
|
||||
<?php foreach ( $contributors as $contributor ) : ?>
|
||||
<li>
|
||||
<?php echo get_avatar( $contributor->user_email, 280 ); ?>
|
||||
<li class="pledge-contributor">
|
||||
<span class="pledge-contributor__avatar">
|
||||
<?php echo get_avatar( $contributor->user_email, 280 ); ?>
|
||||
</span>
|
||||
<?php
|
||||
printf(
|
||||
'<a href="%1$s">%2$s</a>',
|
||||
'<a class="pledge-contributor__name" href="%1$s">%2$s</a>',
|
||||
sprintf(
|
||||
'https://profiles.wordpress.org/%s/',
|
||||
sanitize_key( $contributor->user_login ) // phpcs:ignore WordPress.Security.EscapeOutput -- sanitize_key will catch any security issues.
|
||||
|
|
|
|||
Loading…
Reference in a new issue