Fix CIF-975 - Clean up Venia CSS from CIF Core Components project (#18)

* Creat theme clientlib that contains common and product component styles.
* Add theme clientlib to page component via page policies as suggested by @godanny86.
* Remove CSS from CIF core components. Classes in HTL remain as "styling API".
* Mov SVG from CSS into separate files. Fixes adobe/aem-core-cif-components#63.

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/.content.xml

@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
+    jcr:primaryType="cq:ClientLibraryFolder"
+    allowProxy="{Boolean}true"
+    categories="[venia.theme]"/>

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/common/common.css

@@ -0,0 +1,108 @@
+* {
+    box-sizing: border-box;
+}
+
+:root {
+    --venia-anim-bounce: cubic-bezier(0.5, 1.8, 0.9, 0.8);
+    --venia-anim-in: cubic-bezier(0, 0, 0.2, 1);
+    --venia-anim-out: cubic-bezier(0.4, 0, 1, 1);
+    --venia-anim-standard: cubic-bezier(0.4, 0, 0.2, 1);
+    --venia-border: 224, 224, 224;
+    --venia-error: 192, 18, 63;
+    --venia-error-alt: 255, 226, 234;
+    --venia-font: Muli, -apple-system, BlinkMacSystemFont, sans-serif;
+    --venia-grey: 246, 246, 246;
+    --venia-grey-dark: 209, 209, 209;
+    --venia-orange: 241, 99, 33;
+    --venia-teal: 0, 115, 120;
+    --venia-teal-alt: 224, 240, 241;
+    --venia-teal-dark: 0, 104, 108;
+    --venia-teal-light: 212, 243, 238;
+    --venia-text: 33, 33, 33;
+    --venia-text-alt: 112, 112, 112;
+    --venia-text-hint: 158, 158, 158;
+    --venia-text-spot: 255, 99, 51;
+    --venia-warning-dark: 249, 93, 94;
+    --venia-warning-light: 254, 229, 232;
+}
+
+html {
+    background-color: white;
+    font-size: 100%;
+    font-weight: 400;
+    line-height: 1;
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+}
+
+body {
+    background-color: white;
+    color: rgb(var(--venia-text));
+    margin: 0;
+    padding: 0;
+}
+
+body,
+input,
+select,
+textarea {
+    font-family: var(--venia-font);
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-size: 1rem;
+    font-weight: 400;
+    margin: 0;
+}
+
+h1 {
+    font-size: 1.5rem;
+}
+
+h2 {
+    font-size: 1.25rem;
+}
+
+a {
+    color: currentColor;
+    text-decoration: none;
+}
+
+p {
+    margin: 0;
+}
+
+dl,
+ol,
+ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+}
+
+dd,
+dt {
+    margin: 0;
+}
+
+button {
+    background: none;
+    border: 0;
+    cursor: pointer;
+    font-family: var(--venia-font);
+    font-size: 100%;
+    padding: 0;
+    touch-action: manipulation;
+    user-select: none;
+    -webkit-appearance: none;
+}
+
+button:disabled {
+    cursor: default;
+    touch-action: none;
+}

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/components/button/button.css

@@ -0,0 +1,25 @@
+.button {
+    display: inline-block;
+    font-weight: 400;
+    color: #212529;
+    text-align: center;
+    vertical-align: middle;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    background-color: transparent;
+    border: 1px solid transparent;
+    padding: 0.375rem 1.75rem;
+    font-size: 1rem;
+    line-height: 1.5;
+    border-radius: 1.25rem;
+    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
+        box-shadow 0.15s ease-in-out;
+}
+
+.button--secondary {
+    color: #fff;
+    background-color: #000000;
+    border-color: #000000;
+}

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/components/featuredcategorylist/categorylist.css

@@ -0,0 +1,51 @@
+.cmp-categorylist {
+    padding: 1rem;
+}
+
+.cmp-categorylist__content {
+    display: grid;
+    grid-gap: 3rem 1rem;
+    grid-template-columns: repeat(auto-fit, 6rem);
+    justify-content: center;
+}
+
+.cmp-categorylist__anchor {
+    display: block;
+    line-height: 1rem;
+    text-align: center;
+    width: 6rem;
+}
+
+.cmp-categorylist__imagewrapper {
+    background-position: 50% 50%;
+    background-size: cover;
+    border-radius: 50%;
+    box-shadow: 0 0 0 1px;
+    display: block;
+    height: 5rem;
+    margin: 0 auto 1rem auto;
+    width: 5rem;
+}
+
+.cmp-categorylist__image {
+    height: 100%;
+    opacity: 0;
+    width: 100%;
+}
+.cmp-categorylist__name {
+    display: block;
+}
+
+.cmp-categorylist__title {
+    text-align: center;
+    padding: 2rem;
+}
+
+.placeholder__empty {
+    text-align: center;
+    background-color: #fafafa;
+    margin: 1rem 0;
+    padding: 1rem;
+    line-height: 3rem;
+    border: 3px #ccc dashed;
+}

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/components/footer/footer.css

@@ -0,0 +1,31 @@
+.footer__root {
+    background-color: rgb(var(--venia-grey));
+    border-top: 1px solid rgb(var(--venia-border));
+    color: black;
+    margin-top: 1rem;
+    padding: 0 1rem;
+}
+
+.footer__tile {
+    border-bottom: 1px solid rgb(var(--venia-border));
+    padding: 1rem 2rem;
+}
+
+.footer__tileTitle {
+    font-size: 1.25rem;
+    margin: 1rem 0;
+}
+
+.footer__tileBody {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    margin: 1rem 0;
+}
+
+.footer__copyright {
+    display: block;
+    color: rgb(var(--venia-text-alt));
+    font-size: 0.75rem;
+    padding: 1.5rem 2rem;
+    text-align: center;
+}

src/main/archetype/ui.apps/src/main/content/jcr_root/apps/__appsFolderName__/clientlibs/theme/components/header/header-aem.css

@@ -0,0 +1,6 @@
+.header {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 10;
+}