Custom greeter page for kraut.world

website/dist/assets/sass/components/_section.scss

@@ -0,0 +1,60 @@
+///
+/// Indivisible by Pixelarity
+/// pixelarity.com | hello@pixelarity.com
+/// License: pixelarity.com/license
+///
+
+/* Section/Article */
+
+	section, article {
+		&.special {
+			text-align: center;
+		}
+	}
+
+	header {
+		margin: (_size(element-margin) * 1.5) 0;
+
+		> :first-child {
+			margin-bottom: 0;
+
+			&:after {
+				content: '';
+				display: block;
+				background-color: _palette(border);
+				height: 1px;
+				margin: 1.5rem 0 1.75rem 0;
+				width: 5rem;
+
+				.special & {
+					margin-left: auto;
+					margin-right: auto;
+				}
+			}
+		}
+
+		p {
+			font-size: 0.9em;
+			letter-spacing: _font(letter-spacing-alt);
+			margin-bottom: 0;
+			text-transform: uppercase;
+		}
+
+		@include breakpoint('<=small') {
+			margin: _size(element-margin) 0;
+
+			> :first-child {
+				&:after {
+					margin: 1.25rem 0 1.5rem 0;
+				}
+			}
+
+			p {
+				font-size: 0.8em;
+
+				br {
+					display: none;
+				}
+			}
+		}
+	}