summaryrefslogtreecommitdiff
path: root/_old/src/scss
diff options
context:
space:
mode:
Diffstat (limited to '_old/src/scss')
-rw-r--r--_old/src/scss/index.scss144
1 files changed, 144 insertions, 0 deletions
diff --git a/_old/src/scss/index.scss b/_old/src/scss/index.scss
new file mode 100644
index 0000000..d8c7330
--- /dev/null
+++ b/_old/src/scss/index.scss
@@ -0,0 +1,144 @@
+@charset "utf-8";
+
+// Google Fonts
+@import url("https://fonts.googleapis.com/css?family=Architects+Daughter|Indie+Flower|PT+Sans&display=swap");
+
+// Palette
+$darkteal: rgb(0, 100, 108);
+$green: rgb(88, 169, 143);
+$darkerteal: rgb(29, 133, 137);
+$gray: rgb(157, 210, 211);
+$teal: rgb(58, 165, 166);
+$cyan: rgb(156, 210, 210);
+$darkgray: rgb(127, 177, 181);
+$darkgreen: rgb(59, 136, 114);
+$yellow: rgb(186, 214, 187);
+
+// Update Bulma's global variables
+$primary: $teal;
+$link: $darkteal;
+// $info: $cyan
+$success: $green;
+// $warning: $yellow
+// $danger: $red
+// $dark: $grey-darker
+// $text: $grey-dark
+$family-sans-serif: "PT Sans", sans-serif;
+// $hr-background-color: $primary;
+$title-color: $darkteal;
+$title-family: "Architects Daughter", cursive;
+$subtitle-color: $darkteal;
+$subtitle-family: "Indie Flower", cursive;
+//$body-font-size: 1.8rem;
+// $body-background-color: $isabelline;
+
+// Import only what you need from Bulma
+@import "../../node_modules/bulma/sass/utilities/_all.sass";
+@import "../../node_modules/bulma/sass/base/_all.sass";
+@import "../../node_modules/bulma/sass/elements/_all.sass";
+@import "../../node_modules/bulma/sass/form/_all.sass";
+@import "../../node_modules/bulma/sass/components/_all.sass";
+@import "../../node_modules/bulma/sass/layout/_all.sass";
+@import "../../node_modules/bulma/sass/grid/_all.sass";
+
+.offering {
+ color: white;
+}
+.offering .content u {
+ cursor: pointer;
+}
+.column .offering {
+ border: 1em solid $darkgray;
+}
+.darkteal {
+ background-color: $darkteal;
+}
+.green {
+ background-color: $green;
+}
+.darkerteal {
+ background-color: $darkerteal;
+}
+.darkgray {
+ background-color: $darkgray;
+}
+.darkgreen {
+ background-color: $darkgreen;
+}
+
+.blurb {
+ background-color: white;
+ clip-path: polygon(
+ 0% 0%,
+ 100% 0%,
+ 100% 75%,
+ 75% 75%,
+ 75% 100%,
+ 50% 75%,
+ 0% 75%
+ );
+}
+
+.banner {
+ right: 100%;
+ padding-top: 5%;
+ padding-bottom: 5%;
+ padding-right: 5%;
+
+ // gradient
+ background: -moz-linear-gradient(
+ left,
+ rgba(255, 255, 255, 0) 0%,
+ rgba(255, 255, 255, 1) 50%
+ );
+ background: -webkit-linear-gradient(
+ left,
+ rgba(255, 255, 255, 0) 0%,
+ rgba(255, 255, 255, 1) 50%
+ );
+ background: linear-gradient(
+ to right,
+ rgba(255, 255, 255, 0) 0%,
+ rgba(255, 255, 255, 1) 50%
+ );
+ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 );
+}
+
+.has-banner {
+ //margin-top: 0px !important;
+ //margin-bottom: 0px !important;
+ padding-top: 0px !important;
+ padding-bottom: 0px !important;
+ padding-right: 0px !important;
+ padding-left: 10% !important;
+}
+
+.quiet {
+ background-color: white;
+}
+
+.fawnseh {
+ font-family: "Architects Daughter", cursive;
+}
+
+.has-text-shadow {
+ text-shadow: 0px 0px 4px #ffffff;
+}
+
+@keyframes fadeIn {
+ 0% {
+ opacity: 0;
+ }
+ 100% {
+ opacity: 1;
+ }
+}
+
+.fadeIn {
+ animation-name: fadeIn;
+ animation-duration: 0.3s;
+}
+
+body {
+ background-image: url("/bg.png");
+}