diff --git a/plugins/wporg-5ftf/assets/css/front-end.css b/plugins/wporg-5ftf/assets/css/front-end.css deleted file mode 100755 index 9e8cc01..0000000 --- a/plugins/wporg-5ftf/assets/css/front-end.css +++ /dev/null @@ -1,21 +0,0 @@ -/* copy homepage styles except those trendy fixed bg images */ - -.fftf-sorting-indicator { - visibility: hidden; -} - -.fftf-sorted-ascending .fftf-sorting-indicator, -.fftf-sorted-descending .fftf-sorting-indicator, -.fftf-companies th:hover .fftf-sorting-indicator { - visibility: visible; - font: normal 20px/1 dashicons; -} - -.fftf-sorting-indicator::before, -.fftf-sorted-ascending .fftf-sorting-indicator::before { - content: "\f142"; -} - -.fftf-sorted-descending .fftf-sorting-indicator::before { - content: "\f140"; -} diff --git a/plugins/wporg-5ftf/assets/js/blocks.js b/plugins/wporg-5ftf/assets/js/blocks.js deleted file mode 100755 index 70b786d..0000000 --- a/plugins/wporg-5ftf/assets/js/blocks.js +++ /dev/null @@ -1 +0,0 @@ -// TODO diff --git a/plugins/wporg-5ftf/assets/js/front-end.js b/plugins/wporg-5ftf/assets/js/front-end.js deleted file mode 100755 index dbe58c1..0000000 --- a/plugins/wporg-5ftf/assets/js/front-end.js +++ /dev/null @@ -1,65 +0,0 @@ -window.wp = window.wp || {}; - -jQuery( function( $ ) { - 'use strict'; - - var allCompanies = window.fiveFutureCompanies || {}, - sortOrder = 'ascending'; - - var app = window.wp.FiveForTheFuture = { - // jsdoc - init: function() { - app.renderTemplate( allCompanies ); - - $( '#5ftf-search' ).keyup( app.searchCompanies ); - // works on keyup but not change. isn't change better? - $( '.fftf-sorting-indicator' ).click( app.orderCompanies ); - }, - - // - renderTemplate: function( companies ) { - var $container = $( '#5ftf-companies-body' ), - template = wp.template( '5ftf-companies' ); - - $container.html( template( companies ) ); - }, - - // - searchCompanies: function( event ) { - var matches = $.extend( true, [], allCompanies ), - query = $( event.target ).val().toLowerCase(); - - matches = _.filter( matches, function( company ) { - return -1 !== company.name.toLowerCase().indexOf( query ); - } ); - - app.renderTemplate( matches ); - }, - - // - orderCompanies: function( event ) { - var $activeSortButton = $( event.target ), - $activeSortColumn = $activeSortButton.parent( 'th' ), - $sortColumns = $( '.fftf-sorting-indicator' ); - - allCompanies = _.sortBy( allCompanies, $activeSortButton.data( 'field' ) ); - - $sortColumns.removeClass( 'fftf-sorted-ascending' ); - $sortColumns.removeClass( 'fftf-sorted-descending' ); - - if ( 'ascending' === sortOrder ) { - sortOrder = 'descending'; - allCompanies = allCompanies.reverse(); - - $activeSortColumn.addClass( 'fftf-sorted-descending' ); - } else { - sortOrder = 'ascending'; - $activeSortColumn.addClass( 'fftf-sorted-ascending' ); - } - - app.renderTemplate( allCompanies ); - } - }; - - app.init(); -} ); diff --git a/plugins/wporg-5ftf/includes/directory.php b/plugins/wporg-5ftf/includes/directory.php deleted file mode 100755 index d35ee70..0000000 --- a/plugins/wporg-5ftf/includes/directory.php +++ /dev/null @@ -1,107 +0,0 @@ -post_content, 'five_for_the_future_companies' ) ) { - return; - } - - $params = array( - /* - * todo explain 100 is just sanity limit to keep page size performant. might need to lazy-load more in the - * future. - * maybe order by donated_employees, or rand, to ensure the top companies are always displayed first, or - * to make sure treat everyone equal. - */ - 'post_type' => Pledge\CPT_ID, - 'post_status' => 'publish', - 'posts_per_page' => 100, - 'orderby' => 'title', - 'order' => 'ASC', - ); - - $companies = get_posts( $params ); - - foreach ( $companies as $key => $company ) { - $teams = get_post_meta( $company->ID, '_5ftf_teams', false ); - - $companies[ $key ] = array( - 'name' => $company->post_title, - 'url' => $company->_5ftf_url, - 'total_employees' => $company->_5ftf_total_employees, - 'sponsored_employees' => $company->_5ftf_sponsored_employees, - 'hours_per_week' => $company->_5ftf_hours_per_week, - 'teams_contributing_to' => implode( ', ', $teams ), - ); - } - - $inline_script = sprintf( - 'var fiveFutureCompanies = JSON.parse( decodeURIComponent( \'%s\' ) );', - rawurlencode( wp_json_encode( $companies ) ) - ); - - wp_enqueue_style( '5ftf-front-end' ); - wp_enqueue_script( '5ftf-list' ); - wp_add_inline_script( '5ftf-list', $inline_script ); -} -add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\enqueue_scripts' ); - -/** - * Todo. - * - * @return string - */ -function render_shortcode() { - // The limit is just a sanity check, but ideally all should be displayed. - // If this is reached, then refactor the page to lazy-load, etc. - - ob_start(); - require_once dirname( __DIR__ ) . '/views/front-end.php'; - return ob_get_clean(); -} - -add_shortcode( 'five_for_the_future_companies', __NAMESPACE__ . '\render_shortcode' ); - -// todo shortcode for pledge form. -// todo form handler for pledge form. - -/** - * Todo. - */ -function register() { - //register_block_type(); -} - -add_action( 'init', __NAMESPACE__ . '\register' ); diff --git a/plugins/wporg-5ftf/index.php b/plugins/wporg-5ftf/index.php index be8c836..ec9ace2 100755 --- a/plugins/wporg-5ftf/index.php +++ b/plugins/wporg-5ftf/index.php @@ -28,7 +28,6 @@ function load() { require_once get_includes_path() . 'pledge.php'; require_once get_includes_path() . 'pledge-meta.php'; require_once get_includes_path() . 'pledge-form.php'; - require_once get_includes_path() . 'directory.php'; require_once get_includes_path() . 'xprofile.php'; require_once get_includes_path() . 'pledge-log.php'; } diff --git a/themes/pub/__MACOSX/._wporg b/themes/pub/__MACOSX/._wporg new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/._wporg differ diff --git a/themes/pub/__MACOSX/wporg/._.jshintignore b/themes/pub/__MACOSX/wporg/._.jshintignore new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._.jshintignore differ diff --git a/themes/pub/__MACOSX/wporg/._.jshintrc b/themes/pub/__MACOSX/wporg/._.jshintrc new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._.jshintrc differ diff --git a/themes/pub/__MACOSX/wporg/._404.php b/themes/pub/__MACOSX/wporg/._404.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._404.php differ diff --git a/themes/pub/__MACOSX/wporg/._Gruntfile.js b/themes/pub/__MACOSX/wporg/._Gruntfile.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._Gruntfile.js differ diff --git a/themes/pub/__MACOSX/wporg/._README.md b/themes/pub/__MACOSX/wporg/._README.md new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._README.md differ diff --git a/themes/pub/__MACOSX/wporg/._archive.php b/themes/pub/__MACOSX/wporg/._archive.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._archive.php differ diff --git a/themes/pub/__MACOSX/wporg/._bin b/themes/pub/__MACOSX/wporg/._bin new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._bin differ diff --git a/themes/pub/__MACOSX/wporg/._comments.php b/themes/pub/__MACOSX/wporg/._comments.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._comments.php differ diff --git a/themes/pub/__MACOSX/wporg/._css b/themes/pub/__MACOSX/wporg/._css new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._css differ diff --git a/themes/pub/__MACOSX/wporg/._footer-wporg.php b/themes/pub/__MACOSX/wporg/._footer-wporg.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._footer-wporg.php differ diff --git a/themes/pub/__MACOSX/wporg/._footer.php b/themes/pub/__MACOSX/wporg/._footer.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._footer.php differ diff --git a/themes/pub/__MACOSX/wporg/._functions.php b/themes/pub/__MACOSX/wporg/._functions.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._functions.php differ diff --git a/themes/pub/__MACOSX/wporg/._header-page.php b/themes/pub/__MACOSX/wporg/._header-page.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._header-page.php differ diff --git a/themes/pub/__MACOSX/wporg/._header-wporg.php b/themes/pub/__MACOSX/wporg/._header-wporg.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._header-wporg.php differ diff --git a/themes/pub/__MACOSX/wporg/._header.php b/themes/pub/__MACOSX/wporg/._header.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._header.php differ diff --git a/themes/pub/__MACOSX/wporg/._images b/themes/pub/__MACOSX/wporg/._images new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._images differ diff --git a/themes/pub/__MACOSX/wporg/._inc b/themes/pub/__MACOSX/wporg/._inc new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._inc differ diff --git a/themes/pub/__MACOSX/wporg/._index.php b/themes/pub/__MACOSX/wporg/._index.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._index.php differ diff --git a/themes/pub/__MACOSX/wporg/._js b/themes/pub/__MACOSX/wporg/._js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._js differ diff --git a/themes/pub/__MACOSX/wporg/._package.json b/themes/pub/__MACOSX/wporg/._package.json new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._package.json differ diff --git a/themes/pub/__MACOSX/wporg/._page.php b/themes/pub/__MACOSX/wporg/._page.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._page.php differ diff --git a/themes/pub/__MACOSX/wporg/._search.php b/themes/pub/__MACOSX/wporg/._search.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._search.php differ diff --git a/themes/pub/__MACOSX/wporg/._sidebar.php b/themes/pub/__MACOSX/wporg/._sidebar.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._sidebar.php differ diff --git a/themes/pub/__MACOSX/wporg/._single.php b/themes/pub/__MACOSX/wporg/._single.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._single.php differ diff --git a/themes/pub/__MACOSX/wporg/._style.css b/themes/pub/__MACOSX/wporg/._style.css new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._style.css differ diff --git a/themes/pub/__MACOSX/wporg/._template-parts b/themes/pub/__MACOSX/wporg/._template-parts new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/._template-parts differ diff --git a/themes/pub/__MACOSX/wporg/bin/._build.php b/themes/pub/__MACOSX/wporg/bin/._build.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/bin/._build.php differ diff --git a/themes/pub/__MACOSX/wporg/css/._base b/themes/pub/__MACOSX/wporg/css/._base new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._base differ diff --git a/themes/pub/__MACOSX/wporg/css/._components b/themes/pub/__MACOSX/wporg/css/._components new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._components differ diff --git a/themes/pub/__MACOSX/wporg/css/._generic b/themes/pub/__MACOSX/wporg/css/._generic new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._generic differ diff --git a/themes/pub/__MACOSX/wporg/css/._objects b/themes/pub/__MACOSX/wporg/css/._objects new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._objects differ diff --git a/themes/pub/__MACOSX/wporg/css/._settings b/themes/pub/__MACOSX/wporg/css/._settings new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._settings differ diff --git a/themes/pub/__MACOSX/wporg/css/._style.scss b/themes/pub/__MACOSX/wporg/css/._style.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._style.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/._tools b/themes/pub/__MACOSX/wporg/css/._tools new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._tools differ diff --git a/themes/pub/__MACOSX/wporg/css/._trumps b/themes/pub/__MACOSX/wporg/css/._trumps new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/._trumps differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__base.scss b/themes/pub/__MACOSX/wporg/css/base/.__base.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__base.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__copy.scss b/themes/pub/__MACOSX/wporg/css/base/.__copy.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__copy.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__elements.scss b/themes/pub/__MACOSX/wporg/css/base/.__elements.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__elements.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__headings.scss b/themes/pub/__MACOSX/wporg/css/base/.__headings.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__headings.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__links.scss b/themes/pub/__MACOSX/wporg/css/base/.__links.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__links.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__lists.scss b/themes/pub/__MACOSX/wporg/css/base/.__lists.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__lists.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__tables.scss b/themes/pub/__MACOSX/wporg/css/base/.__tables.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__tables.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/base/.__typography.scss b/themes/pub/__MACOSX/wporg/css/base/.__typography.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/base/.__typography.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__404.scss b/themes/pub/__MACOSX/wporg/css/components/.__404.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__404.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__comments.scss b/themes/pub/__MACOSX/wporg/css/components/.__comments.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__comments.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__components.scss b/themes/pub/__MACOSX/wporg/css/components/.__components.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__components.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__entry-content.scss b/themes/pub/__MACOSX/wporg/css/components/.__entry-content.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__entry-content.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__entry-header.scss b/themes/pub/__MACOSX/wporg/css/components/.__entry-header.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__entry-header.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__entry-meta.scss b/themes/pub/__MACOSX/wporg/css/components/.__entry-meta.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__entry-meta.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__entry-summary.scss b/themes/pub/__MACOSX/wporg/css/components/.__entry-summary.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__entry-summary.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__entry.scss b/themes/pub/__MACOSX/wporg/css/components/.__entry.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__entry.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__gallery.scss b/themes/pub/__MACOSX/wporg/css/components/.__gallery.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__gallery.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__main-navigation.scss b/themes/pub/__MACOSX/wporg/css/components/.__main-navigation.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__main-navigation.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__page.scss b/themes/pub/__MACOSX/wporg/css/components/.__page.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__page.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__post-navigation.scss b/themes/pub/__MACOSX/wporg/css/components/.__post-navigation.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__post-navigation.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__posts-navigation.scss b/themes/pub/__MACOSX/wporg/css/components/.__posts-navigation.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__posts-navigation.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__search-form.scss b/themes/pub/__MACOSX/wporg/css/components/.__search-form.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__search-form.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__search.scss b/themes/pub/__MACOSX/wporg/css/components/.__search.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__search.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__site-content.scss b/themes/pub/__MACOSX/wporg/css/components/.__site-content.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__site-content.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__site-description.scss b/themes/pub/__MACOSX/wporg/css/components/.__site-description.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__site-description.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__site-header.scss b/themes/pub/__MACOSX/wporg/css/components/.__site-header.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__site-header.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__site-title.scss b/themes/pub/__MACOSX/wporg/css/components/.__site-title.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__site-title.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__widget-area.scss b/themes/pub/__MACOSX/wporg/css/components/.__widget-area.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__widget-area.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__wporg-footer.scss b/themes/pub/__MACOSX/wporg/css/components/.__wporg-footer.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__wporg-footer.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/components/.__wporg-header.scss b/themes/pub/__MACOSX/wporg/css/components/.__wporg-header.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/components/.__wporg-header.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/generic/.__generic.scss b/themes/pub/__MACOSX/wporg/css/generic/.__generic.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/generic/.__generic.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/generic/.__kube.scss b/themes/pub/__MACOSX/wporg/css/generic/.__kube.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/generic/.__kube.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/generic/.__normalize.scss b/themes/pub/__MACOSX/wporg/css/generic/.__normalize.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/generic/.__normalize.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__accessibility.scss b/themes/pub/__MACOSX/wporg/css/objects/.__accessibility.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__accessibility.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__alignments.scss b/themes/pub/__MACOSX/wporg/css/objects/.__alignments.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__alignments.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__buttons.scss b/themes/pub/__MACOSX/wporg/css/objects/.__buttons.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__buttons.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__clearings.scss b/themes/pub/__MACOSX/wporg/css/objects/.__clearings.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__clearings.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__copy.scss b/themes/pub/__MACOSX/wporg/css/objects/.__copy.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__copy.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__inputs.scss b/themes/pub/__MACOSX/wporg/css/objects/.__inputs.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__inputs.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__links.scss b/themes/pub/__MACOSX/wporg/css/objects/.__links.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__links.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__notices.scss b/themes/pub/__MACOSX/wporg/css/objects/.__notices.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__notices.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/objects/.__objects.scss b/themes/pub/__MACOSX/wporg/css/objects/.__objects.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/objects/.__objects.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/settings/.__colors.scss b/themes/pub/__MACOSX/wporg/css/settings/.__colors.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/settings/.__colors.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/settings/.__modular-scale.scss b/themes/pub/__MACOSX/wporg/css/settings/.__modular-scale.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/settings/.__modular-scale.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/settings/.__settings.scss b/themes/pub/__MACOSX/wporg/css/settings/.__settings.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/settings/.__settings.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/settings/.__structure.scss b/themes/pub/__MACOSX/wporg/css/settings/.__structure.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/settings/.__structure.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/settings/.__typography.scss b/themes/pub/__MACOSX/wporg/css/settings/.__typography.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/settings/.__typography.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/tools/.__breakpoint.scss b/themes/pub/__MACOSX/wporg/css/tools/.__breakpoint.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/tools/.__breakpoint.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/tools/.__kube.scss b/themes/pub/__MACOSX/wporg/css/tools/.__kube.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/tools/.__kube.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/tools/.__modular-scale.scss b/themes/pub/__MACOSX/wporg/css/tools/.__modular-scale.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/tools/.__modular-scale.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/tools/.__tools.scss b/themes/pub/__MACOSX/wporg/css/tools/.__tools.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/tools/.__tools.scss differ diff --git a/themes/pub/__MACOSX/wporg/css/trumps/.__trumps.scss b/themes/pub/__MACOSX/wporg/css/trumps/.__trumps.scss new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/css/trumps/.__trumps.scss differ diff --git a/themes/pub/__MACOSX/wporg/images/._wp-logo-blue-trans-blur.png b/themes/pub/__MACOSX/wporg/images/._wp-logo-blue-trans-blur.png new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/images/._wp-logo-blue-trans-blur.png differ diff --git a/themes/pub/__MACOSX/wporg/images/._wp-logo-blue.png b/themes/pub/__MACOSX/wporg/images/._wp-logo-blue.png new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/images/._wp-logo-blue.png differ diff --git a/themes/pub/__MACOSX/wporg/inc/._footer.php b/themes/pub/__MACOSX/wporg/inc/._footer.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/inc/._footer.php differ diff --git a/themes/pub/__MACOSX/wporg/inc/._header.php b/themes/pub/__MACOSX/wporg/inc/._header.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/inc/._header.php differ diff --git a/themes/pub/__MACOSX/wporg/inc/._template-tags.php b/themes/pub/__MACOSX/wporg/inc/._template-tags.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/inc/._template-tags.php differ diff --git a/themes/pub/__MACOSX/wporg/js/._customizer.js b/themes/pub/__MACOSX/wporg/js/._customizer.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/js/._customizer.js differ diff --git a/themes/pub/__MACOSX/wporg/js/._navigation.js b/themes/pub/__MACOSX/wporg/js/._navigation.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/js/._navigation.js differ diff --git a/themes/pub/__MACOSX/wporg/js/._navigation.min.js b/themes/pub/__MACOSX/wporg/js/._navigation.min.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/js/._navigation.min.js differ diff --git a/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.js b/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.js differ diff --git a/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.min.js b/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.min.js new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/js/._skip-link-focus-fix.min.js differ diff --git a/themes/pub/__MACOSX/wporg/template-parts/._content-none.php b/themes/pub/__MACOSX/wporg/template-parts/._content-none.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/template-parts/._content-none.php differ diff --git a/themes/pub/__MACOSX/wporg/template-parts/._content-page.php b/themes/pub/__MACOSX/wporg/template-parts/._content-page.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/template-parts/._content-page.php differ diff --git a/themes/pub/__MACOSX/wporg/template-parts/._content.php b/themes/pub/__MACOSX/wporg/template-parts/._content.php new file mode 100644 index 0000000..1f000d3 Binary files /dev/null and b/themes/pub/__MACOSX/wporg/template-parts/._content.php differ diff --git a/themes/pub/wporg.zip b/themes/pub/wporg.zip new file mode 100644 index 0000000..8fe4b2f Binary files /dev/null and b/themes/pub/wporg.zip differ diff --git a/themes/pub/wporg/.jshintignore b/themes/pub/wporg/.jshintignore new file mode 100644 index 0000000..54162f6 --- /dev/null +++ b/themes/pub/wporg/.jshintignore @@ -0,0 +1 @@ +js/**.min.js \ No newline at end of file diff --git a/themes/pub/wporg/.jshintrc b/themes/pub/wporg/.jshintrc new file mode 100644 index 0000000..95af6dc --- /dev/null +++ b/themes/pub/wporg/.jshintrc @@ -0,0 +1,25 @@ +{ + "boss": true, + "curly": true, + "eqeqeq": true, + "eqnull": true, + "esversion": 6, + "expr": true, + "immed": true, + "noarg": true, + "nonbsp": true, + "onevar": true, + "quotmark": "single", + "trailing": true, + "undef": true, + "unused": true, + "browser": true, + "globals": { + "_": false, + "Backbone": false, + "jQuery": false, + "JSON": false, + "pagenow": false, + "wp": false + } +} diff --git a/themes/pub/wporg/404.php b/themes/pub/wporg/404.php new file mode 100644 index 0000000..b9a528a --- /dev/null +++ b/themes/pub/wporg/404.php @@ -0,0 +1,49 @@ + + +
+ +
+
+

+
+ +
+

+ home page.', 'wporg' ), // phpcs:ignore WordPress.XSS.EscapeOutput.OutputNotEscaped + esc_url( get_home_url() ) + ); + ?> +

+ +
+ + +
+
+
+ +
+ + + += 2.1', + 'Chrome >= 21', + 'Edge >= 12', + 'Explorer >= 7', + 'Firefox >= 17', + 'Opera >= 12.1', + 'Safari >= 6.0' + ], + cascade: false + } ), + require( 'pixrem' ), + require('cssnano')({ + mergeRules: false + }) + ] + }, + dist: { + src: 'css/style.css' + } + }, + jshint: { + files: [ 'Gruntfile.js', 'js/**/*.js' ], + options: grunt.file.readJSON( '.jshintrc' ) + }, + uglify: { + options: { + ASCIIOnly: true, + screwIE8: false + }, + js: { + expand: true, + cwd: 'js/', + dest: 'js/', + ext: '.min.js', + src: '**/*.js', + } + }, + sass: { + options: { + implementation: require( 'node-sass' ), + sourceMap: true, + // Don't add source map URL in built version. + omitSourceMapUrl: 'build' === process.argv[2], + outputStyle: 'expanded' + }, + dist: { + files: { + 'css/style.css': 'css/style.scss' + } + } + }, + sass_globbing: { + itcss: { + files: (function() { + var files = {}; + + ['settings', 'tools', 'generic', 'base', 'objects', 'components', 'trumps'].forEach( function( component ) { + var paths = [ '../wporg/css/' + component + '/**/*.scss', '!../wporg/css/' + component + '/_' + component + '.scss' ]; + + if ( isChild ) { + paths.push( 'css/' + component + '/**/*.scss' ); + paths.push( '!css/' + component + '/_' + component + '.scss' ); + } + + files[ 'css/' + component + '/_' + component + '.scss' ] = paths; + } ); + + return files; + })() + }, + options: { signature: false } + }, + rtlcss: { + options: { + // rtlcss options. + opts: { + clean: false, + processUrls: { atrule: true, decl: false }, + stringMap: [ + { + name: 'import-rtl-stylesheet', + priority: 10, + exclusive: true, + search: [ '.css' ], + replace: [ '-rtl.css' ], + options: { + scope: 'url', + ignoreCase: false + } + } // phpcs:ignore Generic.WhiteSpace.ScopeIndent.IncorrectExact + ] + }, + saveUnmodified: false, + plugins: [ + { + name: 'swap-dashicons-left-right-arrows', + priority: 10, + directives: { + control: {}, + value: [] + }, + processors: [ + { + expr: /content/im, + action: function( prop, value ) { + if ( value === '"\\f141"' ) { // dashicons-arrow-left. + value = '"\\f139"'; + } else if ( value === '"\\f340"' ) { // dashicons-arrow-left-alt. + value = '"\\f344"'; + } else if ( value === '"\\f341"' ) { // dashicons-arrow-left-alt2. + value = '"\\f345"'; + } else if ( value === '"\\f139"' ) { // dashicons-arrow-right. + value = '"\\f141"'; + } else if ( value === '"\\f344"' ) { // dashicons-arrow-right-alt. + value = '"\\f340"'; + } else if ( value === '"\\f345"' ) { // dashicons-arrow-right-alt2. + value = '"\\f341"'; + } + return { prop: prop, value: value }; + } + } // phpcs:ignore Generic.WhiteSpace.ScopeIndent.IncorrectExact + ] + } // phpcs:ignore Generic.WhiteSpace.ScopeIndent.IncorrectExact + ] + }, + dynamic: { + expand: true, + cwd: 'css/', + dest: 'css/', + ext: '-rtl.css', + src: ['**/style.css'] + } + }, + watch: { + jshint: { + files: ['<%= jshint.files %>'], + tasks: ['jshint'] + }, + css: { + files: ['**/*.scss'], + tasks: ['css'] + } + } + }); + + if ( 'build' === process.argv[2] ) { + grunt.config.merge( { postcss: { options : { processors: [ require( 'cssnano' ) ] } } } ); + } + + grunt.loadNpmTasks( 'grunt-sass' ); + grunt.loadNpmTasks( 'grunt-rtlcss' ); + grunt.loadNpmTasks( 'grunt-postcss' ); + grunt.loadNpmTasks( 'grunt-sass-globbing' ); + grunt.loadNpmTasks( 'grunt-contrib-watch' ); + grunt.loadNpmTasks( 'grunt-contrib-jshint' ); + grunt.loadNpmTasks( 'grunt-contrib-uglify' ); + + grunt.registerTask( 'css', ['sass_globbing', 'sass', 'postcss', 'rtlcss:dynamic'] ); + grunt.registerTask( 'default', ['jshint', 'css'] ); + grunt.registerTask( 'build', ['css', 'uglify:js'] ); +}; diff --git a/themes/pub/wporg/README.md b/themes/pub/wporg/README.md new file mode 100644 index 0000000..8c6db85 --- /dev/null +++ b/themes/pub/wporg/README.md @@ -0,0 +1,31 @@ +### WordPress.org + +This Theme serves as a parent theme for all themes used on WordPress.org. +The idea is to collect commonly used styles and components here, for all child themes to use. + +#### Getting Started + +1. Create a child theme and specify `wporg` as the template for it. +1. Copy `package.json`, `Gruntfile.js`, `.jshinignore`, and `.jshintrc` into your child theme. +1. Replace project-specific information in `package.json`. +1. Run `npm install` (this can take a little while). +1. Run `grunt css` to create the CSS folder structure. +1. Copy `css/style.scss` into your child theme. + +Running `grunt watch` or `grunt css` now will pull in all Sass files from parent and child theme. + +#### Developing + +``` +grunt watch +``` +Watches JavaScript and Sass files for changes to run linters and builds Sass, etc. + +#### Committing + +Before committing changes, please create a build version to keep the file size down. + +``` +grunt build +svn ci +``` diff --git a/themes/pub/wporg/archive.php b/themes/pub/wporg/archive.php new file mode 100644 index 0000000..599a745 --- /dev/null +++ b/themes/pub/wporg/archive.php @@ -0,0 +1,46 @@ + + +
+ + + +
+ ', '' ); + the_archive_description( '
', '
' ); + ?> +
+ + + +
+ + + +
+ + +

+ ' . get_the_title() . '' + ); + } else { + printf( // WPCS: XSS OK. + /* translators: 1: comment count number, 2: title. */ + esc_html( _nx( '%1$s thought on “%2$s”', '%1$s thoughts on “%2$s”', $comment_count, 'comments title', 'wporg' ) ), + number_format_i18n( $comment_count ), + '' . get_the_title() . '' + ); + } + ?> +

+ + + +
    + 'ol', + 'short_ping' => true, + ) ); + ?> +
+ + +

+ 'button button-secondary button-large', + ) ); + ?> + +
diff --git a/themes/pub/wporg/css/base/_base.scss b/themes/pub/wporg/css/base/_base.scss new file mode 100644 index 0000000..3001373 --- /dev/null +++ b/themes/pub/wporg/css/base/_base.scss @@ -0,0 +1,7 @@ +@import "copy"; +@import "elements"; +@import "headings"; +@import "links"; +@import "lists"; +@import "tables"; +@import "typography"; diff --git a/themes/pub/wporg/css/base/_copy.scss b/themes/pub/wporg/css/base/_copy.scss new file mode 100644 index 0000000..1dbe04a --- /dev/null +++ b/themes/pub/wporg/css/base/_copy.scss @@ -0,0 +1,45 @@ +p { + margin: 1rem 0; +} + +dfn, cite, em, i { + font-style: italic; +} + +blockquote { + margin: 0 1.5rem; +} + +address { + margin: 0 0 1.5rem; +} + +pre { + background: #eee; + font-family: "Courier 10 Pitch", Courier, monospace; + font-size: 0.9375rem; + line-height: 1.6; + margin-bottom: 1.6rem; + max-width: 100%; + overflow: auto; + padding: 1.6rem; +} + +code, kbd, tt, var { + font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; + font-size: 0.9375rem; +} + +abbr, acronym { + border-bottom: 1px dotted #666; + cursor: help; +} + +mark, ins { + background: #fff9c0; + text-decoration: none; +} + +big { + font-size: 125%; +} diff --git a/themes/pub/wporg/css/base/_elements.scss b/themes/pub/wporg/css/base/_elements.scss new file mode 100644 index 0000000..63733c1 --- /dev/null +++ b/themes/pub/wporg/css/base/_elements.scss @@ -0,0 +1,50 @@ +html { + box-sizing: border-box; +} + +*, +*:before, +*:after { /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */ + box-sizing: inherit; +} + +body { + background: #fff; /* Fallback for when there is no custom background color defined. */ +} + +blockquote, q { + quotes: "" ""; + + &:before, + &:after { + content: ""; + } +} + +blockquote { + border-left: 2px solid #eee; + color: #82878c; + font-style: italic; + margin: 1rem 0; + padding-left: 1rem; + + cite { + font-size: ms( -2 ); + } +} + +figure { + margin: 0; +} + +hr { + background-color: #eee; + border: 0; + height: 2px; + margin: 5rem auto; +} + +img { + height: auto; /* Make sure images are scaled correctly. */ + max-width: 100%; /* Adhere to container width. */ +} diff --git a/themes/pub/wporg/css/base/_headings.scss b/themes/pub/wporg/css/base/_headings.scss new file mode 100644 index 0000000..cd43b2b --- /dev/null +++ b/themes/pub/wporg/css/base/_headings.scss @@ -0,0 +1,41 @@ +h1, h2, h3, h4, h5, h6 { + clear: both; + line-height: $type__lineheight; + margin: 2rem 0 1rem; +} + +h1 { + font-size: ms( 12 ); + font-weight: 300; +} + +h2 { + font-size: ms( 8 ); + font-weight: 300; +} + +h3 { + font-size: ms( 4 ); + font-weight: 400; +} + +h4 { + font-size: ms( 2 ); + color: $color__base-gray; + font-weight: 600; + padding: 0; +} + +h5 { + font-size: ms( 0 ); + font-weight: 600; + letter-spacing: 0.01rem; + text-transform: uppercase; +} + +h6 { + font-size: ms( -2 ); + font-weight: 600; + letter-spacing: 0.8px; + text-transform: uppercase; +} diff --git a/themes/pub/wporg/css/base/_links.scss b/themes/pub/wporg/css/base/_links.scss new file mode 100644 index 0000000..e29bf71 --- /dev/null +++ b/themes/pub/wporg/css/base/_links.scss @@ -0,0 +1,28 @@ +a { + color: $color__wp-blue; + text-decoration: none; + + &:hover, + &:focus, + &:active { + text-decoration: underline; + } + + &:focus { + outline: thin dotted; + } + + &:hover, + &:active { + outline: 0; + } + + p &, + li > & { + text-decoration: underline; + + &:hover { + color: #d54e21; + } + } +} diff --git a/themes/pub/wporg/css/base/_lists.scss b/themes/pub/wporg/css/base/_lists.scss new file mode 100644 index 0000000..9f4be58 --- /dev/null +++ b/themes/pub/wporg/css/base/_lists.scss @@ -0,0 +1,25 @@ +ul, ol { + margin: 0 0 1.5em 1.5em; + padding: 0; +} + +ul { + list-style: square; +} + +ol { + list-style: decimal; +} + +li > ul, +li > ol { + margin-bottom: 0; +} + +dt { + font-weight: bold; +} + +dd { + margin: 0 1.5em 1.5em; +} diff --git a/themes/pub/wporg/css/base/_tables.scss b/themes/pub/wporg/css/base/_tables.scss new file mode 100644 index 0000000..8790832 --- /dev/null +++ b/themes/pub/wporg/css/base/_tables.scss @@ -0,0 +1,29 @@ +table { + border: 1px solid #eee; + //border-spacing: .1rem; + border-collapse: collapse; + font-size: ms( -2 ); + margin: 0 0 ms( 0 ); + padding: 0; + width: 100%; + + thead { + background: $color__base-gray; + color: #fff; + } + + th, td { + border: 1px solid #eee; + font-weight: normal; + margin: 0; + padding: 0.4rem; + text-align: left; + vertical-align: top; + } + + tbody { + tr:nth-child( even ) { + background: #f7f7f7; + } + } +} diff --git a/themes/pub/wporg/css/base/_typography.scss b/themes/pub/wporg/css/base/_typography.scss new file mode 100644 index 0000000..758280c --- /dev/null +++ b/themes/pub/wporg/css/base/_typography.scss @@ -0,0 +1,20 @@ +html { + font-size: 100%; +} + +body, +button, +input, +select, +textarea { + color: $color__base-gray; + font-family: "Open Sans", sans-serif; + font-size: 100%; + line-height: $type__lineheight; +} + +@include breakpoint( $ms-breakpoint ) { + html { + font-size: 1.125rem; + } +} diff --git a/themes/pub/wporg/css/components/_404.scss b/themes/pub/wporg/css/components/_404.scss new file mode 100644 index 0000000..a1ec495 --- /dev/null +++ b/themes/pub/wporg/css/components/_404.scss @@ -0,0 +1,68 @@ + +.error-404 { + .page-title { + text-align: center; + } + + .page-content { + text-align: center; + + .logo-swing { + height: 10rem; + margin: 6rem auto; + position: relative; + text-align: center; + width: 10rem; + + .wp-logo { + left: 0; + max-width: none; + position: absolute; + top: 0; + width: 10rem; + } + } + } +} + +@keyframes hinge { + 10% { + width: 180px; + height: 180px; + transform: rotate3d(0, 0, 1, 0deg); + } + 15% { + width: 185px; + height: 185px; + transform: rotate3d(0, 0, 1, 0deg); + } + 20% { + width: 180px; + height: 180px; + transform: rotate3d(0, 0, 1, 5deg); + } + 40% { + transform-origin: top left; + animation-timing-function: ease-in-out; + } + 60% { + transform: rotate3d(0, 0, 1, 40deg); + transform-origin: top left; + animation-timing-function: ease-in-out; + } + 40%, 80% { + transform: rotate3d(0, 0, 1, 60deg); + transform-origin: top left; + animation-timing-function: ease-in-out; + opacity: 1; + } + to { + transform: translate3d(0, 700px, 0); + opacity: 0; + } +} + +.hinge { + animation-duration: 2s; + animation-name: hinge; +} diff --git a/themes/pub/wporg/css/components/_comments.scss b/themes/pub/wporg/css/components/_comments.scss new file mode 100644 index 0000000..6cb8524 --- /dev/null +++ b/themes/pub/wporg/css/components/_comments.scss @@ -0,0 +1,185 @@ + +.comments-area { + margin-top: 5em; + + > :last-child { + margin-bottom: 0; + } + + .comment-list + .comment-respond { + border-top: 1px solid #eaeaea; + } + + .comment-list + .comment-respond, + .comment-navigation + .comment-respond { + padding-top: 1.6em; + } + + .comments-title { + margin-bottom: 1.3333em; + } + + .comment-list { + list-style: none; + margin: 0; + + article, + .pingback, + .trackback { + border-top: 1px solid #eaeaea; + padding: 1.6em 0; + } + + article:not(:only-child) { + padding-bottom: 0; + } + + article + .comment-respond { + padding-bottom: 1.6em; + } + + .children { + list-style: none; + margin: 0; + + & > li { + padding-left: 0.8em; + } + } + } + + .comment-list .alt { + background: none; + } + + .comment-author { + color: #999; + margin-bottom: 0.4em; + + .avatar { + float: left; + height: 24px; + margin-right: 0.8em; + width: 24px; + } + } + + .comment-metadata, + .pingback .edit-link { + color: #999; + line-height: 1.5; + + a { + color: #777; + } + } + + .comment-metadata { + font-size: ms( -2 ); + margin-bottom: 1.6em; + + .edit-link { + margin-left: 1em; + } + + } + + .pingback .edit-link { + margin-left: 1em; + + &:before { + top: 5px; + } + } + + .comment-content { + ul, + ol { + margin: 0 0 1.6em 1.3333em; + } + + li > ul, + li > ol { + margin-bottom: 0; + } + + > :last-child { + margin-bottom: 0; + } + + .reply { + font-size: 12px; + + a { + border: 1px solid #eaeaea; + color: #707070; + display: inline-block; + font-weight: 700; + line-height: 1; + margin-top: 2em; + padding: 0.4167em 0.8333em; + text-transform: uppercase; + + &:hover, + &:focus { + border-color: #333; + color: #333; + outline: 0; + } + } + } + } + + .comment-reply-title a { + font-weight: inherit; + } + + .comment-form { + label { + font-size: ms( -2 ); + font-weight: 700; + display: block; + letter-spacing: 0.04em; + line-height: 1.5; + } + + input[type="text"], + input[type="email"], + input[type="url"], + textarea { + width: 100%; + } + } + + .comment-notes, + .comment-awaiting-moderation, + .logged-in-as, + .form-allowed-tags { + font-size: ms( 0 ); + line-height: 1.5; + margin-bottom: 2em; + } + + .no-comments { + border-top: 1px solid #eaeaea; + color: #999; + font-weight: 700; + padding-top: 1.6em; + } + + .comment-navigation + .no-comments { + border-top: 0; + } + + .form-allowed-tags code { + font-family: Inconsolata, monospace; + } + + .form-submit { + margin-bottom: 0; + } + + .required { + color: #c0392b; + } +} diff --git a/themes/pub/wporg/css/components/_components.scss b/themes/pub/wporg/css/components/_components.scss new file mode 100644 index 0000000..b610b56 --- /dev/null +++ b/themes/pub/wporg/css/components/_components.scss @@ -0,0 +1,21 @@ +@import "404"; +@import "comments"; +@import "entry-content"; +@import "entry-header"; +@import "entry-meta"; +@import "entry-summary"; +@import "entry"; +@import "gallery"; +@import "main-navigation"; +@import "page"; +@import "post-navigation"; +@import "posts-navigation"; +@import "search-form"; +@import "search"; +@import "site-content"; +@import "site-description"; +@import "site-header"; +@import "site-title"; +@import "widget-area"; +@import "wporg-footer"; +@import "wporg-header"; diff --git a/themes/pub/wporg/css/components/_entry-content.scss b/themes/pub/wporg/css/components/_entry-content.scss new file mode 100644 index 0000000..ea1764e --- /dev/null +++ b/themes/pub/wporg/css/components/_entry-content.scss @@ -0,0 +1,19 @@ +.entry-content { + hyphens: auto; + word-wrap: break-word; + + > p:first-child { + margin-top: 0; + } + + [class*="col-"] { + & ~ h1, + & ~ h2, + & ~ h3, + & ~ h4, + & ~ h5, + & ~ h6 { + clear: none; + } + } +} diff --git a/themes/pub/wporg/css/components/_entry-header.scss b/themes/pub/wporg/css/components/_entry-header.scss new file mode 100644 index 0000000..73b3ef8 --- /dev/null +++ b/themes/pub/wporg/css/components/_entry-header.scss @@ -0,0 +1,11 @@ +.entry-header { + position: relative; + + .sticky-post { + color: #999999; + font-size: ms( -2 ); + font-style: italic; + position: absolute; + top: -.8rem; + } +} diff --git a/themes/pub/wporg/css/components/_entry-meta.scss b/themes/pub/wporg/css/components/_entry-meta.scss new file mode 100644 index 0000000..cd431a6 --- /dev/null +++ b/themes/pub/wporg/css/components/_entry-meta.scss @@ -0,0 +1,31 @@ +.entry-meta { + color: #999999; + font-size: ms( -2 ); + margin-bottom: 1rem; + + a { + color: #777777; + } + + > span { + margin-right: 1rem; + + :last-of-type { + margin: 0; + } + } + + .updated:not(.published) { + display: none; + } + + .sticky & .posted-on, + .byline { + display: none; + } + + .single & .byline, + .group-blog & .byline { + display: inline; + } +} diff --git a/themes/pub/wporg/css/components/_entry-summary.scss b/themes/pub/wporg/css/components/_entry-summary.scss new file mode 100644 index 0000000..dd319b5 --- /dev/null +++ b/themes/pub/wporg/css/components/_entry-summary.scss @@ -0,0 +1,4 @@ +.entry-summary { + hyphens: auto; + word-wrap: break-word; +} diff --git a/themes/pub/wporg/css/components/_entry.scss b/themes/pub/wporg/css/components/_entry.scss new file mode 100644 index 0000000..1495b03 --- /dev/null +++ b/themes/pub/wporg/css/components/_entry.scss @@ -0,0 +1,4 @@ +body:not(.single):not(.search) .site-main .post { + margin-bottom: ms( 10 ); + max-width: 40em; +} diff --git a/themes/pub/wporg/css/components/_gallery.scss b/themes/pub/wporg/css/components/_gallery.scss new file mode 100644 index 0000000..a876930 --- /dev/null +++ b/themes/pub/wporg/css/components/_gallery.scss @@ -0,0 +1,47 @@ +.gallery { + margin-bottom: 1.5rem; + + .gallery-item { + display: inline-block; + margin: 0; + text-align: center; + vertical-align: top; + width: 100%; + } + + &.gallery-columns-2 .gallery-item { + max-width: 50%; + } + + &.gallery-columns-3 .gallery-item { + max-width: 33.33%; + } + + &.gallery-columns-4 .gallery-item { + max-width: 25%; + } + + &.gallery-columns-5 .gallery-item { + max-width: 20%; + } + + &.gallery-columns-6 .gallery-item { + max-width: 16.66%; + } + + &.gallery-columns-7 .gallery-item { + max-width: 14.28%; + } + + &.gallery-columns-8 .gallery-item { + max-width: 12.5%; + } + + &.gallery-columns-9 .gallery-item { + max-width: 11.11%; + } + + .gallery-caption { + display: block; + } +} \ No newline at end of file diff --git a/themes/pub/wporg/css/components/_main-navigation.scss b/themes/pub/wporg/css/components/_main-navigation.scss new file mode 100644 index 0000000..784007f --- /dev/null +++ b/themes/pub/wporg/css/components/_main-navigation.scss @@ -0,0 +1,139 @@ +.main-navigation { + background: $color__wp-blue; + clear: both; + left: 0; + position: absolute; + top: 60px; + width: 100%; + + ul { + display: none; + list-style: none; + margin: 0; + padding-left: 0; + + ul { + box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); + float: left; + left: -999em; + position: absolute; + top: 1.5em; + z-index: 99999; + + ul { + left: -999em; + top: 0; + } + + li { + &:hover > ul, + &.focus > ul { + left: 100%; + } + } + + a { + width: 200px; + } + + :hover > a, + .focus > a { + } + + a:hover, + a.focus { + } + } + + li:hover > ul, + li.focus > ul { + left: auto; + } + } + + li { + border-top: 1px solid rgba( 255, 255, 255, 0.2 ); + padding: 1rem; + + &:hover > a, + &.focus > a { + } + } + + a { + color: rgba( 255, 255, 255, 0.8 ); + display: block; + font-size: ms( -2 ); + text-decoration: none; + + &:hover, + &.active { + color: #fff; + } + + @include breakpoint( $ms-breakpoint ) { + &.active { + border-bottom: 1px solid; + } + } + } +} + +/* Small menu. */ +.main-navigation.toggled { + z-index: 1; + + ul { + display: block; + } +} + +.menu-toggle { + background: transparent; + border: none; + color: #fff; + font-size: ms( 4 ); + height: 3.5rem; + overflow: hidden; + position: absolute; + right: 1rem; + top: -58px; + width: 3.5rem; + -webkit-appearance: none; + + .toggled &:before { + content: "\f343"; + } +} + +@include breakpoint( $ms-breakpoint ) { + .menu-toggle { + display: none; + } + .main-navigation { + float: right; + position: initial; + width: initial; + + &.toggled { + padding: 1px 0; + } + + ul { + display: inline-block; + font-size: 0; + + li { + border: 0; + display: inline-block; + font-size: ms( 0 ); + margin-right: 1rem; + padding: 0; + + &:last-of-type { + margin-right: 0; + } + } + } + } +} diff --git a/themes/pub/wporg/css/components/_page.scss b/themes/pub/wporg/css/components/_page.scss new file mode 100644 index 0000000..0a07cd4 --- /dev/null +++ b/themes/pub/wporg/css/components/_page.scss @@ -0,0 +1,42 @@ +body.page { + .gutters .col-12 { + width: 100%; + } + + .entry-header { + background: $color__wp-blue; + padding: 1rem 0; + + .entry-title { + color: #fff; + font-size: ms( 4 ); + font-weight: 300; + line-height: 1; + margin: 0 auto; + max-width: 960px; + padding: 0 ms( 4 ); + + @include breakpoint( $ms-breakpoint ) { + padding: 0 10px; + } + } + + &.home { + padding: ms( 4 ) ms( 1 ); + text-align: center; + } + } + + @include breakpoint( $ms-breakpoint ) { + .site-header + .site-main .entry-title { + padding: initial; + } + } + + .entry-content, + .entry-footer { + margin: 0 auto; + max-width: 960px; + padding: ms( 10 ) ms( 4 ); + } +} \ No newline at end of file diff --git a/themes/pub/wporg/css/components/_post-navigation.scss b/themes/pub/wporg/css/components/_post-navigation.scss new file mode 100644 index 0000000..4e90b1e --- /dev/null +++ b/themes/pub/wporg/css/components/_post-navigation.scss @@ -0,0 +1,36 @@ +.post-navigation { + margin: 5em auto; + padding: 0; + + a { + border-bottom: 1px solid #eaeaea; + color: #444; + display: block; + font-weight: 600; + padding: 11px 0 12px; + text-transform: none; + width: 100%; + + &:hover { + color: #21759b; + } + } + + .nav-links { + border-top: 1px solid #eaeaea; + hyphens: auto; + word-wrap: break-word; + } + + .meta-nav { + color: #777; + display: block; + font-size: 13px; + line-height: 2; + text-transform: uppercase; + } + + .nav-next { + text-align: right; + } +} diff --git a/themes/pub/wporg/css/components/_posts-navigation.scss b/themes/pub/wporg/css/components/_posts-navigation.scss new file mode 100644 index 0000000..3ce339d --- /dev/null +++ b/themes/pub/wporg/css/components/_posts-navigation.scss @@ -0,0 +1,53 @@ +.pagination .nav-links { + text-align: center; + + .page-numbers { + background-color: #f9f9f9; + cursor: hand; + display: inline-block; + min-width: 2em; + padding: 8px; + + &.next, + &.prev, + &.dots { + background: none; + font-size: 0.9em; + width: auto; + } + &.dots { + cursor: inherit; + } + + @include breakpoint( 0, $ms-breakpoint ) { + &.prev, + &.next { + font-size: 0; + min-width: initial; + padding: 0; + } + + &.prev:before, + &.next:after { + background-color: #f9f9f9; + display: inline-block; + font-size: ms( 0 ); + line-height: 1.5; + min-width: 2em; + padding: 8px; + } + + &.prev:before { + content: '\2039'; /* ‹ */ + } + + &.next:after { + content: '\203A'; /* › */ + } + } + } + span.page-numbers { + background-color: #f7f7f7; + font-weight: bold; + } +} \ No newline at end of file diff --git a/themes/pub/wporg/css/components/_search-form.scss b/themes/pub/wporg/css/components/_search-form.scss new file mode 100644 index 0000000..ecd905c --- /dev/null +++ b/themes/pub/wporg/css/components/_search-form.scss @@ -0,0 +1,8 @@ +.search-form { + .search-field { + line-height: normal; + margin: 0; + padding: 4px 5px; + vertical-align: text-bottom; + } +} \ No newline at end of file diff --git a/themes/pub/wporg/css/components/_search.scss b/themes/pub/wporg/css/components/_search.scss new file mode 100644 index 0000000..9da0a45 --- /dev/null +++ b/themes/pub/wporg/css/components/_search.scss @@ -0,0 +1,11 @@ +body.search { + .gutters .col-12 { + width: 100%; + } + + .site-main { + margin: 0 auto; + max-width: 960px; + padding: 0 ms( 4 ) ms( 10 ); + } +} diff --git a/themes/pub/wporg/css/components/_site-content.scss b/themes/pub/wporg/css/components/_site-content.scss new file mode 100644 index 0000000..6e8d1b5 --- /dev/null +++ b/themes/pub/wporg/css/components/_site-content.scss @@ -0,0 +1,36 @@ +.site-content { + margin: 0 auto; + max-width: $size__site-main; + padding: 0 ms( 4 ); + + @include breakpoint( $ms-breakpoint) { + padding: 0 10px ms( 10 ); + } + + @include breakpoint( 0, $ms-breakpoint) { + .site-main { + float: none; + margin: 0; + width: auto; + } + } + + .home &, + .page &, + &.page { + margin: auto; + max-width: none; + padding: 0; + } + + .page-title { + font-size: ms( 2 ); + font-weight: 400; + } + + .no-results { + margin: 0 auto ms( 10 ); + max-width: 40em; + padding: 0 2rem; + } +} diff --git a/themes/pub/wporg/css/components/_site-description.scss b/themes/pub/wporg/css/components/_site-description.scss new file mode 100644 index 0000000..2e61770 --- /dev/null +++ b/themes/pub/wporg/css/components/_site-description.scss @@ -0,0 +1,7 @@ +.site-description { + color: rgba( 255, 255, 255, 0.8); + font-size: ms( 2 ); + font-weight: 300; + margin: -0.4rem auto 2rem; + text-align: center; +} diff --git a/themes/pub/wporg/css/components/_site-header.scss b/themes/pub/wporg/css/components/_site-header.scss new file mode 100644 index 0000000..ec9a2ad --- /dev/null +++ b/themes/pub/wporg/css/components/_site-header.scss @@ -0,0 +1,20 @@ +.site-header { + background: $color__wp-blue; + padding: 1rem 0; + position: relative; + + .site-branding { + margin: 0 auto; + max-width: 960px; + padding: 0 ms( 4 ); + + @include breakpoint( $ms-breakpoint ) { + padding: 0 10px; + } + } + + &.home { + padding: ms( 4 ) ms( 1 ); + text-align: center; + } +} diff --git a/themes/pub/wporg/css/components/_site-title.scss b/themes/pub/wporg/css/components/_site-title.scss new file mode 100644 index 0000000..72d69a5 --- /dev/null +++ b/themes/pub/wporg/css/components/_site-title.scss @@ -0,0 +1,25 @@ +.site-title { + display: inline-block; + font-size: ms( 4 ); + font-weight: 300; + line-height: 1; + margin: 0 2rem 0 0; + max-width: none; + + a { + color: #fff; + font-weight: 300; + + &:hover, + &:focus, + &:active { + text-decoration: none; + } + } + + .site-header.home & { + display: inherit; + font-size: ms( 12 ); + margin: 2rem 0 1rem; + } +} diff --git a/themes/pub/wporg/css/components/_widget-area.scss b/themes/pub/wporg/css/components/_widget-area.scss new file mode 100644 index 0000000..3d3f1ae --- /dev/null +++ b/themes/pub/wporg/css/components/_widget-area.scss @@ -0,0 +1,11 @@ +.widget-area { + font-size: ms( -2 ); + + @include breakpoint( 480px, $sm ) { + @include flex; + + .widget { + width: calc( 50% - #{$grid-gutter} ); + } + } +} diff --git a/themes/pub/wporg/css/components/_wporg-footer.scss b/themes/pub/wporg/css/components/_wporg-footer.scss new file mode 100644 index 0000000..b06097c --- /dev/null +++ b/themes/pub/wporg/css/components/_wporg-footer.scss @@ -0,0 +1,112 @@ +#wporg-footer { + background-color: #f7f7f7; + border-top: 1px solid #dfdfdf; + clear: both; + margin: 0 auto; + overflow: auto; + padding: 22px 14px 65px 14px; + + .wrapper { + clear: both; + margin: 0 auto; + max-width: 930px; + overflow: auto; + } + + ul { + float: left; + margin-bottom: 20px; /* for narrow screens */ + margin-left: 24px; + overflow: auto; + padding-left: 0; /* override other generic styles */ + width: 135px; + + @include breakpoint( 960px ) { + &:first-child { + margin-left: 0; + } + } + + li { + color: #bbb; + font-size: 14px; + list-style-type: none; + margin-bottom: 1px; + + a { + text-decoration: none; + text-decoration-skip-ink: none; + + &:hover { + color: $color__wp-blue; + text-decoration: underline; + } + } + } + } + + .cip { + clear: both; + color: #cccccc; + float: none; + font-size: ms( -2 ); + letter-spacing: 0.3em; + margin: 35px auto 0 auto; + text-align: center; + text-transform: uppercase; + + &.cip-image { + background: url(//s.w.org/style/images/codeispoetry.png?1) center center no-repeat; + background-size: 190px 15px; + height: 15px; + text-indent: -9999px; + width: 190px; + + @media only screen and (-webkit-min-device-pixel-ratio: 1.5), + only screen and (min-resolution: 1.5dppx), + only screen and (min-resolution: 144dpi) { + background-image: url(//s.w.org/style/images/codeispoetry-2x.png?1); + } + } + } + + + @include breakpoint( 561px, 959px ) { + .wrapper { + max-width: 600px; + } + + ul { + margin-left: 2%; + width: 32%; + + &:nth-child(3n+1) { + margin-left: 0; + } + + &:nth-child(4n) { + clear: both; + } + } + } + + @include breakpoint( 0, 560px ) { + .wrapper { + max-width: 360px; + } + + ul { + margin-left: 4%; + width: 48%; + + &:nth-child(2n+1) { + margin-left: 0; + } + + &:nth-child(odd) { + clear: both; + } + } + } + +} diff --git a/themes/pub/wporg/css/components/_wporg-header.scss b/themes/pub/wporg/css/components/_wporg-header.scss new file mode 100644 index 0000000..4c8d62f --- /dev/null +++ b/themes/pub/wporg/css/components/_wporg-header.scss @@ -0,0 +1,393 @@ +#wporg-header { + background: #23282d; + height: 140px; + position: relative; + text-align: center; + width: 100%; + + .wrapper { + margin: 0 auto; + max-width: 960px; + } + + h1 { + display: inline-block; + margin: auto; + width: 303px; + + a { + background: url( //s.w.org/style/images/wporg-logo.svg?3 ) center left no-repeat; + background-size: 290px 46px; + display: block; + height: 88px; + text-indent: -9999px; + } + } + + h2.rosetta { + clear: none; + color: #dfdfdf; + font-family: Georgia, "Times New Roman", serif; + font-size: 30px; + margin: 0; + + a { + border-bottom: none; + color: #dfdfdf; + display: block; + height: 52px; /* 88 header height - 36 top padding */ + line-height: 22px; + padding: 0; + + &:hover { + text-decoration: none; + } + } + } + + #wporg-header-menu { + background: #23282d; + left: -75%; + list-style: none; + margin: 0; + max-width: 75%; + min-width: 200px; + position: absolute; + text-align: left; + top: 100%; + transition: left 0.3s; + z-index: 100000; + + &.toggled { + left: 0; + } + } + + ul li { + list-style-type:none; + position:relative; + + a { + color: #eee; + display: block; + font-family: "Open Sans", Helvetica, Arial, "Liberation Sans", sans-serif; + font-size: 13px; + font-weight: 600; + height: 34px; + line-height: 34px; + margin: 0 4px; + padding: 10px 30px; + text-decoration: none; + + &.subcurrent { + font-weight: bold; + } + + @include breakpoint( sm ) { + height: auto; + } + } + + a:hover, + a.current, + &.current-menu-item a, + &.current_page_parent a { + color: #00a0d2; + } + + &#download, + &.download { + float: right; + height: 34px; + margin-right: 14px; + overflow: hidden; + padding: 0 0 34px; + + @media screen and (max-width:820px) { + display: none; + } + + @media screen and (max-width:768px) { + display: block; + float: none; + margin: 10px 20px 20px; + padding-bottom: 0; + height: auto; + + a { + padding: 4px 10px; + } + } + + a { + margin: 0; + padding: 0 16px; + + &:hover { + color: #eee; + } + } + + &.current, + &.current-menu-item, + .uparrow { + display: none; + } + } + + .nav-submenu { + clip: rect(1px, 1px, 1px, 1px); + height: 1px; + left: -2px; + margin: 0; + overflow: hidden; + padding: 0; + position: absolute; + width: 1px; + z-index: 99999; + + li a { + height: 24px; + line-height: 24px; + margin: 0; + } + } + } + + #head-search { + @include breakpoint( $sm ) { + float: right; + margin-right: 14px; + padding-top: 30px; + } + + form { + border-bottom: 1px solid #3f3f3f; + display: inline-block; + margin-left: 60px; + width: 288px; + + input.text { + background: #191e23; + border: 0; + border-radius: 0; + box-sizing: content-box; + color: #b4b9be; + float: left; + font-family: "Open Sans", sans-serif; + font-size: 12px; + height: 24px; + margin: 0; + outline: none; + padding: 3px; + vertical-align: top; + width: 256px; + + &::-moz-placeholder { + color: #eee; + } + + @media screen and (max-width:480px) { + width: 216px; + } + } + + .button { + background: #191e23 url( //s.w.org/wp-includes/images/admin-bar-sprite.png?d=20120831 ) no-repeat 2px 5px; + border: none; + border-radius: 0; + box-shadow: none; + float: left; + height: 30px; + margin: 0; + padding: 0; + text-shadow: none !important; + width: 26px; + } + + @include breakpoint( 0, 480px ) { + width: 248px; + } + + @include breakpoint( 480px ) { + margin-left: 0; + } + } + } + + @include breakpoint( $sm ) { + height: 120px; + text-align: inherit; + + h1 { + float: left; + padding-left: 10px; + } + + h2.rosetta { + float: left; + padding: 36px 27px 0; + } + + #headline h2 { + text-rendering: optimizeLegibility; + } + + #wporg-header-menu { + float:left; + height: 46px; + list-style: none; + margin: -15px 0 0; + max-width: inherit; + min-width: 0; + padding: 0; + position: static; + width: 100%; + } + + ul li { + float: left; + position:relative; + + a { + height: 46px; + padding: 0 6px; + + &.current ~ .uparrow { + border-bottom: 9px solid #f7f7f7; + border-left: 9px solid transparent; + border-right: 9px solid transparent; + height: 0; + margin: -8px auto 0 auto; + width: 0; + } + } + + &.current-menu-item:after, + &.current_page_parent:after { + border-bottom: 9px solid #f7f7f7; + border-left: 9px solid transparent; + border-right: 9px solid transparent; + content: ''; + height: 0; + left: 50%; + margin: -8px 0 0 -9px; + position: absolute; + width: 0; + } + + &:hover .nav-submenu ~ .uparrow, + .nav-submenu:hover ~ .uparrow { + border-bottom: 9px solid #32373c; + border-left: 9px solid transparent; + border-right: 9px solid transparent; + height: 0; + margin: -10px auto 0 auto; + width: 0; + } + + .nav-submenu { + background: #32373c; + border: #32373c solid 1px; + border-top: 0; + margin-top: -1px; + min-width: 0; + + li { + float: none; + + a { + height: 34px; + line-height: 34px; + } + } + } + } + + ul.nav-menu li:hover > ul, + .nav-menu ul li:hover > ul, + ul.nav-menu .focus > ul, + .nav-menu .focus > ul { + clip: inherit; + height: inherit; + overflow: inherit; + width: inherit; + } + + ul li.current-menu-item:after, + ul li.current_page_parent:after, + ul li a.current ~ .uparrow { + border-bottom-color: $color__wp-blue; + } + } +} + +.page-download #wporg-header #download, +.page-parent-download #wporg-header #download { + display: none; +} + +#mobile-menu-button { + background: none; + border: none; + box-shadow: none; + display: block; + float: left; + font-family: 'dashicons'; + font-size: 16px; + font-style: normal; + font-weight: normal; + left: 10px; + line-height: 1; + padding: 1px; + position: absolute; + text-align: center; + text-decoration: inherit; + text-shadow: none; + top: 75px; + transition: color .1s ease-in; + vertical-align: top; + &:before { + border: none; + box-sizing: border-box; + color: #888; + content: '\f228'; + display: inline-block; + float: left; + font: normal 50px/1 'Dashicons'; + margin: 0; + outline: none; + padding: 3px; + text-decoration: none; + vertical-align: middle; + -webkit-font-smoothing: antialiased; + } + + @include breakpoint( $sm ) { + display: none; + } + + -webkit-font-smoothing: antialiased; +} + +#download-mobile { + background: #f7f7f7; + border-bottom: 1px solid #dddddd; + + .wrapper { + padding: 20px 0; + text-align: center; + } + + span.download-ready { + font-size: 1.6em; + margin: 0 0.25em; + } + + a.download-button { + font-size: 1.6em; + height: inherit; + margin: 10px 0.25em; + padding: 10px 15px; + } +} diff --git a/themes/pub/wporg/css/generic/_generic.scss b/themes/pub/wporg/css/generic/_generic.scss new file mode 100644 index 0000000..122159b --- /dev/null +++ b/themes/pub/wporg/css/generic/_generic.scss @@ -0,0 +1,2 @@ +@import "kube"; +@import "normalize"; diff --git a/themes/pub/wporg/css/generic/_kube.scss b/themes/pub/wporg/css/generic/_kube.scss new file mode 100644 index 0000000..fc2c5e1 --- /dev/null +++ b/themes/pub/wporg/css/generic/_kube.scss @@ -0,0 +1,135 @@ +// Kube. CSS & JS Framework +// Copyright (c) 2009-2017, Imperavi LLC. +// License: MIT + +[class*="col-"] { + margin: inherit; +} + +// Grid Row +.row { + @include grid-row; + + // Gutters + &.gutters > .row { + margin-left: -$grid-gutter; + + @include breakpoint(sm) { + margin-left: 0; + } + + & > [class*='col-'] { + margin-left: $grid-gutter; + + @include breakpoint(sm) { + margin-left: 0; + } + } + } + &.around { + @include flex-items-space-around; + } + &.between { + @include flex-items-space-between; + } + &.auto { + & .col { + @include flex-item-grow(1); + } + } +} + +// Grid Columns +@include generate-grid-columns; + +// Offset +[class^='offset-'], +[class*=' offset-'] { + @include breakpoint(sm) { + margin-left: 0; + } +} + +// Ordering +.first { order: -1; } +.last { order: 1; } + +@include breakpoint(sm) { + .row { + & [class*='col-'] { + margin-left: 0; + width: 100%; + } + &.gutters { + & [class*='col-'] { + margin-bottom: $text-margin-bottom; + } + } + } + .first-sm { order: -1; } + .last-sm { order: 1; } +} + +// Push +.gutters .column.push-left, +.push-left { margin-right: auto; } + +.gutters .column.push-right, +.push-right { margin-left: auto; } + +.gutters .column.push-center, +.push-center { margin-left: auto; margin-right: auto; } + +.gutters .column.push-middle, +.push-middle { margin-top: auto; margin-bottom: auto; } + +.push-bottom { margin-top: auto; } + +@include breakpoint(sm) { + + .gutters .column.push-left-sm, + .push-left-sm { margin-left: 0; } + + .gutters .column.push-center-sm, + .push-center-sm { margin-left: auto; margin-right: auto;} + + .push-top-sm { margin-top: 0; } + +} + +// Flex Alignment +.align-middle { + @include flex-items-middle; +} +.align-right { + @include flex-items-right; +} +.align-center { + @include flex-items-center; +} + +@include breakpoint(sm) { + .align-left-sm { @include flex-items-left; } +} + +// Float +.float-right { + float: right; +} +.float-left { + float: left; +} + +@include breakpoint(sm) { + .float-right { float: none; } + .float-left { float: none; } +} + +// Fixed +.fixed { + position: fixed; + top: 0; + left: 0; + z-index: $z-over-content; + width: 100%; +} diff --git a/themes/pub/wporg/css/generic/_normalize.scss b/themes/pub/wporg/css/generic/_normalize.scss new file mode 100644 index 0000000..3046beb --- /dev/null +++ b/themes/pub/wporg/css/generic/_normalize.scss @@ -0,0 +1,210 @@ +html { + font-family: sans-serif; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; +} + +body { + margin: 0; +} + +article, +aside, +details, +figcaption, +figure, +footer, +header, +main, +menu, +nav, +section, +summary { + display: block; +} + +audio, +canvas, +progress, +video { + display: inline-block; + vertical-align: baseline; +} + +audio:not([controls]) { + display: none; + height: 0; +} + +[hidden], +template { + display: none; +} + +a { + background-color: transparent; +} + +a:active, +a:hover { + outline: 0; +} + +abbr[title] { + border-bottom: 1px dotted; +} + +b, +strong { + font-weight: bold; +} + +dfn { + font-style: italic; +} + +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +mark { + background: #ff0; + color: #000; +} + +small { + font-size: 80%; +} + +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +img { + border: 0; +} + +svg:not(:root) { + overflow: hidden; +} + +figure { + margin: 1em 40px; +} + +hr { + box-sizing: content-box; + height: 0; +} + +pre { + overflow: auto; +} + +code, +kbd, +pre, +samp { + font-family: monospace, monospace; + font-size: 1em; +} + +button, +input, +optgroup, +select, +textarea { + color: inherit; + font: inherit; + margin: 0; +} + +button { + overflow: visible; +} + +button, +select { + text-transform: none; +} + +button, +html input[type="button"], +input[type="reset"], +input[type="submit"] { + -webkit-appearance: button; + cursor: pointer; +} + +button[disabled], +html input[disabled] { + cursor: default; +} + +button::-moz-focus-inner, +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +input { + line-height: normal; +} + +input[type="checkbox"], +input[type="radio"] { + box-sizing: border-box; + padding: 0; +} + +input[type="number"]::-webkit-inner-spin-button, +input[type="number"]::-webkit-outer-spin-button { + height: auto; +} + +input[type="search"]::-webkit-search-cancel-button, +input[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; +} + +fieldset { + border: 1px solid #c0c0c0; + margin: 0 2px; + padding: 0.35em 0.625em 0.75em; +} + +legend { + border: 0; + padding: 0; +} + +textarea { + overflow: auto; +} + +optgroup { + font-weight: bold; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +td, +th { + padding: 0; +} diff --git a/themes/pub/wporg/css/objects/_accessibility.scss b/themes/pub/wporg/css/objects/_accessibility.scss new file mode 100644 index 0000000..75f6425 --- /dev/null +++ b/themes/pub/wporg/css/objects/_accessibility.scss @@ -0,0 +1,37 @@ +/* Text meant only for screen readers. */ +.screen-reader-text { + clip: rect(1px, 1px, 1px, 1px); + height: 1px; + overflow: hidden; + position: absolute !important; + width: 1px; + + &:focus { + background-color: #f1f1f1; + border-radius: 3px; + box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); + clip: auto !important; + color: #21759b; + display: block; + font-size: 0.875rem; + font-weight: bold; + height: auto; + left: 5px; + line-height: normal; + padding: 15px 23px 14px; + text-decoration: none; + top: 5px; + width: auto; + z-index: 100000; /* Above WP toolbar. */ + } +} + +/* Do not show the outline on the skip link target. */ +.site-content[tabindex="-1"]:focus { + outline: 0; +} + +/* hide elements if JS isn't available. */ +.no-js .hide-if-no-js { + display: none; +} diff --git a/themes/pub/wporg/css/objects/_alignments.scss b/themes/pub/wporg/css/objects/_alignments.scss new file mode 100644 index 0000000..0d79a55 --- /dev/null +++ b/themes/pub/wporg/css/objects/_alignments.scss @@ -0,0 +1,28 @@ +.alignleft { + display: inline; + float: left; + margin-right: 1.5em; +} + +.alignright { + display: inline; + float: right; + margin-left: 1.5em; +} + +.aligncenter { + clear: both; + display: block; + margin-left: auto; + margin-right: auto; +} + +@include breakpoint( 0, 480px ) { + .alignleft, + .alignright { + display: block; + float: none; + margin-left: auto; + margin-right: auto; + } +} diff --git a/themes/pub/wporg/css/objects/_buttons.scss b/themes/pub/wporg/css/objects/_buttons.scss new file mode 100644 index 0000000..f4e840f --- /dev/null +++ b/themes/pub/wporg/css/objects/_buttons.scss @@ -0,0 +1,357 @@ +// /* ---------------------------------------------------------------------------- +// +// NOTE: If you edit this file, you should make sure that the CSS rules for +// buttons in the following files are updated. +// +// * jquery-ui-dialog.css +// * editor.css +// +// WordPress-style Buttons +// ======================= +// Create a button by adding the `.button` class to an element. For backwards +// compatibility, we support several other classes (such as `.button-secondary`), +// but these will *not* work with the stackable classes described below. +// +// Button Styles +// ------------- +// To display a primary button style, add the `.button-primary` class to a button. +// +// Button Sizes +// ------------ +// Adjust a button's size by adding the `.button-large` or `.button-small` class. +// +// Button States +// ------------- +// Lock the state of a button by adding the name of the pseudoclass as +// an actual class (e.g. `.hover` for `:hover`). +// +// +// TABLE OF CONTENTS: +// ------------------ +// 1.0 - Button Layouts +// 2.0 - Default Button Style +// 3.0 - Primary Button Style +// 4.0 - Button Groups +// 5.0 - Responsive Button Styles +// +//---------------------------------------------------------------------------- */ + +/* ---------------------------------------------------------------------------- + 1.0 - Button Layouts +---------------------------------------------------------------------------- */ + +.button, +.button-primary, +.button-secondary, +.plugin-upload-form .button-primary { + border: 1px solid; + border-radius: 3px; + box-sizing: border-box; + cursor: pointer; + display: inline-block; + font-size: ms( -2 ); + height: ms( 4 ); + line-height: 1; + margin: 0; + padding: 0 0.8rem; + text-decoration: none; + white-space: nowrap; + -webkit-appearance: none; +} + +/* Remove the dotted border on :focus and the extra padding in Firefox */ +button::-moz-focus-inner, +input[type="reset"]::-moz-focus-inner, +input[type="button"]::-moz-focus-inner, +input[type="submit"]::-moz-focus-inner { + border: 0 none; + padding: 0; +} + +.button.button-xl, +.button-group.button-xl .button { + font-size: ms( 0 ); + height: ms( 8 ); + line-height: 1; + padding: 0 1.5rem; +} + +.button.button-large, +.button-group.button-large .button { + height: ms( 6 ); + line-height: 1; + padding: 0 1rem; +} + +.button.button-small, +.button-group.button-small .button { + font-size: ms( -4 ); + height: ms( 2 ); + line-height: 1; + padding: 0 0.5rem; +} + +a.button, +a.button-primary, +a.button-secondary { + line-height: ms( 4 ); +} + +a.button.button-large, +.button-group.button-large a.button { + line-height: ms( 6 ); +} + +a.button.button-xl, +.button-group.button-xl a.button { + line-height: ms( 8 ); +} + +a.button.button-small, +.button-group.button-small a.button { + line-height: ms( 2 ); +} + +.button:active, +.button:focus { + outline: none; +} + +.button.hidden { + display: none; +} + +/* Style Reset buttons as simple text links */ + +input[type="reset"], +input[type="reset"]:hover, +input[type="reset"]:active, +input[type="reset"]:focus { + background: none; + border: none; + box-shadow: none; + padding: 0 2px 1px; + width: auto; +} + +/* ---------------------------------------------------------------------------- + 2.0 - Default Button Style +---------------------------------------------------------------------------- */ + +.button, +.button:visited, +.button-secondary { + background: #f7f7f7; + border-color: #cccccc; + box-shadow: 0 1px 0 #cccccc; + color: #555; + vertical-align: top; +} + +p .button { + vertical-align: baseline; +} + +.button.hover, +.button:hover, +.button-secondary:hover, +.button.focus, +.button:focus, +.button-secondary:focus { + background: #fafafa; + border-color: #999; + color: #23282d; +} + +.button.focus, +.button:focus, +.button-secondary:focus, +.button-link:focus { + border-color: #5b9dd9; + box-shadow: 0 0 3px rgba( 0, 115, 170, 0.8 ); +} + +.button.active, +.button.active:hover, +.button:active, +.button-secondary:active { + background: #eee; + border-color: #999; + box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ); + transform: translateY(1px); +} + +.button.active:focus { + border-color: #5b9dd9; + box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 ), 0 0 3px rgba( 0, 115, 170, 0.8 ); +} + +.button[disabled], +.button:disabled, +.button.disabled, +.button-secondary[disabled], +.button-secondary:disabled, +.button-secondary.disabled, +.button-disabled { + background: #f7f7f7 !important; + border-color: #ddd !important; + box-shadow: none !important; + color: #a0a5aa !important; + cursor: default; + text-shadow: 0 1px 0 #fff !important; + transform: none !important; +} + +/* Buttons that look like links, for a cross of good semantics with the visual */ +.button-link { + background: none; + border: 0; + border-radius: 0; + box-shadow: none; + cursor: pointer; + margin: 0; + outline: none; + padding: 0; +} + +.button-link:focus { + outline: #5b9dd9 solid 1px; +} + +/* ---------------------------------------------------------------------------- + 3.0 - Primary Button Style +---------------------------------------------------------------------------- */ + +.button-primary, +.download-button, +.plugin-upload-form .button-primary { + background: #0085ba; + border-color: #0073aa #006799 #006799; + box-shadow: 0 1px 0 #006799; + color: #fff; + text-decoration: none; + text-shadow: 0 -1px 1px #006799, 1px 0 1px #006799, 0 1px 1px #006799, -1px 0 1px #006799; + + &:visited { + background: #0085ba; + border-color: #0073aa #006799 #006799; + box-shadow: 0 1px 0 #006799; + color: #fff; + } + + &.hover, + &:hover, + &.focus, + &:focus { + background: #008ec2; + border-color: #006799; + box-shadow: 0 1px 0 #006799; + color: #fff; + } + + &.focus, + &:focus { + box-shadow: 0 1px 0 #0073aa, 0 0 2px 1px #33b3db; + } + + &.active, + &.active:hover, + &.active:focus, + &:active { + background: $color__wp-blue; + border-color: #006799; + box-shadow: inset 0 2px 0 #006799; + vertical-align: top; + } + + &[disabled], + &:disabled, + &.disabled { + background: #008ec2 !important; + border-color: #007cb2 !important; + box-shadow: none !important; + color: #66c6e4 !important; + cursor: default; + text-shadow: 0 -1px 0 rgba( 0, 0, 0, 0.1 ) !important; + } + + &.button.button-hero { + box-shadow: 0 2px 0 #006799; + + &.active, + &.active:hover, + &.active:focus, + &:active { + box-shadow: inset 0 3px 0 #006799; + } + } +} + +.button-primary-disabled { + background: #008ec2 !important; + border-color: #007cb2 !important; + box-shadow: none !important; + color: #66c6e4 !important; + cursor: default; + text-shadow: 0 -1px 0 rgba( 0, 0, 0, 0.1 ) !important; +} + + + +/* ---------------------------------------------------------------------------- + 4.0 - Button Groups +---------------------------------------------------------------------------- */ + +.button-group { + display: inline-block; + font-size: 0; + position: relative; + vertical-align: middle; + white-space: nowrap; +} + +.button-group > .button { + border-radius: 0; + display: inline-block; + margin-right: -1px; + z-index: 10; +} + +.button-group > .button-primary { + z-index: 100; +} + +.button-group > .button:hover { + z-index: 20; +} + +.button-group > .button:first-child { + border-radius: 3px 0 0 3px; +} + +.button-group > .button:last-child { + border-radius: 0 3px 3px 0; +} + +.button-group > .button:focus { + position: relative; + z-index: 1; +} + +/* ---------------------------------------------------------------------------- + 5.0 - Responsive Button Styles +---------------------------------------------------------------------------- */ + +@media screen and ( max-width: $ms-breakpoint ) { + .button, + .button.button-large, + .button.button-small, + .plugin-upload-form .button-primary { + font-size: 14px; + height: auto; + line-height: normal; + margin-bottom: 4px; + padding: 6px 14px; + vertical-align: middle; + } +} diff --git a/themes/pub/wporg/css/objects/_clearings.scss b/themes/pub/wporg/css/objects/_clearings.scss new file mode 100644 index 0000000..478435c --- /dev/null +++ b/themes/pub/wporg/css/objects/_clearings.scss @@ -0,0 +1,18 @@ +.clear, +.entry-content, +.comment-content, +.site-header, +.site-content, +.site-footer, +.home-below { + &:before, + &:after { + content: ""; + display: table; + table-layout: fixed; + } + + &:after { + clear: both; + } +} diff --git a/themes/pub/wporg/css/objects/_copy.scss b/themes/pub/wporg/css/objects/_copy.scss new file mode 100644 index 0000000..b815900 --- /dev/null +++ b/themes/pub/wporg/css/objects/_copy.scss @@ -0,0 +1,23 @@ +p { + &.subheading { + color: #82878c; + font-size: ms( 2 ); + font-weight: 300; + margin: -0.4rem auto 2rem; + text-align: center; + } + + &.intro { + font-size: ms( 2 ); + } + + &.aside { + font-size: ms( -2 ); + } + + &.note { + font-size: ms( -4 ); + letter-spacing: 0.01rem; + max-width: ms(26); + } +} \ No newline at end of file diff --git a/themes/pub/wporg/css/objects/_inputs.scss b/themes/pub/wporg/css/objects/_inputs.scss new file mode 100644 index 0000000..269b44a --- /dev/null +++ b/themes/pub/wporg/css/objects/_inputs.scss @@ -0,0 +1,326 @@ +/* ---------------------------------------------------------------------------- + +WordPress-style Form Elements +============================= +These are the current form element styles for wp-admin. Many of them include the .wp-admin class to be appended which I appended to the html tag on this pen. + +Form Styles +------------- +All form element styles are minimal and require additional styling for layout. + +---------------------------------------------------------------------------- */ + +/* Include margin and padding in the width calculation of input and textarea. */ +input, +textarea { + box-sizing: border-box; +} + +input[type="checkbox"], +input[type="color"], +input[type="date"], +input[type="datetime"], +input[type="datetime-local"], +input[type="email"], +input[type="month"], +input[type="number"], +input[type="password"], +input[type="radio"], +input[type="search"], +input[type="tel"], +input[type="text"], +input[type="time"], +input[type="url"], +input[type="week"], +select, +textarea { + background-color: #fff; + border: 1px solid #ddd; + box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 ); + color: #32373c; + outline: none; + transition: 0.05s border-color ease-in-out; + + &:focus { + border-color: #5b9dd9; + box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 ); + } +} + +/* rtl:ignore */ +input[type="email"], +input[type="url"] { + direction: ltr; +} + +/* Vertically align the number selector with the input. */ +input[type="number"] { + height: 28px; + line-height: inherit; +} + +input[type="checkbox"], +input[type="radio"] { + background: #fff; + border: 1px solid #b4b9be; + box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 ); + clear: none; + color: #555; + cursor: pointer; + display: inline-block; + height: 16px; + line-height: 0; + margin: -4px 4px 0 0; + min-width: 16px; + outline: 0; + padding: 0 !important; + text-align: center; + transition: 0.05s border-color ease-in-out; + vertical-align: middle; + width: 16px; + -webkit-appearance: none; + + &:checked:before { + display: inline-block; + float: left; + font: normal 21px/1 dashicons; + vertical-align: middle; + width: 16px; + speak: none; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + } + + &.disabled, + &:disabled, + &:disabled:checked:before, + &.disabled:checked:before { + opacity: 0.7; + } +} + +input[type="checkbox"]:checked:before { + color: #1e8cbe; + content: "\f147"; + margin: -3px 0 0 -4px; +} + +input[type="radio"] { + border-radius: 50%; + line-height: 10px; + margin-right: 4px; + + &:checked + label:before { + color: #82878c; + } + + &:checked:before { + background-color: #1e8cbe; + border-radius: 50px; + content: "\2022"; + font-size: 24px; + height: 6px; + line-height: 16px; + margin: 4px; + text-indent: -9999px; + width: 6px; + } +} + +input[type="reset"]:hover, +input[type="reset"]:active { + color: #00a0d2; +} + +/* Search */ +input[type="search"] { + -webkit-appearance: textfield; + + &::-webkit-search-decoration { + display: none; + } +} + +textarea, +input, +select, +button { + font-family: inherit; + font-size: inherit; + font-weight: inherit; +} + +textarea, +input, +select { + border-radius: 0; + font-size: 14px; + padding: 3px 5px; /* Reset mobile webkit's default element styling */ +} + +textarea { + line-height: 1.4; + overflow: auto; + padding: 2px 6px; + resize: vertical; + + &.code { + line-height: 1.4; + padding: 4px 6px 1px 6px; + } +} + +label { + cursor: pointer; + vertical-align: middle; +} + +input, +select { + margin: 1px; + padding: 3px 5px; +} + +input.code { + padding-top: 6px; +} + +input.readonly, +input[readonly], +textarea.readonly, +textarea[readonly] { + background-color: #eee; +} + +:-moz-placeholder, +.wp-core-ui :-moz-placeholder { + color: #a9a9a9; +} + +input:disabled, +input.disabled, +select:disabled, +select.disabled, +textarea:disabled, +textarea.disabled { + background: rgba( 255, 255, 255, 0.5 ); + border-color: rgba( 222, 222, 222, 0.75 ); + box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 ); + color: rgba( 51, 51, 51, 0.5 ); +} + +input[type="file"]:disabled, +input[type="file"].disabled, +input[type="range"]:disabled, +input[type="range"].disabled { + background: none; + box-shadow: none; +} + +input.large-text, +textarea.large-text { + width: 99%; +} + +input.regular-text { + width: 25em; +} + +input.small-text { + padding: 1px 6px; + width: 50px; +} + +input[type="number"].small-text { + width: 65px; +} + +input.tiny-text { + width: 35px; +} + +input[type="number"].tiny-text { + width: 45px; +} + + +/* =Media Queries +-------------------------------------------------------------- */ + +@include breakpoint( 0, 782px ) { + /* Input Elements */ + textarea { + -webkit-appearance: none; + } + + input[type="text"], + input[type="email"], + input[type="search"], + input[type="password"], + input[type="number"] { + -webkit-appearance: none; + padding: 6px 10px; + } + + input[type="number"] { + height: 40px; + } + + input.code { + padding-bottom: 5px; + padding-top: 10px; + } + + input[type="checkbox"] { + -webkit-appearance: none; + padding: 10px; + } + + input[type="checkbox"]:checked:before { + font: normal 30px/1 dashicons; + margin: -3px -5px; + } + + input[type="radio"], + input[type="checkbox"] { + height: 25px; + width: 25px; + } + + input[type="radio"]:checked:before { + vertical-align: middle; + width: 9px; + height: 9px; + margin: 7px; + line-height: 16px; + } + + textarea, + input { + font-size: 16px; + } + + input[type="text"].small-text, + input[type="search"].small-text, + input[type="password"].small-text, + input[type="number"].small-text, + input[type="number"].small-text { + width: auto; + max-width: 55px; + display: inline; + padding: 3px 6px; + margin: 0 3px; + } + + input.regular-text { + width: 100%; + } + + label { + font-size: 14px; + } + + fieldset label { + display: block; + } +} diff --git a/themes/pub/wporg/css/objects/_links.scss b/themes/pub/wporg/css/objects/_links.scss new file mode 100644 index 0000000..56d59e2 --- /dev/null +++ b/themes/pub/wporg/css/objects/_links.scss @@ -0,0 +1,7 @@ +a { + &.button:hover, + &.button:focus, + &.button:active { + text-decoration: none; + } +} diff --git a/themes/pub/wporg/css/objects/_notices.scss b/themes/pub/wporg/css/objects/_notices.scss new file mode 100644 index 0000000..968ba4c --- /dev/null +++ b/themes/pub/wporg/css/objects/_notices.scss @@ -0,0 +1,53 @@ +.notice { + background: #fff; + border-left: 4px solid #fff; + box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 ); + margin: 1em 0; + padding: 1px 12px; + + p { + font-size: ms( -2 ); + margin: 0.5em 0; + padding: 2px; + } + + &.notice-alt { + box-shadow: none; + } + + &.notice-large { + padding: 10px 20px; + } + + &.notice-success { + border-left-color: #46b450; + } + + &.notice-success.notice-alt { + background-color: #ecf7ed; + } + + &.notice-warning { + border-left-color: #ffb900; + } + + &.notice-warning.notice-alt { + background-color: #fff8e5; + } + + &.notice-error { + border-left-color: #dc3232; + } + + &.notice-error.notice-alt { + background-color: #fbeaea; + } + + &.notice-info { + border-left-color: #00a0d2; + } + + &.notice-info.notice-alt { + background-color: #e5f5fa; + } +} diff --git a/themes/pub/wporg/css/objects/_objects.scss b/themes/pub/wporg/css/objects/_objects.scss new file mode 100644 index 0000000..0d7cd62 --- /dev/null +++ b/themes/pub/wporg/css/objects/_objects.scss @@ -0,0 +1,8 @@ +@import "accessibility"; +@import "alignments"; +@import "buttons"; +@import "clearings"; +@import "copy"; +@import "inputs"; +@import "links"; +@import "notices"; diff --git a/themes/pub/wporg/css/settings/_colors.scss b/themes/pub/wporg/css/settings/_colors.scss new file mode 100644 index 0000000..eed256f --- /dev/null +++ b/themes/pub/wporg/css/settings/_colors.scss @@ -0,0 +1,25 @@ +$color__background-body: #fff; +$color__background-screen: #f1f1f1; +$color__background-hr: #eee; +$color__background-button: #eee; +$color__background-pre: #eee; +$color__background-ins: #fff9c0; + +$color__text-screen: #21759b; +$color__text-input: #32373c; +$color__text-input-focus: #111; +$color__link: #0073aa; +$color__link-visited: #4ca6cf; +$color__link-hover: #d54e21; +$color__text-main: #32373c; + +$color__border: #eee; +$color__border-button: #ccc #ccc #bbb; +$color__border-button-hover: #ccc #bbb #aaa; +$color__border-button-focus: #aaa #bbb #bbb; +$color__border-input: #ddd; +$color__border-abbr: #666; + +$color__wp-blue: #0073aa; +$color__base-gray: $color__text-main; +$color__green: #C7E8CA; diff --git a/themes/pub/wporg/css/settings/_modular-scale.scss b/themes/pub/wporg/css/settings/_modular-scale.scss new file mode 100644 index 0000000..f4ba5f6 --- /dev/null +++ b/themes/pub/wporg/css/settings/_modular-scale.scss @@ -0,0 +1,3 @@ +$ms-base: 1rem 1.143rem; +$ms-ratio: 1.25; +$ms-breakpoint: 737px; diff --git a/themes/pub/wporg/css/settings/_settings.scss b/themes/pub/wporg/css/settings/_settings.scss new file mode 100644 index 0000000..0319148 --- /dev/null +++ b/themes/pub/wporg/css/settings/_settings.scss @@ -0,0 +1,4 @@ +@import "colors"; +@import "modular-scale"; +@import "structure"; +@import "typography"; diff --git a/themes/pub/wporg/css/settings/_structure.scss b/themes/pub/wporg/css/settings/_structure.scss new file mode 100644 index 0000000..526d416 --- /dev/null +++ b/themes/pub/wporg/css/settings/_structure.scss @@ -0,0 +1,6 @@ +$sm: 768px !default; +$md: 1024px !default; +$lg: 1200px !default; + +$size__site-main: 960px; +$size__site-sidebar: 25%; diff --git a/themes/pub/wporg/css/settings/_typography.scss b/themes/pub/wporg/css/settings/_typography.scss new file mode 100644 index 0000000..3ed6c03 --- /dev/null +++ b/themes/pub/wporg/css/settings/_typography.scss @@ -0,0 +1,3 @@ +$type__base: 18px; +$type__base-mobile: 16px; +$type__lineheight: 1.5; diff --git a/themes/pub/wporg/css/style.scss b/themes/pub/wporg/css/style.scss new file mode 100644 index 0000000..13780b9 --- /dev/null +++ b/themes/pub/wporg/css/style.scss @@ -0,0 +1,29 @@ +//-------------------------------------------------------------- +// 01 Settings +//------------------------------------------------------------*/ +@import "settings/settings"; + +//-------------------------------------------------------------- +// 02 Tools +//------------------------------------------------------------*/ +@import "tools/tools"; + +//-------------------------------------------------------------- +// 03 Generic +//------------------------------------------------------------*/ +@import "generic/generic"; + +//-------------------------------------------------------------- +// 04 Base +//------------------------------------------------------------*/ +@import "base/base"; + +//-------------------------------------------------------------- +// 05 Objects +//------------------------------------------------------------*/ +@import "objects/objects"; + +//-------------------------------------------------------------- +// 06 Components +//------------------------------------------------------------*/ +@import "components/components"; diff --git a/themes/pub/wporg/css/tools/_breakpoint.scss b/themes/pub/wporg/css/tools/_breakpoint.scss new file mode 100644 index 0000000..4125614 --- /dev/null +++ b/themes/pub/wporg/css/tools/_breakpoint.scss @@ -0,0 +1,32 @@ +// Kube. CSS & JS Framework +// Copyright (c) 2009-2017, Imperavi LLC. +// License: MIT + +@mixin breakpoint($min: 0, $max: 0) { + + $type: type-of($min); + + @if $type == string + { + @if $min == sm + { + @media (max-width: $sm) { @content; } + } + @else if $min == md + { + @media (min-width: $sm) and (max-width: $md) { @content; } + } + @else if $min == lg + { + @media (min-width: $lg) { @content; } + } + } + @else if $type == number + { + $query: "all" !default; + @if $min != 0 and $max != 0 { $query: "(min-width: #{$min}) and (max-width: #{$max})"; } + @else if $min != 0 and $max == 0 { $query: "(min-width: #{$min})"; } + @else if $min == 0 and $max != 0 { $query: "(max-width: #{$max})"; } + @media screen and #{$query} { @content; } + } +} diff --git a/themes/pub/wporg/css/tools/_kube.scss b/themes/pub/wporg/css/tools/_kube.scss new file mode 100644 index 0000000..afc004b --- /dev/null +++ b/themes/pub/wporg/css/tools/_kube.scss @@ -0,0 +1,155 @@ +// Kube. CSS & JS Framework +// Copyright (c) 2009-2017, Imperavi LLC. +// License: MIT + +$grid-columns: 12 !default; +$grid-gutter: 2% !default; +$text-margin-bottom: 16px !default; +$z-over-content: 100 !default; + +// display +@mixin flex { + display: flex; +} + +// basis +@mixin flex-basis($width) { + flex-basis: $width; +} + +// items wrap +@mixin flex-items-wrap { + flex-wrap: wrap; +} + +// items nowrap +@mixin flex-items-nowrap { + flex-wrap: nowrap; +} + +// items row +@mixin flex-items-row { + flex-direction: row; +} + +// items columns +@mixin flex-items-column { + flex-direction: column; +} + +// items left +@mixin flex-items-left { + justify-content: flex-start; +} + +// items right +@mixin flex-items-right { + justify-content: flex-end; +} + +// items center +@mixin flex-items-center { + justify-content: center; +} + +// items between +@mixin flex-items-space-between { + justify-content: space-between; +} + +// items around +@mixin flex-items-space-around { + justify-content: space-around; +} + +// items vertical top +@mixin flex-items-top { + align-items: flex-start; +} + +// items vertical middle +@mixin flex-items-middle { + align-items: center; +} + +// items vertical bottom +@mixin flex-items-bottom { + align-items: flex-end; +} + +// item grow +@mixin flex-item-grow($grow: 0) { + flex-grow: $grow; +} + + +// item auto +@mixin flex-item-auto { + flex: auto; +} + +// item one +@mixin flex-item-one { + flex: 1; +} + +// item shrink +@mixin flex-item-shrink($num: 0) { + flex-shrink: $num; +} + +// item width +@mixin flex-item-width($width) { + flex: 0 0 $width; + + @include breakpoint(sm) { + flex: 0 0 100% !important; + } +} +// Make Row +@mixin grid-row { + @include flex; + @include flex-items-row; + @include flex-items-wrap; + + @include breakpoint(sm) { + @include flex-items-column; + @include flex-items-nowrap; + } +} + +// Generate Columns +@mixin generate-grid-columns { + + @for $i from 1 through $grid-columns + { + .col-#{$i} { + width: 100% / $grid-columns * $i; + } + .offset-#{$i} { + $width: 100% / $grid-columns * $i; + margin-left: $width; + } + + } + + .gutters { + @for $i from 1 through $grid-columns + { + & > .col-#{$i} { + $width: 100% / $grid-columns * $i; + width: calc(#{$width} - #{$grid-gutter}); + } + $n: $grid-columns / $i + 1; + @if $n == floor( $n ) and ($grid-columns / $i) > 1 { + & > .col-#{$i}:nth-child(n+#{$n}) { + margin-top: #{$grid-gutter}; + } + } + & > .offset-#{$i} { + $width: 100% / $grid-columns * $i; + margin-left: calc(#{$width} + #{$grid-gutter}) !important; + } + } + } +} diff --git a/themes/pub/wporg/css/tools/_modular-scale.scss b/themes/pub/wporg/css/tools/_modular-scale.scss new file mode 100644 index 0000000..dbab33e --- /dev/null +++ b/themes/pub/wporg/css/tools/_modular-scale.scss @@ -0,0 +1,1486 @@ +// Golden ratio +$phi : 1.618034 ; +$golden : $phi ; + +$double-octave : 4 ; +$major-twelfth : 3 ; +$major-eleventh : 2.666666667 ; +$major-tenth : 2.5 ; +$octave : 2 ; +$major-seventh : 1.875 ; +$minor-seventh : 1.777777778 ; +$major-sixth : 1.666666667 ; +$minor-sixth : 1.6 ; +$fifth : 1.5 ; +$augmented-fourth : 1.41421 ; +$fourth : 1.333333333 ; +$major-third : 1.25 ; +$minor-third : 1.2 ; +$major-second : 1.125 ; +$minor-second : 1.066666667 ; + + +$ms-base: 1em !default; +$ms-ratio: $golden !default; +$ms-range: null !default; +$ms-fluid: true !default; + + +// Feature testing + + +// Test if the pow() function exists +@function ms-pow-exists() { + @if pow(4, 2) == 16 { + @return true; + } + @return false; +} + +$MS-pow-exists: ms-pow-exists(); + +// Test if MS was installed via the gem +@function ms-gem-exists() { + @if ms-gem-installed() == true { + @return true; + } + @return false; +} + +$MS-gem-exists: ms-gem-exists(); + +// If a native exponent function doesnt exist +// this one is needed. +@function ms-pow($Base, $Exponent) { + + // Find and remove unit. + // Avoids messyness with unit calculations + $Unit: $Base * 0 + 1; + $Base: $Base/$Unit; + + // This function doesnt support non-interger exponents. + // Warn the user about why this is breaking. + @if round($Exponent) != $Exponent { + @warn "Unfortunately, you need Compass to use non-integer exponents"; + } + + // Set up the loop, priming the return with the base. + $Return: $Base; + + // If the number is positive, multiply it. + @if $Exponent > 0 { + // Basic feedback loop as exponents + // are recursivley multiplied numbers. + @for $i from 1 to $Exponent { + $Return: $Return * $Base; + } + } + + // If the number is 0 or negitive + // divide instead of multiply. + @else { + // Libsass doesnt allow negitive values in loops + @for $i from (-1 + 1) to (abs($Exponent) + 1) { + $Return: $Return / $Base; + } + } + + // Return is now compounded redy to be returned. + // Add the unit back onto the number. + @return $Return * $Unit; +} + + +@function ms-calc($Value, $Base: $ms-base, $Ratio: $ms-ratio) { + + // If pow exists use it. + // It supports non-interger values! + @if $MS-pow-exists { + + // The formula for figuring out modular scales is: + // (r^v)*b + @return pow($Ratio, $Value) * $Base; + } + + // If not, use ms-pow(). + // Not as fast or capable of non-integer exponents. + @else { + @return ms-pow($Ratio, $Value) * $Base; + } +} + + +@function ms-reverse-list($list) { + @if length($list) > 1 { + @if nth($list, 1) > nth($list, length($list)) { + $MS-reversed-list: (); + @each $Value in $list { + $MS-reversed-list: join($Value, $MS-reversed-list); + } + @return $MS-reversed-list; + } + } + @return $list; +} + + +@function ms-generate-list($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Create blank lists + $MS-list: (); + $MS-base-list: (); + + // Loop through each ratio AND each base + // to generate all possibilities. + @each $Ratio in $Ratios { + @each $Base in $Bases { + + // Set base variables + $MS-base-list: (); + $Base-counter: 0; + + // Seed list with an initial value + $MS-base-list: $Base; + + // Find values on a positive scale + @if $Value >= 0 { + + // Find lower values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter - 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + } + + // Find values on a negitive scale + @else { + + // Find lower values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-calc: ms-calc($Base-counter, $Base, $Ratio); + // detect if the value excedes the main base value + @if $MS-calc < nth($Bases, 1) { + $MS-base-list: join($MS-base-list, $MS-calc); + } + $Base-counter: $Base-counter - 1; + } + + // Trim outlier base. + @if length($Bases) > 1 { + @for $i from 2 through length($Bases) { + @if nth($MS-base-list, 1) > nth($Bases, 1) { + $MS-new-list: (); + @for $i from 2 through length($MS-base-list) { + $MS-new-list: join($MS-new-list, nth($MS-base-list, $i)); + } + $MS-base-list: $MS-new-list; + } + } + } + } + + // reverse list if its largest to smallest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Add new possibilities to the master list + $MS-list: append($MS-list, $MS-base-list, comma); + + } + } + + // After all the possibilities are found, output a master list + @return $MS-list; +} + + +// List sorting via a modified merge-sort algorythmn +// http://en.wikipedia.org/wiki/Merge_sort + +@function ms-merge($A, $B) { + + $Return: (); + + // Some empty lists get passed through + // so just pass the other list throguh + @if length($A) == 0 { + @return $B; + } + + // If lists fit next to each other, just merge them + // This helps performance skipping the need to check each value + @if nth($A, length($A)) < nth($B, 1) { + @return join($A, $B); + } + @if nth($B, length($B)) < nth($A, 1) { + @return join($B, $A); + } + + // Counters start at 1 + $A-counter: 1; + $B-counter: 1; + + // Start looping through all numbers in array + @while $A-counter <= length($A) and $B-counter <= length($B) { + + // Check if the A value is smaller + // Uses or equal to avoid duplicate numbers + @if nth($A, $A-counter) <= nth($B, $B-counter) { + $Return: join($Return, nth($A, $A-counter)); + $A-counter: $A-counter + 1; + } + + // Check if the B value is smaller + @else if nth($A, $A-counter) > nth($B, $B-counter) { + $Return: join($Return, nth($B, $B-counter)); + $B-counter: $B-counter + 1; + } + } + + // Run through remainder values in the list + @while $A-counter <= length($A) { + $Current: nth($A, $A-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $A-counter: $A-counter + 1; + } + @while $B-counter <= length($B) { + $Current: nth($B, $B-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $B-counter: $B-counter + 1; + } + + // Done! return is now sorted and complete + @return $Return; +} + + + +// Pull it all together +@function ms-sort-list($Lists) { + + $Return: (); + + @each $List in $Lists { + @if $Return == () { + $Return: $List; + } + @else { + $Return: ms-merge($List, $Return); + } + } + + // final cleanup of repeated items + $Last: null; + $New-list: (); + @each $Item in $Return { + @if $Item != $Last { + $New-list: join($New-list, $Item); + } + $Last: $Item; + } + $Return: $New-list; + + + @return $Return; +} + + +@function ms-round-px($Result) { + @if unit($Result) == 'px' { + @return round($Result); + } + @return $Result; +} + + +// The main function that brings it all together +@function ms($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // If no multi-base or multi-ratio stuff is going on + // then just retrn the basic calculaiton + @if length($Bases) == 1 and length($Ratios) == 1 { + @return ms-round-px(ms-calc($Value, $Bases, $Ratios)); + } + + // Do calculations directly in Ruby when avalible + @if $MS-gem-exists { + + // Remove units from bases + $Unit: nth($Bases, 1) * 0 + 1; // Extracts the unit from the base + $Unitless-Bases: (); + @each $Base in $Bases { + $Base: $Base/$Unit; + $Unitless-Bases: join($Unitless-Bases, $Base); + } + + // Calculate natively in Ruby + @return ms-round-px(ms-gem-func($Value, $Unitless-Bases, $Ratios) * $Unit); + } + + // Generate a list of all possible values + $Return: ms-generate-list($Value, $Bases, $Ratios); + + // Sort the generated lists + $Return: ms-sort-list($Return); + + // Reverse list if its negitive. + @if $Value < 0 { + $MS-new-return: (); + @each $i in $Return { + $MS-new-return: join($i, $MS-new-return); + } + $Return: $MS-new-return; + } + + // Normalize value for counting from 1 + // Because CSS counts things from 1 + // So Sass does as well + // So I get to write fun stuff like this + $Value: abs($Value) + 1; + + // Find the correct value in the list + $Return: nth($Return, $Value); + + @return ms-round-px($Return); +} + +// Same function, different name, for good measure. +@function modular-scale($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + @return ms($Value, $Bases, $Ratios); +} + + +// Outputs a list of values instead of a single value +@function ms-list($Start: 0, $End: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Seed results + $Positive-return: (); + $Negitive-return: (); + $Return: (); + + @if $End >= 0 { + // Generate a list of all possible values + $Positive-return: ms-generate-list($End, $Bases, $Ratios); + + // Sort the generated lists + $Positive-return: ms-sort-list($Positive-return); + + // Trim list + $Trim-list: (); + // If the starting value is a positive number + // trim the positive return from that + @if $Start >= 0 { + @for $i from ($Start + 1) through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + // If not, then include everything up to the end. + @else { + @for $i from 1 through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + $Positive-return: $Trim-list; + } + + // Generate a negitive list + @if $Start < 0 { + // Generate a list of all possible values + $Negitive-return: ms-generate-list($Start, $Bases, $Ratios); + + // Sort the generated lists + $Negitive-return: ms-sort-list($Negitive-return); + + // Reverse negitive list results. + $MS-new-return: (); + @each $i in $Negitive-return { + $MS-new-return: join($i, $MS-new-return); + } + $Negitive-return: $MS-new-return; + + // Trim list + $Trim-list: (); + @if $End < 0 { + @for $i from abs($End) through (abs($Start) + 2) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + @else { + @for $i from 2 through (abs($Start) + 1) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + $Negitive-return: $Trim-list; + } + + // Join both positive and negitive possibilities. + $Return: join($Negitive-return, $Positive-return); + + @return $Return; +} + + +// Stripping units is rarely a best practice and this function +// should not be used elsewhere +@function ms-unitless($val) { + $val: $val / ($val - $val + 1); + @return $val; +} + +// Search config for values +@function ms-range($x,$y,$range:$ms-range) { + @return nth(nth($range,$x),$y); +} + +// Generate calc() function +@function ms-respond-calc($value, $n, $range: $ms-range, $base: $ms-base) { + $val1: ms($value,$base,ms-range($n,1,$range)); + $val2: ms($value,$base,ms-range($n+1,1,$range)); + $break1: ms-range($n,2,$range); + $break2: ms-range($n+1,2,$range); + $diff: ms-unitless($val2) - ms-unitless($val1); + @if $ms-fluid { + @return calc( #{$val1} + #{$diff} * ( ( 100vw - #{$break1}) / #{ms-unitless($break2) - ms-unitless($break1)} ) ); + } @else { + @return ms($value,$base,ms-range($n,1,$range)); + } +} + +// Main responsive mixin +@mixin ms-respond($property, $value, $range: $ms-range, $base: $ms-base) { + // If there is no responsive config, just output the property and value + @if $ms-range == null { + #{$property}: ms($value,$base,$ms-ratio); + } @else { + + // Initial value + #{$property}: ms($value,$base,ms-range(1,1,$range)); + + // Loop through breakpoints + @for $i from 1 through (length($range) - 1) { + @media (min-width: ms-range($i,2,$range)) and (max-width: ms-range($i+1,2,$range)) { + #{$property}: ms-respond-calc($value, $i, $range, $base); + } + } + + // Final breakpoint is just an override value + @media (min-width: ms-range(length($range),2,$range)) { + #{$property}: ms($value,$base,ms-range(length($range),1,$range)); + } + } +}// Golden ratio +$phi : 1.618034 ; +$golden : $phi ; + +$double-octave : 4 ; +$major-twelfth : 3 ; +$major-eleventh : 2.666666667 ; +$major-tenth : 2.5 ; +$octave : 2 ; +$major-seventh : 1.875 ; +$minor-seventh : 1.777777778 ; +$major-sixth : 1.666666667 ; +$minor-sixth : 1.6 ; +$fifth : 1.5 ; +$augmented-fourth : 1.41421 ; +$fourth : 1.333333333 ; +$major-third : 1.25 ; +$minor-third : 1.2 ; +$major-second : 1.125 ; +$minor-second : 1.066666667 ; + + +$ms-base: 1em !default; +$ms-ratio: $golden !default; +$ms-range: null !default; +$ms-fluid: true !default; + + +// Feature testing + + +// Test if the pow() function exists +@function ms-pow-exists() { + @if pow(4, 2) == 16 { + @return true; + } + @return false; +} + +$MS-pow-exists: ms-pow-exists(); + +// Test if MS was installed via the gem +@function ms-gem-exists() { + @if ms-gem-installed() == true { + @return true; + } + @return false; +} + +$MS-gem-exists: ms-gem-exists(); + +// If a native exponent function doesnt exist +// this one is needed. +@function ms-pow($Base, $Exponent) { + + // Find and remove unit. + // Avoids messyness with unit calculations + $Unit: $Base * 0 + 1; + $Base: $Base/$Unit; + + // This function doesnt support non-interger exponents. + // Warn the user about why this is breaking. + @if round($Exponent) != $Exponent { + @warn "Unfortunately, you need Compass to use non-integer exponents"; + } + + // Set up the loop, priming the return with the base. + $Return: $Base; + + // If the number is positive, multiply it. + @if $Exponent > 0 { + // Basic feedback loop as exponents + // are recursivley multiplied numbers. + @for $i from 1 to $Exponent { + $Return: $Return * $Base; + } + } + + // If the number is 0 or negitive + // divide instead of multiply. + @else { + // Libsass doesnt allow negitive values in loops + @for $i from (-1 + 1) to (abs($Exponent) + 1) { + $Return: $Return / $Base; + } + } + + // Return is now compounded redy to be returned. + // Add the unit back onto the number. + @return $Return * $Unit; +} + + +@function ms-calc($Value, $Base: $ms-base, $Ratio: $ms-ratio) { + + // If pow exists use it. + // It supports non-interger values! + @if $MS-pow-exists { + + // The formula for figuring out modular scales is: + // (r^v)*b + @return pow($Ratio, $Value) * $Base; + } + + // If not, use ms-pow(). + // Not as fast or capable of non-integer exponents. + @else { + @return ms-pow($Ratio, $Value) * $Base; + } +} + + +@function ms-reverse-list($list) { + @if length($list) > 1 { + @if nth($list, 1) > nth($list, length($list)) { + $MS-reversed-list: (); + @each $Value in $list { + $MS-reversed-list: join($Value, $MS-reversed-list); + } + @return $MS-reversed-list; + } + } + @return $list; +} + + +@function ms-generate-list($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Create blank lists + $MS-list: (); + $MS-base-list: (); + + // Loop through each ratio AND each base + // to generate all possibilities. + @each $Ratio in $Ratios { + @each $Base in $Bases { + + // Set base variables + $MS-base-list: (); + $Base-counter: 0; + + // Seed list with an initial value + $MS-base-list: $Base; + + // Find values on a positive scale + @if $Value >= 0 { + + // Find lower values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter - 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + } + + // Find values on a negitive scale + @else { + + // Find lower values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-calc: ms-calc($Base-counter, $Base, $Ratio); + // detect if the value excedes the main base value + @if $MS-calc < nth($Bases, 1) { + $MS-base-list: join($MS-base-list, $MS-calc); + } + $Base-counter: $Base-counter - 1; + } + + // Trim outlier base. + @if length($Bases) > 1 { + @for $i from 2 through length($Bases) { + @if nth($MS-base-list, 1) > nth($Bases, 1) { + $MS-new-list: (); + @for $i from 2 through length($MS-base-list) { + $MS-new-list: join($MS-new-list, nth($MS-base-list, $i)); + } + $MS-base-list: $MS-new-list; + } + } + } + } + + // reverse list if its largest to smallest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Add new possibilities to the master list + $MS-list: append($MS-list, $MS-base-list, comma); + + } + } + + // After all the possibilities are found, output a master list + @return $MS-list; +} + + +// List sorting via a modified merge-sort algorythmn +// http://en.wikipedia.org/wiki/Merge_sort + +@function ms-merge($A, $B) { + + $Return: (); + + // Some empty lists get passed through + // so just pass the other list throguh + @if length($A) == 0 { + @return $B; + } + + // If lists fit next to each other, just merge them + // This helps performance skipping the need to check each value + @if nth($A, length($A)) < nth($B, 1) { + @return join($A, $B); + } + @if nth($B, length($B)) < nth($A, 1) { + @return join($B, $A); + } + + // Counters start at 1 + $A-counter: 1; + $B-counter: 1; + + // Start looping through all numbers in array + @while $A-counter <= length($A) and $B-counter <= length($B) { + + // Check if the A value is smaller + // Uses or equal to avoid duplicate numbers + @if nth($A, $A-counter) <= nth($B, $B-counter) { + $Return: join($Return, nth($A, $A-counter)); + $A-counter: $A-counter + 1; + } + + // Check if the B value is smaller + @else if nth($A, $A-counter) > nth($B, $B-counter) { + $Return: join($Return, nth($B, $B-counter)); + $B-counter: $B-counter + 1; + } + } + + // Run through remainder values in the list + @while $A-counter <= length($A) { + $Current: nth($A, $A-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $A-counter: $A-counter + 1; + } + @while $B-counter <= length($B) { + $Current: nth($B, $B-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $B-counter: $B-counter + 1; + } + + // Done! return is now sorted and complete + @return $Return; +} + + + +// Pull it all together +@function ms-sort-list($Lists) { + + $Return: (); + + @each $List in $Lists { + @if $Return == () { + $Return: $List; + } + @else { + $Return: ms-merge($List, $Return); + } + } + + // final cleanup of repeated items + $Last: null; + $New-list: (); + @each $Item in $Return { + @if $Item != $Last { + $New-list: join($New-list, $Item); + } + $Last: $Item; + } + $Return: $New-list; + + + @return $Return; +} + + +@function ms-round-px($Result) { + @if unit($Result) == 'px' { + @return round($Result); + } + @return $Result; +} + + +// The main function that brings it all together +@function ms($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // If no multi-base or multi-ratio stuff is going on + // then just retrn the basic calculaiton + @if length($Bases) == 1 and length($Ratios) == 1 { + @return ms-round-px(ms-calc($Value, $Bases, $Ratios)); + } + + // Do calculations directly in Ruby when avalible + @if $MS-gem-exists { + + // Remove units from bases + $Unit: nth($Bases, 1) * 0 + 1; // Extracts the unit from the base + $Unitless-Bases: (); + @each $Base in $Bases { + $Base: $Base/$Unit; + $Unitless-Bases: join($Unitless-Bases, $Base); + } + + // Calculate natively in Ruby + @return ms-round-px(ms-gem-func($Value, $Unitless-Bases, $Ratios) * $Unit); + } + + // Generate a list of all possible values + $Return: ms-generate-list($Value, $Bases, $Ratios); + + // Sort the generated lists + $Return: ms-sort-list($Return); + + // Reverse list if its negitive. + @if $Value < 0 { + $MS-new-return: (); + @each $i in $Return { + $MS-new-return: join($i, $MS-new-return); + } + $Return: $MS-new-return; + } + + // Normalize value for counting from 1 + // Because CSS counts things from 1 + // So Sass does as well + // So I get to write fun stuff like this + $Value: abs($Value) + 1; + + // Find the correct value in the list + $Return: nth($Return, $Value); + + @return ms-round-px($Return); +} + +// Same function, different name, for good measure. +@function modular-scale($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + @return ms($Value, $Bases, $Ratios); +} + + +// Outputs a list of values instead of a single value +@function ms-list($Start: 0, $End: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Seed results + $Positive-return: (); + $Negitive-return: (); + $Return: (); + + @if $End >= 0 { + // Generate a list of all possible values + $Positive-return: ms-generate-list($End, $Bases, $Ratios); + + // Sort the generated lists + $Positive-return: ms-sort-list($Positive-return); + + // Trim list + $Trim-list: (); + // If the starting value is a positive number + // trim the positive return from that + @if $Start >= 0 { + @for $i from ($Start + 1) through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + // If not, then include everything up to the end. + @else { + @for $i from 1 through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + $Positive-return: $Trim-list; + } + + // Generate a negitive list + @if $Start < 0 { + // Generate a list of all possible values + $Negitive-return: ms-generate-list($Start, $Bases, $Ratios); + + // Sort the generated lists + $Negitive-return: ms-sort-list($Negitive-return); + + // Reverse negitive list results. + $MS-new-return: (); + @each $i in $Negitive-return { + $MS-new-return: join($i, $MS-new-return); + } + $Negitive-return: $MS-new-return; + + // Trim list + $Trim-list: (); + @if $End < 0 { + @for $i from abs($End) through (abs($Start) + 2) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + @else { + @for $i from 2 through (abs($Start) + 1) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + $Negitive-return: $Trim-list; + } + + // Join both positive and negitive possibilities. + $Return: join($Negitive-return, $Positive-return); + + @return $Return; +} + + +// Stripping units is rarely a best practice and this function +// should not be used elsewhere +@function ms-unitless($val) { + $val: $val / ($val - $val + 1); + @return $val; +} + +// Search config for values +@function ms-range($x,$y,$range:$ms-range) { + @return nth(nth($range,$x),$y); +} + +// Generate calc() function +@function ms-respond-calc($value, $n, $range: $ms-range, $base: $ms-base) { + $val1: ms($value,$base,ms-range($n,1,$range)); + $val2: ms($value,$base,ms-range($n+1,1,$range)); + $break1: ms-range($n,2,$range); + $break2: ms-range($n+1,2,$range); + $diff: ms-unitless($val2) - ms-unitless($val1); + @if $ms-fluid { + @return calc( #{$val1} + #{$diff} * ( ( 100vw - #{$break1}) / #{ms-unitless($break2) - ms-unitless($break1)} ) ); + } @else { + @return ms($value,$base,ms-range($n,1,$range)); + } +} + +// Main responsive mixin +@mixin ms-respond($property, $value, $range: $ms-range, $base: $ms-base) { + // If there is no responsive config, just output the property and value + @if $ms-range == null { + #{$property}: ms($value,$base,$ms-ratio); + } @else { + + // Initial value + #{$property}: ms($value,$base,ms-range(1,1,$range)); + + // Loop through breakpoints + @for $i from 1 through (length($range) - 1) { + @media (min-width: ms-range($i,2,$range)) and (max-width: ms-range($i+1,2,$range)) { + #{$property}: ms-respond-calc($value, $i, $range, $base); + } + } + + // Final breakpoint is just an override value + @media (min-width: ms-range(length($range),2,$range)) { + #{$property}: ms($value,$base,ms-range(length($range),1,$range)); + } + } +}// Golden ratio +$phi : 1.618034 ; +$golden : $phi ; + +$double-octave : 4 ; +$major-twelfth : 3 ; +$major-eleventh : 2.666666667 ; +$major-tenth : 2.5 ; +$octave : 2 ; +$major-seventh : 1.875 ; +$minor-seventh : 1.777777778 ; +$major-sixth : 1.666666667 ; +$minor-sixth : 1.6 ; +$fifth : 1.5 ; +$augmented-fourth : 1.41421 ; +$fourth : 1.333333333 ; +$major-third : 1.25 ; +$minor-third : 1.2 ; +$major-second : 1.125 ; +$minor-second : 1.066666667 ; + + +$ms-base: 1em !default; +$ms-ratio: $golden !default; +$ms-range: null !default; +$ms-fluid: true !default; + + +// Feature testing + + +// Test if the pow() function exists +@function ms-pow-exists() { + @if pow(4, 2) == 16 { + @return true; + } + @return false; +} + +$MS-pow-exists: ms-pow-exists(); + +// Test if MS was installed via the gem +@function ms-gem-exists() { + @if ms-gem-installed() == true { + @return true; + } + @return false; +} + +$MS-gem-exists: ms-gem-exists(); + +// If a native exponent function doesnt exist +// this one is needed. +@function ms-pow($Base, $Exponent) { + + // Find and remove unit. + // Avoids messyness with unit calculations + $Unit: $Base * 0 + 1; + $Base: $Base/$Unit; + + // This function doesnt support non-interger exponents. + // Warn the user about why this is breaking. + @if round($Exponent) != $Exponent { + @warn "Unfortunately, you need Compass to use non-integer exponents"; + } + + // Set up the loop, priming the return with the base. + $Return: $Base; + + // If the number is positive, multiply it. + @if $Exponent > 0 { + // Basic feedback loop as exponents + // are recursivley multiplied numbers. + @for $i from 1 to $Exponent { + $Return: $Return * $Base; + } + } + + // If the number is 0 or negitive + // divide instead of multiply. + @else { + // Libsass doesnt allow negitive values in loops + @for $i from (-1 + 1) to (abs($Exponent) + 1) { + $Return: $Return / $Base; + } + } + + // Return is now compounded redy to be returned. + // Add the unit back onto the number. + @return $Return * $Unit; +} + + +@function ms-calc($Value, $Base: $ms-base, $Ratio: $ms-ratio) { + + // If pow exists use it. + // It supports non-interger values! + @if $MS-pow-exists { + + // The formula for figuring out modular scales is: + // (r^v)*b + @return pow($Ratio, $Value) * $Base; + } + + // If not, use ms-pow(). + // Not as fast or capable of non-integer exponents. + @else { + @return ms-pow($Ratio, $Value) * $Base; + } +} + + +@function ms-reverse-list($list) { + @if length($list) > 1 { + @if nth($list, 1) > nth($list, length($list)) { + $MS-reversed-list: (); + @each $Value in $list { + $MS-reversed-list: join($Value, $MS-reversed-list); + } + @return $MS-reversed-list; + } + } + @return $list; +} + + +@function ms-generate-list($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Create blank lists + $MS-list: (); + $MS-base-list: (); + + // Loop through each ratio AND each base + // to generate all possibilities. + @each $Ratio in $Ratios { + @each $Base in $Bases { + + // Set base variables + $MS-base-list: (); + $Base-counter: 0; + + // Seed list with an initial value + $MS-base-list: $Base; + + // Find values on a positive scale + @if $Value >= 0 { + + // Find lower values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter - 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + } + + // Find values on a negitive scale + @else { + + // Find lower values on the scale + $Base-counter: 1; + @while ms-calc($Base-counter, $Base, $Ratio) <= nth($Bases, 1) { + $MS-base-list: join($MS-base-list, ms-calc($Base-counter, $Base, $Ratio)); + $Base-counter: $Base-counter + 1; + } + + // Ensure the list is smallest to largest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Find higher possible values on the scale + $Base-counter: -1; + @while ms-calc($Base-counter, $Base, $Ratio) >= ms-calc($Value, nth($Bases, 1), $Ratio) { + $MS-calc: ms-calc($Base-counter, $Base, $Ratio); + // detect if the value excedes the main base value + @if $MS-calc < nth($Bases, 1) { + $MS-base-list: join($MS-base-list, $MS-calc); + } + $Base-counter: $Base-counter - 1; + } + + // Trim outlier base. + @if length($Bases) > 1 { + @for $i from 2 through length($Bases) { + @if nth($MS-base-list, 1) > nth($Bases, 1) { + $MS-new-list: (); + @for $i from 2 through length($MS-base-list) { + $MS-new-list: join($MS-new-list, nth($MS-base-list, $i)); + } + $MS-base-list: $MS-new-list; + } + } + } + } + + // reverse list if its largest to smallest + $MS-base-list: ms-reverse-list($MS-base-list); + + // Add new possibilities to the master list + $MS-list: append($MS-list, $MS-base-list, comma); + + } + } + + // After all the possibilities are found, output a master list + @return $MS-list; +} + + +// List sorting via a modified merge-sort algorythmn +// http://en.wikipedia.org/wiki/Merge_sort + +@function ms-merge($A, $B) { + + $Return: (); + + // Some empty lists get passed through + // so just pass the other list throguh + @if length($A) == 0 { + @return $B; + } + + // If lists fit next to each other, just merge them + // This helps performance skipping the need to check each value + @if nth($A, length($A)) < nth($B, 1) { + @return join($A, $B); + } + @if nth($B, length($B)) < nth($A, 1) { + @return join($B, $A); + } + + // Counters start at 1 + $A-counter: 1; + $B-counter: 1; + + // Start looping through all numbers in array + @while $A-counter <= length($A) and $B-counter <= length($B) { + + // Check if the A value is smaller + // Uses or equal to avoid duplicate numbers + @if nth($A, $A-counter) <= nth($B, $B-counter) { + $Return: join($Return, nth($A, $A-counter)); + $A-counter: $A-counter + 1; + } + + // Check if the B value is smaller + @else if nth($A, $A-counter) > nth($B, $B-counter) { + $Return: join($Return, nth($B, $B-counter)); + $B-counter: $B-counter + 1; + } + } + + // Run through remainder values in the list + @while $A-counter <= length($A) { + $Current: nth($A, $A-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $A-counter: $A-counter + 1; + } + @while $B-counter <= length($B) { + $Current: nth($B, $B-counter); + @if $Current != nth($Return, length($Return)) { + $Return: join($Return, $Current); + } + $B-counter: $B-counter + 1; + } + + // Done! return is now sorted and complete + @return $Return; +} + + + +// Pull it all together +@function ms-sort-list($Lists) { + + $Return: (); + + @each $List in $Lists { + @if $Return == () { + $Return: $List; + } + @else { + $Return: ms-merge($List, $Return); + } + } + + // final cleanup of repeated items + $Last: null; + $New-list: (); + @each $Item in $Return { + @if $Item != $Last { + $New-list: join($New-list, $Item); + } + $Last: $Item; + } + $Return: $New-list; + + + @return $Return; +} + + +@function ms-round-px($Result) { + @if unit($Result) == 'px' { + @return round($Result); + } + @return $Result; +} + + +// The main function that brings it all together +@function ms($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // If no multi-base or multi-ratio stuff is going on + // then just retrn the basic calculaiton + @if length($Bases) == 1 and length($Ratios) == 1 { + @return ms-round-px(ms-calc($Value, $Bases, $Ratios)); + } + + // Do calculations directly in Ruby when avalible + @if $MS-gem-exists { + + // Remove units from bases + $Unit: nth($Bases, 1) * 0 + 1; // Extracts the unit from the base + $Unitless-Bases: (); + @each $Base in $Bases { + $Base: $Base/$Unit; + $Unitless-Bases: join($Unitless-Bases, $Base); + } + + // Calculate natively in Ruby + @return ms-round-px(ms-gem-func($Value, $Unitless-Bases, $Ratios) * $Unit); + } + + // Generate a list of all possible values + $Return: ms-generate-list($Value, $Bases, $Ratios); + + // Sort the generated lists + $Return: ms-sort-list($Return); + + // Reverse list if its negitive. + @if $Value < 0 { + $MS-new-return: (); + @each $i in $Return { + $MS-new-return: join($i, $MS-new-return); + } + $Return: $MS-new-return; + } + + // Normalize value for counting from 1 + // Because CSS counts things from 1 + // So Sass does as well + // So I get to write fun stuff like this + $Value: abs($Value) + 1; + + // Find the correct value in the list + $Return: nth($Return, $Value); + + @return ms-round-px($Return); +} + +// Same function, different name, for good measure. +@function modular-scale($Value: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + @return ms($Value, $Bases, $Ratios); +} + + +// Outputs a list of values instead of a single value +@function ms-list($Start: 0, $End: 0, $Bases: $ms-base, $Ratios: $ms-ratio) { + + // Seed results + $Positive-return: (); + $Negitive-return: (); + $Return: (); + + @if $End >= 0 { + // Generate a list of all possible values + $Positive-return: ms-generate-list($End, $Bases, $Ratios); + + // Sort the generated lists + $Positive-return: ms-sort-list($Positive-return); + + // Trim list + $Trim-list: (); + // If the starting value is a positive number + // trim the positive return from that + @if $Start >= 0 { + @for $i from ($Start + 1) through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + // If not, then include everything up to the end. + @else { + @for $i from 1 through $End + 1 { + $Trim-list: join($Trim-list, nth($Positive-return, $i)); + } + } + $Positive-return: $Trim-list; + } + + // Generate a negitive list + @if $Start < 0 { + // Generate a list of all possible values + $Negitive-return: ms-generate-list($Start, $Bases, $Ratios); + + // Sort the generated lists + $Negitive-return: ms-sort-list($Negitive-return); + + // Reverse negitive list results. + $MS-new-return: (); + @each $i in $Negitive-return { + $MS-new-return: join($i, $MS-new-return); + } + $Negitive-return: $MS-new-return; + + // Trim list + $Trim-list: (); + @if $End < 0 { + @for $i from abs($End) through (abs($Start) + 2) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + @else { + @for $i from 2 through (abs($Start) + 1) { + $Trim-list: join(nth($Negitive-return, $i), $Trim-list); + } + } + $Negitive-return: $Trim-list; + } + + // Join both positive and negitive possibilities. + $Return: join($Negitive-return, $Positive-return); + + @return $Return; +} + + +// Stripping units is rarely a best practice and this function +// should not be used elsewhere +@function ms-unitless($val) { + $val: $val / ($val - $val + 1); + @return $val; +} + +// Search config for values +@function ms-range($x,$y,$range:$ms-range) { + @return nth(nth($range,$x),$y); +} + +// Generate calc() function +@function ms-respond-calc($value, $n, $range: $ms-range, $base: $ms-base) { + $val1: ms($value,$base,ms-range($n,1,$range)); + $val2: ms($value,$base,ms-range($n+1,1,$range)); + $break1: ms-range($n,2,$range); + $break2: ms-range($n+1,2,$range); + $diff: ms-unitless($val2) - ms-unitless($val1); + @if $ms-fluid { + @return calc( #{$val1} + #{$diff} * ( ( 100vw - #{$break1}) / #{ms-unitless($break2) - ms-unitless($break1)} ) ); + } @else { + @return ms($value,$base,ms-range($n,1,$range)); + } +} + +// Main responsive mixin +@mixin ms-respond($property, $value, $range: $ms-range, $base: $ms-base) { + // If there is no responsive config, just output the property and value + @if $ms-range == null { + #{$property}: ms($value,$base,$ms-ratio); + } @else { + + // Initial value + #{$property}: ms($value,$base,ms-range(1,1,$range)); + + // Loop through breakpoints + @for $i from 1 through (length($range) - 1) { + @media (min-width: ms-range($i,2,$range)) and (max-width: ms-range($i+1,2,$range)) { + #{$property}: ms-respond-calc($value, $i, $range, $base); + } + } + + // Final breakpoint is just an override value + @media (min-width: ms-range(length($range),2,$range)) { + #{$property}: ms($value,$base,ms-range(length($range),1,$range)); + } + } +} diff --git a/themes/pub/wporg/css/tools/_tools.scss b/themes/pub/wporg/css/tools/_tools.scss new file mode 100644 index 0000000..46bd9ca --- /dev/null +++ b/themes/pub/wporg/css/tools/_tools.scss @@ -0,0 +1,3 @@ +@import "breakpoint"; +@import "kube"; +@import "modular-scale"; diff --git a/themes/pub/wporg/css/trumps/_trumps.scss b/themes/pub/wporg/css/trumps/_trumps.scss new file mode 100644 index 0000000..e69de29 diff --git a/themes/pub/wporg/footer-wporg.php b/themes/pub/wporg/footer-wporg.php new file mode 100644 index 0000000..5c5c46b --- /dev/null +++ b/themes/pub/wporg/footer-wporg.php @@ -0,0 +1,14 @@ + + + + esc_html__( 'Primary', 'wporg' ), + ) ); + + /* + * Switch default core markup for search form, comment form, and comments + * to output valid HTML5. + */ + add_theme_support( 'html5', array( + 'search-form', + 'comment-form', + 'comment-list', + 'gallery', + 'caption', + ) ); + + // Set up the WordPress core custom background feature. + add_theme_support( 'custom-background', apply_filters( 'wporg_custom_background_args', array( + 'default-color' => 'ffffff', + 'default-image' => '', + ) ) ); + + add_theme_support( 'wp4-styles' ); +} +add_action( 'after_setup_theme', __NAMESPACE__ . '\setup' ); + +/** + * Sets the document title. + * + * The global $pagetitle is used by the global w.org header. + * + * @global string $pagetitle + */ +function set_document_title() { + $GLOBALS['pagetitle'] = wp_get_document_title(); +} +add_action( 'template_redirect', __NAMESPACE__ . '\set_document_title' ); + +/** + * Set the separator for the document title. + * + * @return string Document title separator. + */ +function document_title_separator() { + return '|'; +} +add_filter( 'document_title_separator', __NAMESPACE__ . '\document_title_separator' ); + +/** + * Set the content width in pixels, based on the theme's design and stylesheet. + * + * Priority 0 to make it available to lower priority callbacks. + * + * @global int $content_width + */ +function content_width() { + $GLOBALS['content_width'] = apply_filters( 'wporg_content_width', 612 ); +} +add_action( 'after_setup_theme', __NAMESPACE__ . '\content_width', 0 ); + +/** + * Enqueue scripts and styles. + */ +function scripts() { + $script_debug = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG; + $suffix = $script_debug ? '' : '.min'; + + // Concatenates core scripts when possible. + if ( ! $script_debug ) { + $GLOBALS['concatenate_scripts'] = true; + } + + wp_enqueue_style( 'wporg-style', get_theme_file_uri( '/css/style.css' ), [ 'dashicons', 'open-sans' ], '20180702' ); + wp_style_add_data( 'wporg-style', 'rtl', 'replace' ); + + // phpcs:ignore Squiz.PHP.CommentedOutCode.Found, Squiz.Commenting.InlineComment.InvalidEndChar + // wp_enqueue_script( 'wporg-navigation', get_template_directory_uri() . "/js/navigation$suffix.js", array(), '20151215', true ); + wp_enqueue_script( 'wporg-plugins-skip-link-focus-fix', get_template_directory_uri() . "/js/skip-link-focus-fix$suffix.js", array(), '20151215', true ); + + if ( ! is_front_page() && is_singular() && comments_open() && get_option( 'thread_comments' ) ) { + wp_enqueue_script( 'comment-reply' ); + } + + // No Jetpack scripts needed. + add_filter( 'jetpack_implode_frontend_css', '__return_false' ); + wp_dequeue_script( 'devicepx' ); + + /* + * No Grofiles needed. + * + * Enqueued so that it's overridden in the global footer. + */ + wp_register_script( 'grofiles-cards', false ); + wp_enqueue_script( 'grofiles-cards' ); +} +add_action( 'wp_enqueue_scripts', __NAMESPACE__ . '\scripts' ); + +/** + * Filters an enqueued style's fully-qualified URL. + * + * @param string $src The source URL of the enqueued style. + * @param string $handle The style's registered handle. + * @return string + */ +function style_src( $src, $handle ) { + $cdn_handles = [ + 'wporg-style', + 'dashicons', + ]; + + if ( defined( 'WPORG_SANDBOXED' ) && WPORG_SANDBOXED ) { + return $src; + } + + // Use CDN url. + if ( in_array( $handle, $cdn_handles, true ) ) { + $src = str_replace( get_home_url(), 'https://s.w.org', $src ); + } + + // Remove version argument. + if ( in_array( $handle, [ 'open-sans' ], true ) ) { + $src = remove_query_arg( 'ver', $src ); + } + + return $src; +} +add_filter( 'style_loader_src', __NAMESPACE__ . '\style_src', 10, 2 ); + +/** + * Add postMessage support for site title and description for the Theme Customizer. + * + * @param \WP_Customize_Manager $wp_customize Theme Customizer object. + */ +function customize_register( $wp_customize ) { + $wp_customize->get_setting( 'blogname' )->transport = 'postMessage'; + $wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage'; +} +add_action( 'customize_register', __NAMESPACE__ . '\customize_register' ); + +/** + * Binds JS handlers to make Theme Customizer preview reload changes asynchronously. + */ +function customize_preview_js() { + wp_enqueue_script( 'wporg_plugins_customizer', get_template_directory_uri() . '/js/customizer.js', array( 'customize-preview' ), '20151215', true ); +} +add_action( 'customize_preview_init', __NAMESPACE__ . '\customize_preview_js' ); + + +/** + * Adds hreflang link attributes to WordPress.org pages. + * + * @link https://support.google.com/webmasters/answer/189077?hl=en Use hreflang for language and regional URLs. + * @link https://sites.google.com/site/webmasterhelpforum/en/faq-internationalisation FAQ: Internationalisation. + */ +function hreflang_link_attributes() { + // No hreflangs on 404 pages. + if ( is_404() ) { + return; + } + + wp_cache_add_global_groups( array( 'locale-associations' ) ); + + // Google doesn't have support for a whole lot of languages and throws errors about it, + // so we exclude them, as we're otherwise outputting data that isn't used at all. + $unsupported_languages = array( + 'arq', + 'art', + 'art-xemoji', + 'ary', + 'ast', + 'az-ir', + 'azb', + 'bcc', + 'ff-sn', + 'frp', + 'fuc', + 'fur', + 'haz', + 'ido', + 'io', + 'kab', + 'li', + 'li-nl', + 'lmo', + 'me', + 'me-me', + 'rhg', + 'rup', + 'sah', + 'sc-it', + 'scn', + 'skr', + 'srd', + 'szl', + 'tah', + 'twd', + 'ty-tj', + 'tzm', + ); + + $sites = wp_cache_get( 'local-sites', 'locale-associations' ); + + if ( false === $sites ) { + global $wpdb; + + // phpcs:ignore WordPress.VIP.DirectDatabaseQuery.DirectQuery + $sites = $wpdb->get_results( 'SELECT locale, subdomain FROM locales', OBJECT_K ); + if ( ! $sites ) { + return; + } + + require_once GLOTPRESS_LOCALES_PATH; + + foreach ( $sites as $site ) { + $gp_locale = \GP_Locales::by_field( 'wp_locale', $site->locale ); + if ( ! $gp_locale ) { + unset( $sites[ $site->locale ] ); + continue; + } + + // Skip non-existing subdomains, e.g. 'de_CH_informal'. + if ( false !== strpos( $site->subdomain, '_' ) ) { + unset( $sites[ $site->locale ] ); + continue; + } + + if ( isset( $gp_locale->slug ) && ! in_array( $gp_locale->slug, $unsupported_languages ) ) { + $sites[ $site->locale ]->hreflang = $gp_locale->slug; + } else { + unset( $sites[ $site->locale ] ); + } + } + + // Add en_US to the list of sites. + $sites['en_US'] = (object) array( + 'locale' => 'en_US', + 'hreflang' => 'en', + 'subdomain' => '', + ); + + // Add x-default to the list of sites. + $sites['x-default'] = (object) array( + 'locale' => 'x-default', + 'hreflang' => 'x-default', + 'subdomain' => '', + ); + + uasort( $sites, function( $a, $b ) { + return strcasecmp( $a->hreflang, $b->hreflang ); + } ); + + wp_cache_set( 'local-sites', $sites, 'locale-associations' ); + } + + if ( is_singular() ) { + $path = parse_url( get_permalink(), PHP_URL_PATH ); + } else { + // WordPress doesn't have a good way to get the canonical version of non-singular urls. + $path = $_SERVER['REQUEST_URI']; // phpcs:ignore + } + + foreach ( $sites as $site ) { + $url = sprintf( + 'https://%swordpress.org%s', + $site->subdomain ? "{$site->subdomain}." : '', + $path + ); + + printf( + '' . "\n", + esc_url( $url ), + esc_attr( $site->hreflang ) + ); + } +} +add_action( 'wp_head', __NAMESPACE__ . '\hreflang_link_attributes' ); + +/** + * Custom template tags. + */ +require_once get_template_directory() . '/inc/template-tags.php'; diff --git a/themes/pub/wporg/header-page.php b/themes/pub/wporg/header-page.php new file mode 100644 index 0000000..2b8e016 --- /dev/null +++ b/themes/pub/wporg/header-page.php @@ -0,0 +1,19 @@ + section and everything up till
+ * + * @link https://codex.wordpress.org/Template_Hierarchy + * + * @package WordPressdotorg\Theme + */ + +namespace WordPressdotorg\Theme; + +get_template_part( 'header', 'wporg' ); +?> +
+ + +
diff --git a/themes/pub/wporg/header-wporg.php b/themes/pub/wporg/header-wporg.php new file mode 100644 index 0000000..b5c0593 --- /dev/null +++ b/themes/pub/wporg/header-wporg.php @@ -0,0 +1,14 @@ + section and the wp.org header. + * + * @link https://codex.wordpress.org/Template_Hierarchy + * + * @package WordPressdotorg\Theme + */ + +namespace WordPressdotorg\Theme; + +require WPORGPATH . 'header.php'; diff --git a/themes/pub/wporg/header.php b/themes/pub/wporg/header.php new file mode 100644 index 0000000..38ec122 --- /dev/null +++ b/themes/pub/wporg/header.php @@ -0,0 +1,22 @@ + section and everything up till
+ * + * @link https://codex.wordpress.org/Template_Hierarchy + * + * @package WordPressdotorg\Theme + */ + +namespace WordPressdotorg\Theme; + +global $wporg_global_header_options; +if ( !isset( $wporg_global_header_options['in_wrapper'] ) ) + $wporg_global_header_options['in_wrapper'] = ''; +$wporg_global_header_options['in_wrapper'] .= ''; + +get_template_part( 'header', 'wporg' ); +?> +
+
diff --git a/themes/pub/wporg/images/wp-logo-blue-trans-blur.png b/themes/pub/wporg/images/wp-logo-blue-trans-blur.png new file mode 100644 index 0000000..28d3e0b Binary files /dev/null and b/themes/pub/wporg/images/wp-logo-blue-trans-blur.png differ diff --git a/themes/pub/wporg/images/wp-logo-blue.png b/themes/pub/wporg/images/wp-logo-blue.png new file mode 100644 index 0000000..74eba26 Binary files /dev/null and b/themes/pub/wporg/images/wp-logo-blue.png differ diff --git a/themes/pub/wporg/inc/footer.php b/themes/pub/wporg/inc/footer.php new file mode 100644 index 0000000..a24903b --- /dev/null +++ b/themes/pub/wporg/inc/footer.php @@ -0,0 +1,21 @@ + + + + + + + + diff --git a/themes/pub/wporg/inc/header.php b/themes/pub/wporg/inc/header.php new file mode 100644 index 0000000..a9eec4f --- /dev/null +++ b/themes/pub/wporg/inc/header.php @@ -0,0 +1,58 @@ + section and everything up until
+ * + * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials + * + * @package WordPressdotorg\Theme + */ + +namespace WordPressdotorg\Theme; + +?> + +> + + + + + + + + +> +
+
+ +

WordPress.org

+ +
+ + +
+
+
diff --git a/themes/pub/wporg/inc/template-tags.php b/themes/pub/wporg/inc/template-tags.php new file mode 100644 index 0000000..93c7b42 --- /dev/null +++ b/themes/pub/wporg/inc/template-tags.php @@ -0,0 +1,179 @@ +%2$s', + esc_url( get_permalink() ), + get_entry_date() + ); + + $author_string = sprintf( + '%2$s', + esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ), + get_the_author() + ); + + // phpcs:disable WordPress.XSS.EscapeOutput.OutputNotEscaped + printf( + /* translators: 1: post date 2: post author */ + '' . __( 'Posted on %1$s by %2$s.', 'wporg' ) . '', + $time_string, + $author_string + ); + // phpcs:enable WordPress.XSS.EscapeOutput.OutputNotEscaped + } + + $format = get_post_format(); + if ( current_theme_supports( 'post-formats', $format ) ) { + printf( + '%1$s%3$s', + sprintf( '%s ', esc_html_x( 'Format', 'Used before post format.', 'wporg' ) ), + esc_url( get_post_format_link( $format ) ), + esc_html( get_post_format_string( $format ) ) + ); + } + + if ( 'post' === get_post_type() ) { + entry_taxonomies(); + } + + if ( ! is_singular() && ! post_password_required() && ( comments_open() || get_comments_number() ) ) { + echo ''; + comments_popup_link( sprintf( + /* translators: Post title. */ + __( 'Leave a comment on %s', 'wporg' ), + get_the_title() + ) ); + echo ''; + } + } +endif; + +if ( ! function_exists( __NAMESPACE__ . '\get_entry_date' ) ) : + /** + * Prints HTML with published and updated information for current post. + * + * Create your own WordPressdotorg\Theme\get_entry_date() function to override in a child theme. + */ + function get_entry_date() { + $time_string = ''; + + if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) { + $time_string = ''; + } + + return sprintf( + $time_string, + esc_attr( get_the_date( 'c' ) ), + get_the_date(), + esc_attr( get_the_modified_date( 'c' ) ), + get_the_modified_date() + ); + } +endif; + +if ( ! function_exists( __NAMESPACE__ . '\entry_date' ) ) : + /** + * Prints HTML with date information for current post. + * + * Create your own WordPressdotorg\Theme\entry_date() function to override in a child theme. + */ + function entry_date() { + printf( + '%1$s %3$s', + esc_html_x( 'Posted on', 'Used before publish date.', 'wporg' ), + esc_url( get_permalink() ), + get_entry_date() // phpcs:ignore WordPress.XSS.EscapeOutput.OutputNotEscaped + ); + } +endif; + +if ( ! function_exists( __NAMESPACE__ . '\entry_taxonomies' ) ) : + /** + * Prints HTML with category and tags for current post. + * + * Create your own WordPressdotorg\Theme\entry_taxonomies() function to override in a child theme. + */ + function entry_taxonomies() { + $categories_list = get_the_category_list( _x( ', ', 'Used between list items, there is a space after the comma.', 'wporg' ) ); + if ( $categories_list && categorized_blog() ) { + printf( + '%1$s %2$s', + esc_html_x( 'Categories', 'Used before category names.', 'wporg' ), + $categories_list // phpcs:ignore WordPress.XSS.EscapeOutput.OutputNotEscaped + ); + } + + $tags_list = get_the_tag_list( '', _x( ', ', 'Used between list items, there is a space after the comma.', 'wporg' ) ); + if ( $tags_list ) { + printf( + '%1$s %2$s', + esc_html_x( 'Tags', 'Used before tag names.', 'wporg' ), + $tags_list // phpcs:ignore WordPress.XSS.EscapeOutput.OutputNotEscaped + ); + } + } +endif; + +if ( ! function_exists( __NAMESPACE__ . '\categorized_blog' ) ) : + /** + * Determines whether blog/site has more than one category. + * + * Create your own WordPressdotorg\Theme\categorized_blog() function to override in a child theme. + * + * @return bool True if there is more than one category, false otherwise. + */ + function categorized_blog() { + $all_the_cool_cats = get_transient( 'wporg_categories' ); + + if ( false === $all_the_cool_cats ) { + // Create an array of all the categories that are attached to posts. + $all_the_cool_cats = get_categories( array( + 'fields' => 'ids', + // We only need to know if there is more than one category. + 'number' => 2, + ) ); + + // Count the number of categories that are attached to the posts. + $all_the_cool_cats = count( $all_the_cool_cats ); + + set_transient( 'wporg_categories', $all_the_cool_cats ); + } + + if ( $all_the_cool_cats > 1 ) { + // This blog has more than 1 category so wporg_categorized_blog should return true. + return true; + } else { + // This blog has only 1 category so wporg_categorized_blog should return false. + return false; + } + } +endif; + +/** + * Flushes out the transients used in wporg_categorized_blog(). + */ +function category_transient_flusher() { + if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) { + return; + } + + // Like, beat it. Dig? + delete_transient( 'wporg_categories' ); +} +add_action( 'edit_category', __NAMESPACE__ . '\category_transient_flusher' ); +add_action( 'save_post', __NAMESPACE__ . '\category_transient_flusher' ); diff --git a/themes/pub/wporg/index.php b/themes/pub/wporg/index.php new file mode 100644 index 0000000..0f9a530 --- /dev/null +++ b/themes/pub/wporg/index.php @@ -0,0 +1,43 @@ + + +
+ + + +
+ + -1, + isOpera = navigator.userAgent.toLowerCase().indexOf( 'opera' ) > -1, + isIe = navigator.userAgent.toLowerCase().indexOf( 'msie' ) > -1; + + if ( ( isWebkit || isOpera || isIe ) && document.getElementById && window.addEventListener ) { + window.addEventListener( 'hashchange', function() { + var id = location.hash.substring( 1 ), + element; + + if ( ! ( /^[A-z0-9_-]+$/.test( id ) ) ) { + return; + } + + element = document.getElementById( id ); + + if ( element ) { + if ( ! ( /^(?:a|select|input|button|textarea)$/i.test( element.tagName ) ) ) { + element.tabIndex = -1; + } + + element.focus(); + } + }, false ); + } +})(); diff --git a/themes/pub/wporg/js/skip-link-focus-fix.min.js b/themes/pub/wporg/js/skip-link-focus-fix.min.js new file mode 100644 index 0000000..f85253c --- /dev/null +++ b/themes/pub/wporg/js/skip-link-focus-fix.min.js @@ -0,0 +1 @@ +!function(){var e=-1 + +
+ + + +
+ + + +
+ + + +
+

+ +

+
+ + + + + + + +
+ + + + diff --git a/themes/pub/wporg/single.php b/themes/pub/wporg/single.php new file mode 100644 index 0000000..0f41aaa --- /dev/null +++ b/themes/pub/wporg/single.php @@ -0,0 +1,46 @@ + + +
+ + ' ' . + '' . __( 'Next post:', 'wporg' ) . ' ' . + '%title', + 'prev_text' => ' ' . + '' . __( 'Previous post:', 'wporg' ) . ' ' . + '%title', + // phpcs:enable WordPress.WhiteSpace.PrecisionAlignment.Found + ] ); + endwhile; // End of the loop. + ?> + +
+ + + +
+
+

+
+ +
+ + +

+ Get started here.', 'wporg' ), // phpcs:ignore WordPress.XSS.EscapeOutput.OutputNotEscaped + esc_url( admin_url( 'post-new.php' ) ) + ); + ?> +

+ + + +

+ + + + +

+ + + +
+
diff --git a/themes/pub/wporg/template-parts/content-page.php b/themes/pub/wporg/template-parts/content-page.php new file mode 100644 index 0000000..02d37ad --- /dev/null +++ b/themes/pub/wporg/template-parts/content-page.php @@ -0,0 +1,41 @@ + + +
> +
+ ', '' ); ?> +
+ +
+ '
' . esc_html__( 'Pages:', 'wporg' ), + 'after' => '
', + ) ); + ?> +
+ +
+ "', '"', false ) + ), + '', + '' + ); + ?> +
+
diff --git a/themes/pub/wporg/template-parts/content.php b/themes/pub/wporg/template-parts/content.php new file mode 100644 index 0000000..e2bcbb2 --- /dev/null +++ b/themes/pub/wporg/template-parts/content.php @@ -0,0 +1,61 @@ + + +
> +
+ + + ', '' ); + else : + the_title( sprintf( '

', esc_url( get_permalink() ) ), '

' ); + endif; + ?> +
+ +
+ +
+ "%s" →', 'wporg' ), + get_the_title() + ) ); + + wp_link_pages( array( + 'before' => '
' . __( 'Pages:', 'wporg' ) . '', + 'after' => '
', + 'link_before' => '', + 'link_after' => '', + 'pagelink' => '' . __( 'Page', 'wporg' ) . ' %', + 'separator' => ', ', + ) ); + ?> +
+ +
+ "%s"', 'wporg' ), + get_the_title() + ), + '', + '' + ); + ?> +
+