Congegni
/
barebones
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

V3 amends

This commit is contained in:
Pedro Reis 2019-01-08 10:52:31 +00:00
parent 422d2e705a
commit 87e7ce065d
23 changed files with 383 additions and 388 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
assets/scripts/scripts.js
View File

@ -4,10 +4,12 @@ import $ from 'jquery';
* Mobile navigation toggle * Mobile navigation toggle
* @param {mixed} event * @param {mixed} event
*/ */
const toggleMenu = (event) => { const toggleMenu = (event) => {
event.preventDefault(); event.preventDefault();
$('.js-menu-toggle, .nav--header').toggleClass('open'); $('.js-menu-toggle, .nav--header').toggleClass('open');
$('.header').toggleClass('menu-open'); $('.header').toggleClass('menu-open');
}; };
$('.js-menu-toggle').on('click', toggleMenu); $('.js-menu-toggle').on('click', toggleMenu);

9
assets/styles/base/_base.scss
View File

@ -16,18 +16,20 @@ p,
hr, hr,
ul, ul,
ol, ol,
dl, dl {
address {
margin-bottom: $base-spacing-unit; margin-bottom: $base-spacing-unit;
&:last-child {
margin-bottom: 0;
}
} }
/** /**
* Basic styles for links * Basic styles for links
*/ */
a { a {
color: $brand-colour; color: $brand-colour;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
color: $base-colour; color: $base-colour;
text-decoration: underline; text-decoration: underline;
@ -45,6 +47,7 @@ a[href^="tel"] {
/** /**
* Rules * Rules
*/ */
hr { hr {
height: 1px; height: 1px;
background-color: $base-colour; background-color: $base-colour;

70
assets/styles/base/_forms.scss
View File

@ -1,6 +1,3 @@
/**
* Blanket input styles for normalisation
*/
*:focus { *:focus {
outline: 0; outline: 0;
} }
@ -12,9 +9,9 @@ textarea {
border: solid 1px $base-colour; border: solid 1px $base-colour;
border-radius: 0; border-radius: 0;
color: $base-colour; color: $base-colour;
line-height: ($base-spacing-unit * 1.5); line-height: $base-spacing-unit * 1.5;
height: ($base-spacing-unit * 1.5); height: $base-spacing-unit * 1.5;
padding: 0 ($base-spacing-unit / 2); padding: 0 #{$base-spacing-unit / 2};
width: 100%; width: 100%;
} }
@ -30,7 +27,7 @@ input[type="radio"] {
input[type="file"] { input[type="file"] {
line-height: normal; line-height: normal;
height: auto; height: auto;
padding: ($base-spacing-unit / 4) ($base-spacing-unit / 2); padding: #{$base-spacing-unit / 4} #{$base-spacing-unit / 2};
} }
input[type="submit"] { input[type="submit"] {
@ -45,11 +42,11 @@ input[disabled] {
select { select {
line-height: normal; line-height: normal;
padding: 0; padding: 0;
padding-left: ($base-spacing-unit / 2); padding-left: $base-spacing-unit / 2;
} }
textarea { textarea {
min-height: ($base-spacing-unit * 4); min-height: $base-spacing-unit * 4;
overflow: auto; overflow: auto;
vertical-align: top; vertical-align: top;
resize: vertical; resize: vertical;
@ -60,67 +57,20 @@ textarea {
/** /**
* Form utility classes * Form utility classes
*/ */
.form--inline { .form--inline {
.form__group { .form__group {
display: inline-block; display: inline-block;
} }
} }
.checkbox, .form {
.radio { .form__group {
display: block;
padding-left: $base-spacing-unit;
&.inline {
display: inline-block;
}
> input {
float: left;
margin-left: -($base-spacing-unit);
margin-top: 4px;
}
}
.form__group {
display: block; display: block;
margin-bottom: $base-spacing-unit; margin-bottom: $base-spacing-unit;
} .form__label {
.form__label {
display: block; display: block;
margin-bottom: ($base-spacing-unit / 2); margin-bottom: ($base-spacing-unit / 2);
}
/**
* Input Group
*
* Allows for prepend/append of elements
* (such as icons) on an input.
*/
.input-group {
position: relative;
> input {
padding: 0 ($base-spacing-unit * 2);
}
.input-group__addon {
line-height: ($base-spacing-unit * 1.5);
height: ($base-spacing-unit * 1.5);
position: absolute;
text-align: center;
top: 0;
width: ($base-spacing-unit * 1.5);
&:first-child {
left: 0;
}
&:last-child {
right: 0;
} }
} }
} }

2
assets/styles/base/_images.scss
View File

@ -4,9 +4,11 @@ img {
vertical-align: top; vertical-align: top;
} }
/** /**
* Responsive images * Responsive images
*/ */
.is-fluid { .is-fluid {
display: block; display: block;
width: 100%; width: 100%;

6
assets/styles/components/_buttons.scss
View File

@ -3,7 +3,7 @@
color: $base-background-colour; color: $base-background-colour;
border: 1px solid transparent; border: 1px solid transparent;
display: inline-block; display: inline-block;
padding: ($base-spacing-unit / 4) $base-spacing-unit; padding: #{$base-spacing-unit / 4} $base-spacing-unit;
text-align: center; text-align: center;
white-space: nowrap; white-space: nowrap;
vertical-align: middle; vertical-align: middle;
@ -22,7 +22,7 @@
text-decoration: none; text-decoration: none;
background-color: $base-background-colour; background-color: $base-background-colour;
color: $brand-colour; color: $brand-colour;
border: 1px solid $brand-colour; border-color: $brand-colour;
} }
&.is-disabled, &.is-disabled,
@ -40,7 +40,7 @@
&:hover { &:hover {
background-color: $brand-colour; background-color: $brand-colour;
color: $base-background-colour; color: $base-background-colour;
border: 1px solid transparent; border-color: transparent;
} }
} }

13
assets/styles/components/_nav.scss
View File

@ -1,4 +1,7 @@
// hamburger menu /**
* Hamburger menu
*/
.nav-burger { .nav-burger {
position: fixed; position: fixed;
top: $base-spacing-unit; top: $base-spacing-unit;
@ -35,9 +38,11 @@
} }
// applies to all navs /**
* Navs
*/
.nav { .nav {
ul {
list-style: none; list-style: none;
margin: 0; margin: 0;
@ -52,11 +57,9 @@
display: block; display: block;
} }
} }
}
} }
.nav--header { .nav--header {
// header nav styling goes here
// mobile nav // mobile nav
@include resp-max($breakpoint-md) { @include resp-max($breakpoint-md) {

6
assets/styles/config/_mixins.scss
View File

@ -1,7 +1,8 @@
/* /*
* Media query to respond to a minimum size (mobile first) * Media query to respond to a minimum size (mobile first)
*/ */
@mixin resp-min($size) {
@mixin resp-min($size) {
@media screen and (min-width: $size) { @media screen and (min-width: $size) {
@content; @content;
} }
@ -11,6 +12,7 @@
/* /*
* Media query to respond to a maximum size * Media query to respond to a maximum size
*/ */
@mixin resp-max($size) { @mixin resp-max($size) {
@media screen and (max-width: $size) { @media screen and (max-width: $size) {
@content; @content;
@ -21,6 +23,7 @@
/* /*
* Output font size in px/rem * Output font size in px/rem
*/ */
@mixin font-size($px) { @mixin font-size($px) {
font-size: $px + px; font-size: $px + px;
font-size: #{$px / 16}rem; font-size: #{$px / 16}rem;
@ -30,6 +33,7 @@
/* /*
* Placeholder mixin for <input> * Placeholder mixin for <input>
*/ */
@mixin placeholder { @mixin placeholder {
$placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input"; $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
@each $placeholder in $placeholders { @each $placeholder in $placeholders {

28
assets/styles/utils/_helpers.scss
View File

@ -1,6 +1,7 @@
/** /**
* Clearing and floating * Clearing and floating
*/ */
.alignleft, .alignleft,
.float-left { .float-left {
float: left; float: left;
@ -15,7 +16,7 @@
float: right; float: right;
img & { img & {
margin-left : $base-spacing-unit; margin-left: $base-spacing-unit;
} }
} }
@ -33,14 +34,14 @@
} }
.clearfix { .clearfix {
@include clearfix(); @include clearfix;
} }
/** /**
* Text aligments * Text aligments
*/ */
.align-text-left { .align-text-left {
text-align: left; text-align: left;
} }
@ -55,8 +56,9 @@
/** /**
* Elements visibility * Elements visibility
*/ */
.visible-on-mobile { .visible-on-mobile {
display: none !important; display: none !important;
@ -82,3 +84,19 @@
display: none !important; display: none !important;
} }
} }
/**
* Accessibility
*/
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}

6
assets/styles/vendor/simple-grid/_mixins.scss vendored
View File

@ -7,6 +7,12 @@
@if $i != 0 { @if $i != 0 {
.col--#{$name}-#{$i} { .col--#{$name}-#{$i} {
width: percentage($i/$grid-columns); width: percentage($i/$grid-columns);
.row--flex & {
flex-basis: percentage($i/$grid-columns);
max-width: percentage($i/$grid-columns);
width: auto;
float: none;
}
} }
} }
.col--#{$name}-offset-#{$i} { .col--#{$name}-offset-#{$i} {

8
assets/styles/vendor/simple-grid/simple-grid.scss vendored
View File

@ -19,12 +19,18 @@
} }
.row { .row {
@include clearfix;
list-style: none; list-style: none;
margin-left: -$grid-gutter; margin-left: -$grid-gutter;
&:not(.row--flex) {
@include clearfix;
}
&.row--gutterless { &.row--gutterless {
margin-left: 0; margin-left: 0;
} }
&.row--flex {
display: flex;
flex-wrap: wrap;
}
} }
.col { .col {

1
css/core.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
css/styles.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
footer.php
View File

@ -3,7 +3,7 @@
<nav class="footer__navigation"> <nav class="footer__navigation">
<?php wp_nav_menu(['theme_location' => 'footer', 'menu_class' => 'nav nav--footer']); ?> <?php wp_nav_menu(['theme_location' => 'footer', 'menu_class' => 'nav nav--footer']); ?>
</nav> </nav>
&copy; <?php bloginfo('name'); ?> <?php echo date('Y'); ?> <p class="footer__copyright">&copy; <?php echo get_bloginfo( 'name' ); ?> <?php echo date('Y'); ?></p>
</div> </div>
</footer> </footer>
<?php wp_footer(); ?> <?php wp_footer(); ?>

24
functions.php
View File

@ -11,12 +11,13 @@ require_once 'includes/custom-functions.php';
* Add support for useful stuff * Add support for useful stuff
*/ */
if (function_exists('add_theme_support')) { if ( function_exists( 'add_theme_support' ) ) {
// Add support for document title tag // Add support for document title tag
add_theme_support('title-tag'); add_theme_support( 'title-tag' );
// Add Thumbnail Theme Support // Add Thumbnail Theme Support
add_theme_support('post-thumbnails'); add_theme_support( 'post-thumbnails' );
// add_image_size( 'custom-size', 700, 200, true ); // add_image_size( 'custom-size', 700, 200, true );
// Add Support for post formats // Add Support for post formats
@ -24,7 +25,7 @@ if (function_exists('add_theme_support')) {
// add_post_type_support( 'page', 'excerpt' ); // add_post_type_support( 'page', 'excerpt' );
// Localisation Support // Localisation Support
load_theme_textdomain('barebones', get_template_directory() . '/languages'); load_theme_textdomain( 'barebones', get_template_directory() . '/languages' );
} }
@ -32,7 +33,7 @@ if (function_exists('add_theme_support')) {
* Hide admin bar * Hide admin bar
*/ */
add_filter('show_admin_bar', '__return_false'); add_filter( 'show_admin_bar', '__return_false' );
/** /**
@ -70,10 +71,10 @@ add_filter('post_comments_feed_link', 'barebones_post_comments_feed_link');
function barebones_enqueue_scripts() { function barebones_enqueue_scripts() {
// wp_enqueue_style( 'fonts', '//fonts.googleapis.com/css?family=Font+Family' ); // wp_enqueue_style( 'fonts', '//fonts.googleapis.com/css?family=Font+Family' );
// wp_enqueue_style( 'icons', '//use.fontawesome.com/releases/v5.0.10/css/all.css' ); // wp_enqueue_style( 'icons', '//use.fontawesome.com/releases/v5.0.10/css/all.css' );
wp_enqueue_script('scripts', get_stylesheet_directory_uri() . '/js/scripts.min.js?' . filemtime(get_stylesheet_directory() . '/js/scripts.min.js'), [], null, true); wp_enqueue_script( 'scripts', get_stylesheet_directory_uri() . '/js/scripts.min.js?' . filemtime( get_stylesheet_directory() . '/js/scripts.min.js' ), [], null, true );
} }
add_action('wp_enqueue_scripts', 'barebones_enqueue_scripts'); add_action( 'wp_enqueue_scripts', 'barebones_enqueue_scripts' );
/** /**
@ -84,11 +85,12 @@ add_action('wp_enqueue_scripts', 'barebones_enqueue_scripts');
function barebones_register_nav_menus() { function barebones_register_nav_menus() {
register_nav_menus([ register_nav_menus([
'header' => 'Header' 'header' => 'Header',
'footer' => 'Footer',
]); ]);
} }
add_action('after_setup_theme', 'barebones_register_nav_menus', 0); add_action( 'after_setup_theme', 'barebones_register_nav_menus', 0 );
/** /**
@ -134,7 +136,7 @@ add_shortcode('button', 'barebones_button_shortcode');
*/ */
function barebones_mce_buttons_2( $buttons ) { function barebones_mce_buttons_2( $buttons ) {
array_unshift($buttons, 'styleselect'); array_unshift( $buttons, 'styleselect' );
$buttons[] = 'hr'; $buttons[] = 'hr';
return $buttons; return $buttons;
@ -212,7 +214,7 @@ function front_page_on_pages_menu() {
global $submenu; global $submenu;
if ( get_option( 'page_on_front' ) ) { if ( get_option( 'page_on_front' ) ) {
$submenu['edit.php?post_type=page'][501] = array( $submenu['edit.php?post_type=page'][501] = array(
'Front Page', __( 'Front Page', 'barebones' ),
'manage_options', 'manage_options',
get_edit_post_link( get_option( 'page_on_front' ) ) get_edit_post_link( get_option( 'page_on_front' ) )
); );

2
header.php
View File

@ -24,7 +24,7 @@
<div class="container"> <div class="container">
<a href="<?php bloginfo('url'); ?>" class="header__logo"> <a href="<?php bloginfo('url'); ?>" class="header__logo">
<?php echo is_front_page() ? '<h1>' : ''; ?> <?php echo is_front_page() ? '<h1>' : ''; ?>
<img src="<?php bloginfo('stylesheet_directory'); ?>/img/logo.svg" onerror="this.src='<?php bloginfo('stylesheet_directory'); ?>/img/logo.png'" alt="<?php bloginfo('title'); ?>" /> <img src="<?php echo get_bloginfo( 'stylesheet_directory' ); ?>/img/logo.svg" onerror="this.src='<?php echo get_bloginfo( 'stylesheet_directory' ); ?>/img/logo.png'" alt="<?php echo get_bloginfo( 'title' ); ?>" />
<?php echo is_front_page() ? '</h1>' : ''; ?> <?php echo is_front_page() ? '</h1>' : ''; ?>
</a> </a>
<a href="#" class="nav-burger js-menu-toggle"> <a href="#" class="nav-burger js-menu-toggle">

2
js/scripts.min.js vendored
View File

File diff suppressed because one or more lines are too long

4
page.php
View File

@ -3,12 +3,12 @@
<main class="main" role="main"> <main class="main" role="main">
<div class="container"> <div class="container">
<?php while (have_posts()) : the_post(); ?> <?php while ( have_posts() ) : the_post(); ?>
<article <?php post_class(); ?>> <article <?php post_class(); ?>>
<header role="heading"> <header role="heading">
<h3 class="post__title"><?php the_title(); ?></h3> <h1 class="post__title"><?php the_title(); ?></h1>
</header> </header>
<?php the_content(); ?> <?php the_content(); ?>

4
single.php
View File

@ -3,12 +3,12 @@
<main class="main" role="main"> <main class="main" role="main">
<div class="container"> <div class="container">
<?php while (have_posts()) : the_post(); ?> <?php while ( have_posts() ) : the_post(); ?>
<article <?php post_class(); ?>> <article <?php post_class(); ?>>
<header class="post__header" role="heading"> <header class="post__header" role="heading">
<h3 class="post__title"><?php the_title(); ?></h3> <h1 class="post__title"><?php the_title(); ?></h1>
</header> </header>
<?php the_content(); ?> <?php the_content(); ?>