@internetstiftelsen/styleguide 2.22.0 → 2.22.3-beta.0.1

package/src/configurations/colors/colors.hbs

@@ -1,85 +0,0 @@
-<!--htmlhint style-disabled:false -->
-<h1>Default colors</h1>
-<div class="colors">
-	{{#each colors}}
-	<div class="color">
-		<div class="background-{{name}}{{#if hasBorder}} has_border{{/if}}"></div>
-		<p class="beta color-name">{{name}}</p>
-		<p><strong>{{../sass}}:</strong> {{title}}</p>
-		<p><strong>{{../hex}}:</strong> {{hex}}</p>
-		<p><strong>{{../rgb}}:</strong> {{rgb}}</p>
-		<p><strong>{{../cmyk}}:</strong> {{cmyk}}</p>
-		<p><strong>{{../pms}}:</strong> {{pms}}</p>
-	</div>
-	{{/each}}
-</div>
-
-<h2 class="alpha">Accessibility colors</h2>
-<div class="row no-gutters">
-	<div class="grid-xl-7 grid-lg-10 grid-md-12 grid-18">
-		<p>This set of colors are to be used only for accessibility purposes when the default colors doesn't meet the WCAG AA baseline. Any use of these colors must be approved by Internetstiftelsen.</p>
-	</div>
-</div>
-
-<div class="colors">
-{{#each specialColors}}
-	<div class="color color-33">
-		<div class="background-{{name}}{{#if hasBorder}} has_border{{/if}}"></div>
-		<p class="beta color-name">{{name}}</p>
-		<p><strong>{{../sass}}:</strong> {{title}}</p>
-		<p><strong>{{../hex}}:</strong> {{hex}}</p>
-		<p><strong>{{../rgb}}:</strong> {{rgb}}</p>
-		<p><strong>{{../cmyk}}:</strong> {{cmyk}}</p>
-		<p><strong>{{../pms}}:</strong> {{pms}}</p>
-	</div>
-	{{/each}}
-</div>
-
-<style>
-	.colors {
-		display: flex;
-		flex-wrap: wrap;
-		margin-bottom: 2em;
-	}
-
-	.color {
-		flex: 100% 1 0;
-		max-width: 100vw;
-	}
-
-	@media (min-width: 768px) {
-		.color {
-			flex: 50% 1 0;
-		}
-		.color-33 {
-			flex: 33.333333% 1 0;
-		}
-	}
-
-	.color div {
-		width: 100%;
-		height: 80px;
-		margin-bottom: 10px;
-	}
-
-	.has_border {
-		border: 1px solid #d8d8d8;
-	}
-
-	.color p {
-		line-height: 1.25;
-		margin: 0 10px;
-	}
-
-	.color p:last-child {
-		margin-bottom: 40px;
-	}
-
-	.color p strong {
-		font-family: 'Roboto Mono Regular', monotype;
-	}
-
-	.color-name::first-letter {
-		text-transform: uppercase;
-	}
-</style>

package/src/configurations/css-utility-classes.hbs

@@ -1,47 +0,0 @@
-<div>
-	<div class="wrapper">
-		<div class="row">
-			<div class="grid-18 grid-lg-12">
-				<h1>CSS utility classes</h1>
-				<p class="preamble">The styleguide provides a bunch of CSS utility classes designed to allow you to style your markup directly without the need for writing custom CSS.</p>
-				<p>These classes all use <code class="u-display-inline background-concrete u-border-radius u-p-y-0 u-p-x-1">!important</code> to overwrite any custom CSS already applied to an element. <a href="https://github.com/sewebb/iis-styleguide/tree/master/src/utilities" target="_blank">All available classes can be found on Github</a>.</p>
-				<div class="m-alert m-alert--warning">
-					Use utility classes with caution!
-				</div>
-				<p>Most classes are self explanatory but some, like paddings and margins which are the most commonly used classes needs some explanation for how they are contructed.</p>
-
-				<h2>How the classes are contructed</h2>
-				<fieldset>
-					<legend class="u-m-b-0">All classes start with "u" for "utility"</legend>
-					<pre>u = utility</pre>
-				</fieldset>
-				<fieldset>
-					<legend class="u-m-b-0">"m" is for "margin"</legend>
-					<pre>m = margin</pre>
-				</fieldset>
-				<fieldset>
-					<legend class="u-m-b-0">"p" is for "padding"</legend>
-					<pre>p = padding</pre>
-				</fieldset>
-				<fieldset>
-					<legend class="u-m-b-0">Next is directions</legend>
-					<pre>t = top
-r = right
-b = bottom
-l = left
-x = x-axis
-y = y-axis</pre>
-				</fieldset>
-				<fieldset>
-					<legend class="u-m-b-0">And finally numerical value</legend>
-					<pre>0 - 8</pre>
-				</fieldset>
-				<fieldset>
-					<legend class="u-m-b-0">This means a complete utility class would look something like this giving this class a bottom margin with the value 4</legend>
-					<pre>u-m-b-4</pre>
-				</fieldset>
-				<p>The values are typography baselines. 1 baseline = ½ of the document line-height meaning a value of 4 equals twice the document line-height.</p>
-			</div>
-		</div>
-	</div>
-</div>

package/src/configurations/favicon/favicon.hbs

@@ -1,9 +0,0 @@
-<link rel="apple-touch-icon" sizes="180x180" href="{{url}}apple-touch-icon.png">
-<link rel="icon" type="image/png" sizes="32x32" href="{{url}}favicon-32x32.png">
-<link rel="icon" type="image/png" sizes="16x16" href="{{url}}favicon-16x16.png">
-<link rel="manifest" href="{{url}}site.webmanifest">
-<link rel="mask-icon" href="{{url}}safari-pinned-tab.svg" color="#ff4069">
-<link rel="shortcut icon" href="{{url}}favicon.ico">
-<meta name="msapplication-TileColor" content="#ffffff">
-<meta name="msapplication-config" content="{{url}}browserconfig.xml">
-<meta name="theme-color" content="#ffffff">