Explorar o código

Barnsbury: Misc style adjustments

Takashi Irie %!s(int64=5) %!d(string=hai) anos
pai
achega
35796aee5b

+ 2 - 2
barnsbury/sass/_config-child-theme-deep.scss

@@ -54,7 +54,7 @@ $config-global: (
 		"line-height": (
 			"base": strip-unit($typescale-base),
 			"body": 1.6,
-			"heading": 1.2,
+			"heading": 1.15,
 		),
 	),
 
@@ -327,7 +327,7 @@ $config-header: (
 			"weight": bold,
 			"line-height": 1,
 		),
-		"link-padding": (0.66 * map-deep-get($config-global, "spacing", "unit")),
+		"link-padding": (0.5 * map-deep-get($config-global, "spacing", "unit")),
 	),
 
 	"social-nav": (

+ 172 - 91
barnsbury/sass/_extra-child-theme.scss

@@ -17,48 +17,41 @@ a {
 /**
  * Header
  */
-
-.site-header {
-
-	margin-left: auto;
-	margin-right: auto;
+.site-header,
+.site-footer {
+	max-width: 100%;
+	padding-left: $spacing_unit;
+	padding-right: $spacing_unit;
 	position: relative;
 
-	@extend %responsive-alignfull;
-
-	padding: $spacing_unit;
-
 	@include media(mobile) {
 		padding: $spacing_vertical;
 	}
+}
 
-/*
-	.main-navigation {
-		margin-bottom: 0;
-	}
-
-	.social-navigation {
-		line-height: 1;
-		margin-top: 0;
+.social-navigation {
+	a {
+		vertical-align: middle;
 	}
-*/
 
-	.social-navigation ul li a svg {
+	ul li a svg {
 		display: block;
-		width: $spacing_vertical;
-		height: $spacing_vertical;
+		width: (1.5 * $spacing_unit);
+		height: (1.5 * $spacing_unit);
 		transform: translateZ(0);
 	}
+}
 
-	/**
-	 * CSS-grid Desktop Menu
-	 */
-	@include media(mobile) {
+/**
+ * CSS-grid Desktop Menu
+ */
+@include media(mobile) {
+	.site-header {
 		align-items: center;
 		display: grid;
 		grid-template-columns: auto;
 		grid-template-rows: auto;
-		grid-column-gap: #{map-deep-get($config-global, "spacing", "unit")};
+		grid-column-gap: $spacing_unit;
 		grid-template-areas:
 			"site-logo site-logo"
 			"site-title main-navigation"
@@ -74,93 +67,93 @@ a {
 			margin-top: 0;
 			margin-bottom: 0;
 		}
+	}
 
-		.site-logo {
-			grid-area: site-logo;
-			margin-bottom: #{map-deep-get($config-global, "spacing", "unit")};
-		}
+	.site-logo {
+		grid-area: site-logo;
+		margin-bottom: $spacing_unit;
+	}
 
-		.site-title {
-			align-self: flex-end;
-			grid-area: site-title;
+	.site-title {
+		align-self: flex-end;
+		grid-area: site-title;
 
-			& + .site-description {
-				margin-top: 0;
-			}
+		& + .site-description {
+			margin-top: 0;
 		}
+	}
 
-		.site-description {
-			align-self: center;
-			grid-area: site-description;
-		}
+	.site-description {
+		align-self: center;
+		grid-area: site-description;
+	}
 
-		.main-navigation {
-			align-self: center;
-			grid-area: main-navigation;
-			justify-self: flex-end;
+	.main-navigation {
+		align-self: center;
+		grid-area: main-navigation;
+		justify-self: flex-end;
 
-			& > div > ul {
-				justify-content: flex-end;
-				margin-left: -#{0.5 * map-deep-get($config-global, "spacing", "horizontal")};
-				margin-right: -#{0.5 * map-deep-get($config-global, "spacing", "horizontal")};
+		& > div > ul {
+			justify-content: flex-end;
+			margin-left: -#{0.5 * map-deep-get($config-global, "spacing", "horizontal")};
+			margin-right: -#{0.5 * map-deep-get($config-global, "spacing", "horizontal")};
 
-				& > li {
-					padding: #{map-deep-get($config-header, "main-nav", "link-padding")};
+			& > li {
+				padding: #{map-deep-get($config-header, "main-nav", "link-padding")};
 
-					& > a {
-						padding: 0;
-					}
+				& > a {
+					padding: 0;
 				}
+			}
 
-				& > .menu-item-has-children > a::after {
-						font-size: #{0.5 * map-deep-get($config-global, "font", "size", "base")};
-				}
+			& > .menu-item-has-children > a::after {
+					font-size: #{0.5 * map-deep-get($config-global, "font", "size", "base")};
 			}
+		}
 
-			& > div > ul > li:hover,
-			& > div > ul > li.focus,
-			& > div > ul > li.current-menu-item {
+		& > div > ul > li:hover,
+		& > div > ul > li.focus,
+		& > div > ul > li.current-menu-item {
 
-				& > a {
-					color: #{map-deep-get($config-global, "color", "primary", "default")};
-				}
+			& > a {
+				color: #{map-deep-get($config-global, "color", "primary", "default")};
+			}
 
-				& > ul {
-					box-shadow: none;
-					overflow: hidden;
-
-					&:before {
-						border-bottom: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid #{map-deep-get($config-global, "color", "primary", "default")};
-						border-left: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid transparent;
-						border-right: #{0.5 * map-deep-get($config-global, "spacing", "unit")} solid transparent;
-						content: "";
-						display: block;
-						margin-left: #{map-deep-get($config-global, "spacing", "unit")};
-						width: #{map-deep-get($config-global, "spacing", "unit")};
-					}
+			& > ul {
+				box-shadow: none;
+				overflow: hidden;
+
+				&:before {
+					border-bottom: (0.5 * $spacing_unit) solid #{map-deep-get($config-global, "color", "primary", "default")};
+					border-left: (0.5 * $spacing_unit) solid transparent;
+					border-right: (0.5 * $spacing_unit) solid transparent;
+					content: "";
+					display: block;
+					margin-left: $spacing_unit;
+					width: $spacing_unit;
 				}
+			}
 
-				& li {
+			& li {
 
-					& > a {
-						background: #{map-deep-get($config-global, "color", "primary", "default")};
-						color: #{map-deep-get($config-global, "color", "background", "default")};
-					}
+				& > a {
+					background: #{map-deep-get($config-global, "color", "primary", "default")};
+					color: #{map-deep-get($config-global, "color", "background", "default")};
+				}
 
-					&:hover > a,
-					&.focus > a,
-					&.current-menu-item > a {
-						background: #{map-deep-get($config-global, "color", "primary", "hover")};
-					}
+				&:hover > a,
+				&.focus > a,
+				&.current-menu-item > a {
+					background: #{map-deep-get($config-global, "color", "primary", "hover")};
 				}
 			}
 		}
+	}
 
-		.social-navigation {
-			align-self: center;
-			grid-area: social-navigation;
-			justify-self: flex-end;
-		}
+	.social-navigation {
+		align-self: center;
+		grid-area: social-navigation;
+		justify-self: flex-end;
 	}
 }
 
@@ -234,6 +227,94 @@ a {
  * Widgets
  */
 
+@include media(laptop) {
+	.site-footer .widget-area {
+		max-width: 100%;
+
+		& > .widget {
+			max-width: 50%;
+		}
+	}
+}
+
+.widget {
+	select {
+		max-width: 100%;
+	}
+}
+
 .widget-title {
-	font-size: map-deep-get($config-heading, "font", "size", "h3"),
+	font-size: #{map-deep-get($config-heading, "font", "size", "h5")};
+	margin-bottom: #{0.5 * $spacing_vertical};
+}
+
+.widget_archive,
+.widget_categories,
+.widget_meta,
+.widget_nav_menu,
+.widget_pages,
+.widget_recent_comments,
+.widget_recent_entries,
+.widget_rss {
+
+	ul {
+		margin-left: 0;
+		margin-right: 0;
+		list-style: none;
+
+		li {
+			color: map-deep-get($config-global, "color", "foreground", "light");
+			font-weight: 600;
+		}
+
+		ul {
+			counter-reset: submenu;
+		}
+
+		ul > li > a::before {
+			font-weight: normal;
+			content: "\2013\00a0" counters(submenu, "\2013\00a0", none);
+			counter-increment: submenu
+		}
+	}
+}
+
+.widget_tag_cloud {
+	.tagcloud {
+		font-weight: 600;
+	}
+}
+
+.widget_search {
+	.search-field {
+		width: 100%;
+
+		@include media(mobile) {
+			width: auto;
+		}
+	}
+
+	.search-submit {
+		display: block;
+		margin-top: $typescale-base;
+	}
+}
+
+.widget_calendar .calendar_wrap {
+	text-align: center;
+
+	table td,
+	table th {
+		border: none;
+	}
+
+	a {
+		text-decoration: underline;
+	}
+}
+
+.widget_links li,
+.widget_jp_blogs_i_follow li,
+.widget_rss_links li {
+	font-family: inherit;
 }

+ 14 - 14
barnsbury/style-editor.css

@@ -207,7 +207,7 @@ blockquote {
 blockquote p {
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 blockquote cite,
@@ -359,7 +359,7 @@ object {
 .wp-block-cover-image h2 {
 	font-size: 2.28776em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 	padding: 0;
 	max-width: inherit;
 	text-align: inherit;
@@ -394,37 +394,37 @@ object {
 .wp-block-heading h1, h1, .h1 {
 	font-size: 2.69955em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-heading h2, h2, .h2 {
 	font-size: 2.28776em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-heading h3, h3, .h3 {
 	font-size: 1.93878em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-heading h4, h4, .h4 {
 	font-size: 1.64303em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-heading h5, h5, .h5 {
 	font-size: 1.3924em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-heading h6, h6, .h6 {
 	font-size: 1.18em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-gallery figcaption {
@@ -439,7 +439,7 @@ object {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	font-weight: bold;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-latest-posts:not(.is-grid) > li {
@@ -525,7 +525,7 @@ p.has-background:not(.has-background-background-color) a {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-pullquote a {
@@ -595,7 +595,7 @@ p.has-background:not(.has-background-background-color) a {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.93878em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-separator,
@@ -647,7 +647,7 @@ table th,
 	font-weight: bold;
 	font-size: 2.28776em;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .has-primary-color[class] {
@@ -748,14 +748,14 @@ table th,
 .is-large-text,
 .has-large-font-size {
 	font-size: 1.3924em;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .is-larger-text,
 .has-larger-font-size,
 .has-huge-font-size {
 	font-size: 1.64303em;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .has-drop-cap:not(:focus)::first-letter {

+ 176 - 79
barnsbury/style-rtl.css

@@ -917,7 +917,7 @@ blockquote {
 blockquote p {
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 blockquote cite,
@@ -1252,7 +1252,7 @@ input.has-focus[type="submit"],
 .wp-block-cover-image h2 {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 	max-width: inherit;
 	text-align: inherit;
 	padding: 0;
@@ -1413,37 +1413,37 @@ h6, .h6 {
 h1, .h1 {
 	font-size: 2.69955rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h2, .h2 {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h3, .h3 {
 	font-size: 1.93878rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h4, .h4 {
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h5, .h5 {
 	font-size: 1.3924rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h6, .h6 {
 	font-size: 1.18rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-image figcaption {
@@ -1529,7 +1529,7 @@ img {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	font-weight: bold;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-latest-posts .wp-block-latest-posts__post-date {
@@ -1773,7 +1773,7 @@ p.has-background {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-pullquote a {
@@ -1852,7 +1852,7 @@ p.has-background {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-quote .wp-block-quote__citation,
@@ -1882,7 +1882,7 @@ p.has-background {
 .wp-block-quote.is-style-large p, .wp-block-quote.is-large p {
 	font-size: 1.93878rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-quote.is-style-large .wp-block-quote__citation,
@@ -2131,14 +2131,14 @@ table th,
 .is-large-text,
 .has-large-font-size {
 	font-size: 1.3924rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .is-larger-text,
 .has-larger-font-size,
 .has-huge-font-size {
 	font-size: 1.64303rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .has-drop-cap:not(:focus)::first-letter {
@@ -2464,12 +2464,12 @@ table th,
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1rem;
 	font-weight: bold;
-	padding: 5.28px 0;
+	padding: 4px 0;
 }
 
 @media only screen and (min-width: 560px) {
 	.main-navigation a {
-		padding: 10.56px;
+		padding: 8px;
 	}
 }
 
@@ -2489,8 +2489,8 @@ table th,
 }
 
 .main-navigation .sub-menu .menu-item a {
-	padding-top: 5.28px;
-	padding-bottom: 5.28px;
+	padding-top: 4px;
+	padding-bottom: 4px;
 }
 
 .main-navigation .sub-menu .menu-item a::before {
@@ -2642,7 +2642,7 @@ table th,
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 0.84746rem;
 	font-weight: bold;
-	padding: 10.56px;
+	padding: 8px;
 	color: currentColor;
 }
 
@@ -2657,7 +2657,7 @@ table th,
 .entry-title {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .entry-meta,
@@ -2864,7 +2864,7 @@ table th,
 	font-size: 1rem;
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 /**
@@ -2957,7 +2957,7 @@ table th,
 .comment-metadata,
 .reply {
 	font-size: 0.71818rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .reply {
@@ -3274,7 +3274,7 @@ img#wpstats {
 	}
 }
 
-.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .site-header {
+.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery {
 	margin-right: -16px;
 	margin-left: -16px;
 	width: calc(100% + 32px);
@@ -3283,7 +3283,7 @@ img#wpstats {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .site-header {
+	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery {
 		margin-right: inherit;
 		margin-left: inherit;
 		width: inherit;
@@ -3506,39 +3506,35 @@ a {
 /**
  * Header
  */
-.site-header {
-	margin-right: auto;
-	margin-left: auto;
+.site-header,
+.site-footer {
+	max-width: 100%;
+	padding-right: 16px;
+	padding-left: 16px;
 	position: relative;
-	padding: 16px;
-	/*
-	.main-navigation {
-		margin-bottom: 0;
-	}
-
-	.social-navigation {
-		line-height: 1;
-		margin-top: 0;
-	}
-*/
-	/**
-	 * CSS-grid Desktop Menu
-	 */
 }
 
 @media only screen and (min-width: 560px) {
-	.site-header {
-		padding: 16px 0;
+	.site-header,
+	.site-footer {
+		padding: 32px;
 	}
 }
 
-.site-header .social-navigation ul li a svg {
+.social-navigation a {
+	vertical-align: middle;
+}
+
+.social-navigation ul li a svg {
 	display: block;
-	width: 32px;
-	height: 32px;
+	width: 24px;
+	height: 24px;
 	transform: translateZ(0);
 }
 
+/**
+ * CSS-grid Desktop Menu
+ */
 @media only screen and (min-width: 560px) {
 	.site-header {
 		align-items: center;
@@ -3556,54 +3552,54 @@ a {
 		margin-top: 0;
 		margin-bottom: 0;
 	}
-	.site-header .site-logo {
+	.site-logo {
 		grid-area: site-logo;
 		margin-bottom: 16px;
 	}
-	.site-header .site-title {
+	.site-title {
 		align-self: flex-end;
 		grid-area: site-title;
 	}
-	.site-header .site-title + .site-description {
+	.site-title + .site-description {
 		margin-top: 0;
 	}
-	.site-header .site-description {
+	.site-description {
 		align-self: center;
 		grid-area: site-description;
 	}
-	.site-header .main-navigation {
+	.main-navigation {
 		align-self: center;
 		grid-area: main-navigation;
 		justify-self: flex-end;
 	}
-	.site-header .main-navigation > div > ul {
+	.main-navigation > div > ul {
 		justify-content: flex-end;
 		margin-right: -8px;
 		margin-left: -8px;
 	}
-	.site-header .main-navigation > div > ul > li {
-		padding: 10.56px;
+	.main-navigation > div > ul > li {
+		padding: 8px;
 	}
-	.site-header .main-navigation > div > ul > li > a {
+	.main-navigation > div > ul > li > a {
 		padding: 0;
 	}
-	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
+	.main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;
 	}
-	.site-header .main-navigation > div > ul > li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.main-navigation > div > ul > li:hover > a,
+	.main-navigation > div > ul > li.focus > a,
+	.main-navigation > div > ul > li.current-menu-item > a {
 		color: #20603C;
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul,
-	.site-header .main-navigation > div > ul > li.focus > ul,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
+	.main-navigation > div > ul > li:hover > ul,
+	.main-navigation > div > ul > li.focus > ul,
+	.main-navigation > div > ul > li.current-menu-item > ul {
 		box-shadow: none;
 		overflow: hidden;
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul:before,
-	.site-header .main-navigation > div > ul > li.focus > ul:before,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul:before {
+	.main-navigation > div > ul > li:hover > ul:before,
+	.main-navigation > div > ul > li.focus > ul:before,
+	.main-navigation > div > ul > li.current-menu-item > ul:before {
 		border-bottom: 8px solid #20603C;
 		border-right: 8px solid transparent;
 		border-left: 8px solid transparent;
@@ -3612,24 +3608,24 @@ a {
 		margin-right: 16px;
 		width: 16px;
 	}
-	.site-header .main-navigation > div > ul > li:hover li > a,
-	.site-header .main-navigation > div > ul > li.focus li > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li > a {
+	.main-navigation > div > ul > li:hover li > a,
+	.main-navigation > div > ul > li.focus li > a,
+	.main-navigation > div > ul > li.current-menu-item li > a {
 		background: #20603C;
 		color: #FFFDF6;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:hover > a,
-	.site-header .main-navigation > div > ul > li:hover li.focus > a,
-	.site-header .main-navigation > div > ul > li:hover li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.focus li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus li.focus > a,
-	.site-header .main-navigation > div > ul > li.focus li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:hover > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
+	.main-navigation > div > ul > li:hover li:hover > a,
+	.main-navigation > div > ul > li:hover li.focus > a,
+	.main-navigation > div > ul > li:hover li.current-menu-item > a,
+	.main-navigation > div > ul > li.focus li:hover > a,
+	.main-navigation > div > ul > li.focus li.focus > a,
+	.main-navigation > div > ul > li.focus li.current-menu-item > a,
+	.main-navigation > div > ul > li.current-menu-item li:hover > a,
+	.main-navigation > div > ul > li.current-menu-item li.focus > a,
+	.main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
 		background: #133a24;
 	}
-	.site-header .social-navigation {
+	.social-navigation {
 		align-self: center;
 		grid-area: social-navigation;
 		justify-self: flex-end;
@@ -3704,6 +3700,107 @@ a {
 /**
  * Widgets
  */
+@media only screen and (min-width: 782px) {
+	.site-footer .widget-area {
+		max-width: 100%;
+	}
+	.site-footer .widget-area > .widget {
+		max-width: 50%;
+	}
+}
+
+.widget select {
+	max-width: 100%;
+}
+
 .widget-title {
-	font-size: 1.93878rem;
+	font-size: 1.3924rem;
+	margin-bottom: 16px;
+}
+
+.widget_archive ul,
+.widget_categories ul,
+.widget_meta ul,
+.widget_nav_menu ul,
+.widget_pages ul,
+.widget_recent_comments ul,
+.widget_recent_entries ul,
+.widget_rss ul {
+	margin-right: 0;
+	margin-left: 0;
+	list-style: none;
+}
+
+.widget_archive ul li,
+.widget_categories ul li,
+.widget_meta ul li,
+.widget_nav_menu ul li,
+.widget_pages ul li,
+.widget_recent_comments ul li,
+.widget_recent_entries ul li,
+.widget_rss ul li {
+	color: #844d4d;
+	font-weight: 600;
+}
+
+.widget_archive ul ul,
+.widget_categories ul ul,
+.widget_meta ul ul,
+.widget_nav_menu ul ul,
+.widget_pages ul ul,
+.widget_recent_comments ul ul,
+.widget_recent_entries ul ul,
+.widget_rss ul ul {
+	counter-reset: submenu;
+}
+
+.widget_archive ul ul > li > a::before,
+.widget_categories ul ul > li > a::before,
+.widget_meta ul ul > li > a::before,
+.widget_nav_menu ul ul > li > a::before,
+.widget_pages ul ul > li > a::before,
+.widget_recent_comments ul ul > li > a::before,
+.widget_recent_entries ul ul > li > a::before,
+.widget_rss ul ul > li > a::before {
+	font-weight: normal;
+	content: "– " counters(submenu, "– ", none);
+	counter-increment: submenu;
+}
+
+.widget_tag_cloud .tagcloud {
+	font-weight: 600;
+}
+
+.widget_search .search-field {
+	width: 100%;
+}
+
+@media only screen and (min-width: 560px) {
+	.widget_search .search-field {
+		width: auto;
+	}
+}
+
+.widget_search .search-submit {
+	display: block;
+	margin-top: 1rem;
+}
+
+.widget_calendar .calendar_wrap {
+	text-align: center;
+}
+
+.widget_calendar .calendar_wrap table td,
+.widget_calendar .calendar_wrap table th {
+	border: none;
+}
+
+.widget_calendar .calendar_wrap a {
+	text-decoration: underline;
+}
+
+.widget_links li,
+.widget_jp_blogs_i_follow li,
+.widget_rss_links li {
+	font-family: inherit;
 }

+ 175 - 78
barnsbury/style.css

@@ -917,7 +917,7 @@ blockquote {
 blockquote p {
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 blockquote cite,
@@ -1252,7 +1252,7 @@ input.has-focus[type="submit"],
 .wp-block-cover-image h2 {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 	max-width: inherit;
 	text-align: inherit;
 	padding: 0;
@@ -1413,37 +1413,37 @@ h6, .h6 {
 h1, .h1 {
 	font-size: 2.69955rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h2, .h2 {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h3, .h3 {
 	font-size: 1.93878rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h4, .h4 {
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h5, .h5 {
 	font-size: 1.3924rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 h6, .h6 {
 	font-size: 1.18rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-image figcaption {
@@ -1529,7 +1529,7 @@ img {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	font-weight: bold;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-latest-posts .wp-block-latest-posts__post-date {
@@ -1773,7 +1773,7 @@ p.has-background {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-pullquote a {
@@ -1852,7 +1852,7 @@ p.has-background {
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1.64303rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-quote .wp-block-quote__citation,
@@ -1882,7 +1882,7 @@ p.has-background {
 .wp-block-quote.is-style-large p, .wp-block-quote.is-large p {
 	font-size: 1.93878rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .wp-block-quote.is-style-large .wp-block-quote__citation,
@@ -2136,14 +2136,14 @@ table th,
 .is-large-text,
 .has-large-font-size {
 	font-size: 1.3924rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .is-larger-text,
 .has-larger-font-size,
 .has-huge-font-size {
 	font-size: 1.64303rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .has-drop-cap:not(:focus)::first-letter {
@@ -2481,12 +2481,12 @@ table th,
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 1rem;
 	font-weight: bold;
-	padding: 5.28px 0;
+	padding: 4px 0;
 }
 
 @media only screen and (min-width: 560px) {
 	.main-navigation a {
-		padding: 10.56px;
+		padding: 8px;
 	}
 }
 
@@ -2506,8 +2506,8 @@ table th,
 }
 
 .main-navigation .sub-menu .menu-item a {
-	padding-top: 5.28px;
-	padding-bottom: 5.28px;
+	padding-top: 4px;
+	padding-bottom: 4px;
 }
 
 .main-navigation .sub-menu .menu-item a::before {
@@ -2659,7 +2659,7 @@ table th,
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	font-size: 0.84746rem;
 	font-weight: bold;
-	padding: 10.56px;
+	padding: 8px;
 	color: currentColor;
 }
 
@@ -2674,7 +2674,7 @@ table th,
 .entry-title {
 	font-size: 2.28776rem;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .entry-meta,
@@ -2881,7 +2881,7 @@ table th,
 	font-size: 1rem;
 	font-family: "Rubik", Trebuchet MS, Lucida Grande, Lucida Sans Unicode, Lucida Sans, Tahoma, sans-serif;
 	letter-spacing: normal;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 /**
@@ -2974,7 +2974,7 @@ table th,
 .comment-metadata,
 .reply {
 	font-size: 0.71818rem;
-	line-height: 1.2;
+	line-height: 1.15;
 }
 
 .reply {
@@ -3291,7 +3291,7 @@ img#wpstats {
 	}
 }
 
-.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .site-header {
+.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery {
 	margin-left: -16px;
 	margin-right: -16px;
 	width: calc(100% + 32px);
@@ -3300,7 +3300,7 @@ img#wpstats {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .site-header {
+	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery {
 		margin-left: inherit;
 		margin-right: inherit;
 		width: inherit;
@@ -3535,39 +3535,35 @@ a {
 /**
  * Header
  */
-.site-header {
-	margin-left: auto;
-	margin-right: auto;
+.site-header,
+.site-footer {
+	max-width: 100%;
+	padding-left: 16px;
+	padding-right: 16px;
 	position: relative;
-	padding: 16px;
-	/*
-	.main-navigation {
-		margin-bottom: 0;
-	}
-
-	.social-navigation {
-		line-height: 1;
-		margin-top: 0;
-	}
-*/
-	/**
-	 * CSS-grid Desktop Menu
-	 */
 }
 
 @media only screen and (min-width: 560px) {
-	.site-header {
+	.site-header,
+	.site-footer {
 		padding: 32px;
 	}
 }
 
-.site-header .social-navigation ul li a svg {
+.social-navigation a {
+	vertical-align: middle;
+}
+
+.social-navigation ul li a svg {
 	display: block;
-	width: 32px;
-	height: 32px;
+	width: 24px;
+	height: 24px;
 	transform: translateZ(0);
 }
 
+/**
+ * CSS-grid Desktop Menu
+ */
 @media only screen and (min-width: 560px) {
 	.site-header {
 		align-items: center;
@@ -3585,54 +3581,54 @@ a {
 		margin-top: 0;
 		margin-bottom: 0;
 	}
-	.site-header .site-logo {
+	.site-logo {
 		grid-area: site-logo;
 		margin-bottom: 16px;
 	}
-	.site-header .site-title {
+	.site-title {
 		align-self: flex-end;
 		grid-area: site-title;
 	}
-	.site-header .site-title + .site-description {
+	.site-title + .site-description {
 		margin-top: 0;
 	}
-	.site-header .site-description {
+	.site-description {
 		align-self: center;
 		grid-area: site-description;
 	}
-	.site-header .main-navigation {
+	.main-navigation {
 		align-self: center;
 		grid-area: main-navigation;
 		justify-self: flex-end;
 	}
-	.site-header .main-navigation > div > ul {
+	.main-navigation > div > ul {
 		justify-content: flex-end;
 		margin-left: -8px;
 		margin-right: -8px;
 	}
-	.site-header .main-navigation > div > ul > li {
-		padding: 10.56px;
+	.main-navigation > div > ul > li {
+		padding: 8px;
 	}
-	.site-header .main-navigation > div > ul > li > a {
+	.main-navigation > div > ul > li > a {
 		padding: 0;
 	}
-	.site-header .main-navigation > div > ul > .menu-item-has-children > a::after {
+	.main-navigation > div > ul > .menu-item-has-children > a::after {
 		font-size: 0.5rem;
 	}
-	.site-header .main-navigation > div > ul > li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item > a {
+	.main-navigation > div > ul > li:hover > a,
+	.main-navigation > div > ul > li.focus > a,
+	.main-navigation > div > ul > li.current-menu-item > a {
 		color: #20603C;
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul,
-	.site-header .main-navigation > div > ul > li.focus > ul,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul {
+	.main-navigation > div > ul > li:hover > ul,
+	.main-navigation > div > ul > li.focus > ul,
+	.main-navigation > div > ul > li.current-menu-item > ul {
 		box-shadow: none;
 		overflow: hidden;
 	}
-	.site-header .main-navigation > div > ul > li:hover > ul:before,
-	.site-header .main-navigation > div > ul > li.focus > ul:before,
-	.site-header .main-navigation > div > ul > li.current-menu-item > ul:before {
+	.main-navigation > div > ul > li:hover > ul:before,
+	.main-navigation > div > ul > li.focus > ul:before,
+	.main-navigation > div > ul > li.current-menu-item > ul:before {
 		border-bottom: 8px solid #20603C;
 		border-left: 8px solid transparent;
 		border-right: 8px solid transparent;
@@ -3641,24 +3637,24 @@ a {
 		margin-left: 16px;
 		width: 16px;
 	}
-	.site-header .main-navigation > div > ul > li:hover li > a,
-	.site-header .main-navigation > div > ul > li.focus li > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li > a {
+	.main-navigation > div > ul > li:hover li > a,
+	.main-navigation > div > ul > li.focus li > a,
+	.main-navigation > div > ul > li.current-menu-item li > a {
 		background: #20603C;
 		color: #FFFDF6;
 	}
-	.site-header .main-navigation > div > ul > li:hover li:hover > a,
-	.site-header .main-navigation > div > ul > li:hover li.focus > a,
-	.site-header .main-navigation > div > ul > li:hover li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.focus li:hover > a,
-	.site-header .main-navigation > div > ul > li.focus li.focus > a,
-	.site-header .main-navigation > div > ul > li.focus li.current-menu-item > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li:hover > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.focus > a,
-	.site-header .main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
+	.main-navigation > div > ul > li:hover li:hover > a,
+	.main-navigation > div > ul > li:hover li.focus > a,
+	.main-navigation > div > ul > li:hover li.current-menu-item > a,
+	.main-navigation > div > ul > li.focus li:hover > a,
+	.main-navigation > div > ul > li.focus li.focus > a,
+	.main-navigation > div > ul > li.focus li.current-menu-item > a,
+	.main-navigation > div > ul > li.current-menu-item li:hover > a,
+	.main-navigation > div > ul > li.current-menu-item li.focus > a,
+	.main-navigation > div > ul > li.current-menu-item li.current-menu-item > a {
 		background: #133a24;
 	}
-	.site-header .social-navigation {
+	.social-navigation {
 		align-self: center;
 		grid-area: social-navigation;
 		justify-self: flex-end;
@@ -3733,6 +3729,107 @@ a {
 /**
  * Widgets
  */
+@media only screen and (min-width: 782px) {
+	.site-footer .widget-area {
+		max-width: 100%;
+	}
+	.site-footer .widget-area > .widget {
+		max-width: 50%;
+	}
+}
+
+.widget select {
+	max-width: 100%;
+}
+
 .widget-title {
-	font-size: 1.93878rem;
+	font-size: 1.3924rem;
+	margin-bottom: 16px;
+}
+
+.widget_archive ul,
+.widget_categories ul,
+.widget_meta ul,
+.widget_nav_menu ul,
+.widget_pages ul,
+.widget_recent_comments ul,
+.widget_recent_entries ul,
+.widget_rss ul {
+	margin-left: 0;
+	margin-right: 0;
+	list-style: none;
+}
+
+.widget_archive ul li,
+.widget_categories ul li,
+.widget_meta ul li,
+.widget_nav_menu ul li,
+.widget_pages ul li,
+.widget_recent_comments ul li,
+.widget_recent_entries ul li,
+.widget_rss ul li {
+	color: #844d4d;
+	font-weight: 600;
+}
+
+.widget_archive ul ul,
+.widget_categories ul ul,
+.widget_meta ul ul,
+.widget_nav_menu ul ul,
+.widget_pages ul ul,
+.widget_recent_comments ul ul,
+.widget_recent_entries ul ul,
+.widget_rss ul ul {
+	counter-reset: submenu;
+}
+
+.widget_archive ul ul > li > a::before,
+.widget_categories ul ul > li > a::before,
+.widget_meta ul ul > li > a::before,
+.widget_nav_menu ul ul > li > a::before,
+.widget_pages ul ul > li > a::before,
+.widget_recent_comments ul ul > li > a::before,
+.widget_recent_entries ul ul > li > a::before,
+.widget_rss ul ul > li > a::before {
+	font-weight: normal;
+	content: "– " counters(submenu, "– ", none);
+	counter-increment: submenu;
+}
+
+.widget_tag_cloud .tagcloud {
+	font-weight: 600;
+}
+
+.widget_search .search-field {
+	width: 100%;
+}
+
+@media only screen and (min-width: 560px) {
+	.widget_search .search-field {
+		width: auto;
+	}
+}
+
+.widget_search .search-submit {
+	display: block;
+	margin-top: 1rem;
+}
+
+.widget_calendar .calendar_wrap {
+	text-align: center;
+}
+
+.widget_calendar .calendar_wrap table td,
+.widget_calendar .calendar_wrap table th {
+	border: none;
+}
+
+.widget_calendar .calendar_wrap a {
+	text-decoration: underline;
+}
+
+.widget_links li,
+.widget_jp_blogs_i_follow li,
+.widget_rss_links li {
+	font-family: inherit;
 }