From fd756a9e80aadf929ca13a0f976faca318bbf53a Mon Sep 17 00:00:00 2001 From: Anthony Correa Date: Tue, 2 Jan 2024 10:39:41 -0600 Subject: [PATCH] un-minified --- assets/css/main.min.css | 309 +++++++++++++++++++++++++++++++++++++++- 1 file changed, 308 insertions(+), 1 deletion(-) diff --git a/assets/css/main.min.css b/assets/css/main.min.css index 85c2df7..d6be999 100644 --- a/assets/css/main.min.css +++ b/assets/css/main.min.css @@ -1 +1,308 @@ -*,*::before,*::after{box-sizing:border-box;padding:0;margin:0;background:none;text-decoration:none;outline:none;font-family:inherit;font-size:inherit;line-height:inherit;font-weight:inherit;color:inherit;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-font-feature-settings:"onum", "kern", "liga", "clig", "calt";font-feature-settings:"onum", "kern", "liga", "clig", "calt"}@font-face{font-family:'DM Sans';src:url("fonts/DMSans-Regular.woff2") format("woff2");font-weight:normal;font-style:normal}@font-face{font-family:'DM Sans';src:url("fonts/DMSans-Italic.woff2") format("woff2");font-weight:normal;font-style:italic}@font-face{font-family:'DM Sans';src:url("fonts/DMSans-Bold.woff2") format("woff2");font-weight:bold;font-style:normal}@font-face{font-family:'Lora';src:url("fonts/Lora-Bold.woff2") format("woff2");font-weight:bold;font-style:normal}@font-face{font-family:'Lora';src:url("fonts/Lora-Italic.woff2") format("woff2");font-weight:normal;font-style:italic}@font-face{font-family:'Lora';src:url("fonts/Lora-Regular.woff2") format("woff2");font-weight:normal;font-style:normal}:root{--c-bg: #fdfdfd;--c-cta: #ebf2f9;--c-text: #203650;--f-sans: 'DM Sans', sans-serif;--f-serif: 'Lora', serif;--f-family: var(--f-sans);--f-size: 18px;--f-height: 32px;--f-weight: 400;--f-scale-s: 0.8;--f-scale-m: 1.25;--f-scale-l: 1.563;--f-scale-xl: 1.953;--f-scale-xxl: 2.441;font-size:var(--f-height);font-family:var(--f-family);font-weight:var(--f-weight);background:var(--c-bg);color:var(--c-text)}body,html{background:var(--c-bg)}body *,html *{font-size:var(--f-size);line-height:1rem}main{background:inherit}.initials{display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center;margin:5rem 0;padding:0 1rem}.initial{-webkit-box-flex:0;flex:0 1 auto;display:block;height:5rem;width:auto}.intro{width:100%;height:70vh;display:-webkit-box;display:flex;-webkit-box-pack:center;justify-content:center;-webkit-box-align:center;align-items:center}.intro-letter{display:inline-block;height:35vh;width:auto}.text{margin:0 auto;padding:0 1rem;max-width:24rem;text-align:center}p:not(:last-child){margin-bottom:1rem}[data-size="big"]{font-size:calc(var(--f-size) * var(--f-scale-l));line-height:1.3rem;padding-top:.35rem;padding-bottom:.35rem}ul{margin:1rem 0;list-style-type:none}ul::before,ul::after{content:"•"}a{background-image:-webkit-gradient(linear, left top, right top, color-stop(33.33333%, var(--c-bg)), color-stop(66.66666%, var(--c-text)));background-image:-webkit-linear-gradient(left, var(--c-bg) 33.33333%, var(--c-text) 66.66666%);background-image:linear-gradient(to right, var(--c-bg) 33.33333%, var(--c-text) 66.66666%);background-size:300% 1px;background-repeat:no-repeat;background-position:right bottom;-webkit-transition:background-position 400ms ease-out , opacity 400ms ease-out;transition:background-position 400ms ease-out , opacity 400ms ease-out}a:hover{opacity:.85;background-position:left bottom}a[data-style="cta"]{font-size:calc(var(--f-size) * var(--f-scale-m));line-height:1rem;position:relative;padding:.5rem 1rem;background:var(--c-cta);border-radius:999999px;margin:0.5rem 0;display:inline-block}em{font-style:italic;font-size:inherit}strong{font-weight:700;font-size:inherit}[data-size="large"]{font-size:calc(var(--f-size) * var(--f-scale-l));line-height:1.3rem;padding-top:.35rem;padding-bottom:.35rem}[data-font="serif"]{font-family:lora}[data-font="custom"]{font-family:var(--f-custom)}[data-size="large"][data-font="serif"]{font-size:calc(var(--f-size) * var(--f-scale-xl));line-height:1.3rem;padding-bottom:.35rem;padding-top:.35rem;font-style:italic}.divider{display:block;margin:3rem 0;padding:1rem}.divider::after{content:"";display:block;margin:0 auto;background-position:center center;background-size:contain;background-repeat:no-repeat}.divider[data-style*="a"]::after{-webkit-transform:rotate(0deg) rotateY(0deg);transform:rotate(0deg) rotateY(0deg)}.divider[data-style*="b"]::after{-webkit-transform:rotate(180deg) rotateY(0deg);transform:rotate(180deg) rotateY(0deg)}.divider[data-style*="c"]::after{-webkit-transform:rotate(0deg) rotateY(180deg);transform:rotate(0deg) rotateY(180deg)}.divider[data-style*="d"]::after{-webkit-transform:rotate(180deg) rotateY(180deg);transform:rotate(180deg) rotateY(180deg)}.divider[data-style*="1"]::after{background-image:url("images/dividers/horizontal-1.png")}.divider[data-style*="2"]::after{background-image:url("images/dividers/horizontal-2.png")}.divider[data-style*="3"]::after{background-image:url("images/dividers/horizontal-3.png")}.divider[data-style*="4"]::after{background-image:url("images/dividers/curve-1.png")}.divider[data-style*="5"]::after{background-image:url("images/dividers/curve-2.png")}.divider[data-style*="6"]::after{background-image:url("images/dividers/curve-3.png")}.divider[data-style*="7"]::after{background-image:url("images/dividers/flowers-1.png")}.divider[data-style*="8"]::after{background-image:url("images/dividers/flowers-2.png")}.divider[data-style*="9"]::after{background-image:url("images/dividers/flowers-3.png")}.divider[data-style*="10"]::after{background-image:url("images/dividers/flowers-4.png")}.divider[data-style*="11"]::after{background-image:url("images/dividers/flowers-5.png")}.divider[data-style*="12"]::after{background-image:url("images/dividers/flowers-6.png")}.divider[data-style*="13"]::after{background-image:url("images/dividers/leaf-1.png")}.divider[data-style*="14"]::after{background-image:url("images/dividers/leaf-2.png")}.divider[data-style*="15"]::after{background-image:url("images/dividers/leaf-3.png")}.divider[data-style*="16"]::after{background-image:url("images/dividers/leaf-4.png")}.divider[data-style*="17"]::after{background-image:url("images/dividers/leaf-5.png")}.divider[data-style*="18"]::after{background-image:url("images/dividers/leaf-6.png")}.divider[data-size="small"]::after{height:6rem}.divider[data-size="medium"]::after{height:10rem}.divider[data-size="large"]::after{height:14rem}.album{max-width:32rem;margin:0 auto 2rem;padding:0 1rem}.photo{display:block;width:100%;height:auto;box-shadow:0 5px 15px rgba(27,57,65,0.07),0 15px 25px rgba(158,183,180,0.3)}.caption{font-size:calc(var(--f-size) * var(--f-scale-s));line-height:.8rem;padding-top:.1rem;padding-bottom:.1rem;margin-top:1rem;text-align:center}.caption *{font-size:inherit} +*, +*::before, +*::after { + box-sizing: border-box; + padding: 0; + margin: 0; + background: none; + text-decoration: none; + outline: none; + font-family: inherit; + font-size: inherit; + line-height: inherit; + font-weight: inherit; + color: inherit; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; + -webkit-font-feature-settings: "onum", "kern", "liga", "clig", "calt"; + font-feature-settings: "onum", "kern", "liga", "clig", "calt"; +} +@font-face { + font-family: "DM Sans"; + src: url("fonts/DMSans-Regular.woff2") format("woff2"); + font-weight: normal; + font-style: normal; +} +@font-face { + font-family: "DM Sans"; + src: url("fonts/DMSans-Italic.woff2") format("woff2"); + font-weight: normal; + font-style: italic; +} +@font-face { + font-family: "DM Sans"; + src: url("fonts/DMSans-Bold.woff2") format("woff2"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "Lora"; + src: url("fonts/Lora-Bold.woff2") format("woff2"); + font-weight: bold; + font-style: normal; +} +@font-face { + font-family: "Lora"; + src: url("fonts/Lora-Italic.woff2") format("woff2"); + font-weight: normal; + font-style: italic; +} +@font-face { + font-family: "Lora"; + src: url("fonts/Lora-Regular.woff2") format("woff2"); + font-weight: normal; + font-style: normal; +} +:root { + --c-bg: #fdfdfd; + --c-cta: #ebf2f9; + --c-text: #203650; + --f-sans: "DM Sans", sans-serif; + --f-serif: "Lora", serif; + --f-family: var(--f-sans); + --f-size: 18px; + --f-height: 32px; + --f-weight: 400; + --f-scale-s: 0.8; + --f-scale-m: 1.25; + --f-scale-l: 1.563; + --f-scale-xl: 1.953; + --f-scale-xxl: 2.441; + font-size: var(--f-height); + font-family: var(--f-family); + font-weight: var(--f-weight); + background: var(--c-bg); + color: var(--c-text); +} +body, +html { + background: var(--c-bg); +} +body *, +html * { + font-size: var(--f-size); + line-height: 1rem; +} +main { + background: inherit; +} +.initials { + display: -webkit-box; + display: flex; + -webkit-box-pack: center; + justify-content: center; + -webkit-box-align: center; + align-items: center; + margin: 5rem 0; + padding: 0 1rem; +} +.initial { + -webkit-box-flex: 0; + flex: 0 1 auto; + display: block; + height: 5rem; + width: auto; +} +.intro { + width: 100%; + height: 70vh; + display: -webkit-box; + display: flex; + -webkit-box-pack: center; + justify-content: center; + -webkit-box-align: center; + align-items: center; +} +.intro-letter { + display: inline-block; + height: 35vh; + width: auto; +} +.text { + margin: 0 auto; + padding: 0 1rem; + max-width: 24rem; + text-align: center; +} +p:not(:last-child) { + margin-bottom: 1rem; +} +[data-size="big"] { + font-size: calc(var(--f-size) * var(--f-scale-l)); + line-height: 1.3rem; + padding-top: 0.35rem; + padding-bottom: 0.35rem; +} +ul { + margin: 1rem 0; + list-style-type: none; +} +ul::before, +ul::after { + content: "•"; +} +a { + background-image: -webkit-gradient(linear, left top, right top, color-stop(33.33333%, var(--c-bg)), color-stop(66.66666%, var(--c-text))); + background-image: -webkit-linear-gradient(left, var(--c-bg) 33.33333%, var(--c-text) 66.66666%); + background-image: linear-gradient(to right, var(--c-bg) 33.33333%, var(--c-text) 66.66666%); + background-size: 300% 1px; + background-repeat: no-repeat; + background-position: right bottom; + -webkit-transition: background-position 400ms ease-out, opacity 400ms ease-out; + transition: background-position 400ms ease-out, opacity 400ms ease-out; +} +a:hover { + opacity: 0.85; + background-position: left bottom; +} +a[data-style="cta"] { + font-size: calc(var(--f-size) * var(--f-scale-m)); + line-height: 1rem; + position: relative; + padding: 0.5rem 1rem; + background: var(--c-cta); + border-radius: 999999px; + margin: 0.5rem 0; + display: inline-block; +} +em { + font-style: italic; + font-size: inherit; +} +strong { + font-weight: 700; + font-size: inherit; +} +[data-size="large"] { + font-size: calc(var(--f-size) * var(--f-scale-l)); + line-height: 1.3rem; + padding-top: 0.35rem; + padding-bottom: 0.35rem; +} +[data-font="serif"] { + font-family: lora; +} +[data-font="custom"] { + font-family: var(--f-custom); +} +[data-size="large"][data-font="serif"] { + font-size: calc(var(--f-size) * var(--f-scale-xl)); + line-height: 1.3rem; + padding-bottom: 0.35rem; + padding-top: 0.35rem; + font-style: italic; +} +.divider { + display: block; + margin: 3rem 0; + padding: 1rem; +} +.divider::after { + content: ""; + display: block; + margin: 0 auto; + background-position: center center; + background-size: contain; + background-repeat: no-repeat; +} +.divider[data-style*="a"]::after { + -webkit-transform: rotate(0deg) rotateY(0deg); + transform: rotate(0deg) rotateY(0deg); +} +.divider[data-style*="b"]::after { + -webkit-transform: rotate(180deg) rotateY(0deg); + transform: rotate(180deg) rotateY(0deg); +} +.divider[data-style*="c"]::after { + -webkit-transform: rotate(0deg) rotateY(180deg); + transform: rotate(0deg) rotateY(180deg); +} +.divider[data-style*="d"]::after { + -webkit-transform: rotate(180deg) rotateY(180deg); + transform: rotate(180deg) rotateY(180deg); +} +.divider[data-style*="1"]::after { + background-image: url("images/dividers/horizontal-1.png"); +} +.divider[data-style*="2"]::after { + background-image: url("images/dividers/horizontal-2.png"); +} +.divider[data-style*="3"]::after { + background-image: url("images/dividers/horizontal-3.png"); +} +.divider[data-style*="4"]::after { + background-image: url("images/dividers/curve-1.png"); +} +.divider[data-style*="5"]::after { + background-image: url("images/dividers/curve-2.png"); +} +.divider[data-style*="6"]::after { + background-image: url("images/dividers/curve-3.png"); +} +.divider[data-style*="7"]::after { + background-image: url("images/dividers/flowers-1.png"); +} +.divider[data-style*="8"]::after { + background-image: url("images/dividers/flowers-2.png"); +} +.divider[data-style*="9"]::after { + background-image: url("images/dividers/flowers-3.png"); +} +.divider[data-style*="10"]::after { + background-image: url("images/dividers/flowers-4.png"); +} +.divider[data-style*="11"]::after { + background-image: url("images/dividers/flowers-5.png"); +} +.divider[data-style*="12"]::after { + background-image: url("images/dividers/flowers-6.png"); +} +.divider[data-style*="13"]::after { + background-image: url("images/dividers/leaf-1.png"); +} +.divider[data-style*="14"]::after { + background-image: url("images/dividers/leaf-2.png"); +} +.divider[data-style*="15"]::after { + background-image: url("images/dividers/leaf-3.png"); +} +.divider[data-style*="16"]::after { + background-image: url("images/dividers/leaf-4.png"); +} +.divider[data-style*="17"]::after { + background-image: url("images/dividers/leaf-5.png"); +} +.divider[data-style*="18"]::after { + background-image: url("images/dividers/leaf-6.png"); +} +.divider[data-size="small"]::after { + height: 6rem; +} +.divider[data-size="medium"]::after { + height: 10rem; +} +.divider[data-size="large"]::after { + height: 14rem; +} +.album { + max-width: 32rem; + margin: 0 auto 2rem; + padding: 0 1rem; +} +.photo { + display: block; + width: 100%; + height: auto; + box-shadow: 0 5px 15px rgba(27, 57, 65, 0.07), 0 15px 25px rgba(158, 183, 180, 0.3); +} +.caption { + font-size: calc(var(--f-size) * var(--f-scale-s)); + line-height: 0.8rem; + padding-top: 0.1rem; + padding-bottom: 0.1rem; + margin-top: 1rem; + text-align: center; +} +.caption * { + font-size: inherit; +}