diff --git a/_includes/components/jumbotron.html b/_includes/components/jumbotron.html
new file mode 100644
index 0000000..e24bcb5
--- /dev/null
+++ b/_includes/components/jumbotron.html
@@ -0,0 +1,20 @@
+
- {% include components/paginate.html %}
+ {% include components/jumbotron.html %}
- {% include components/scrollspy.html %}
+ {% include components/paginate.html %}
{% include components/tables.html %}
diff --git a/_site/assets/styles/components.scss b/_site/assets/styles/components.scss
index 1c9e10d..bd635fc 100644
--- a/_site/assets/styles/components.scss
+++ b/_site/assets/styles/components.scss
@@ -1,39 +1,52 @@
.alert {
- border-radius: 25px;
+ border-radius: 15px;
&-custom {
- color: #041f67;
- background-color: #bbd6ff;
- border-color: #a4bfff;
+ color: #3b4f87;
+ background-color: #e2e6f0;
+ border-color: #6679ac;
& hr {
- border-top-color: #7691d9;
+ border-top-color: #6679ac;
}
& .alert-link {
- color: #000850;
+ color: #081b4f;
}
}
&-primary {
- color: #041f67;
- background-color: #bbd6ff;
- border-color: #a4bfff;
+ color: #3b4f87;
+ background-color: #e2e6f0;
+ border-color: #6679ac;
& hr {
- border-top-color: #7691d9;
+ border-top-color: #6679ac;
}
& .alert-link {
- color: #000850;
+ color: #003600;
+ }
+ }
+ &-secondary {
+ color: $oc-gray-7;
+ background-color: $oc-gray-2;
+ border-color: $oc-gray-6;
+
+ & hr {
+ border-top-color: $oc-gray-6;
+ }
+
+ & .alert-link {
+ color: $oc-gray-8;
}
}
&-success {
- color: #075207;
- background-color: #beffbe;
- border-color: #a7f2a7;
+ color: #105c10;
+ background-color: #e1f2e1;
+ border-color: #60ab60;
& hr {
- border-top-color: #7ac57a;
+ border-top-color: #1d731d;
}
& .alert-link {
@@ -41,12 +54,12 @@
}
}
&-warning {
- color: #bd8200;
- background-color: #ffffa9;
- border-color: #ffff92;
+ color: #6b4c00;
+ background-color: #ffeab5;
+ border-color: #cca443;
& hr {
- border-top-color: #fff464;
+ border-top-color: #cca443;
}
& .alert-link {
@@ -54,12 +67,12 @@
}
}
&-danger {
- color: #9f1405;
- background-color: #ffcbbc;
- border-color: #ffb4a5;
+ color: #700b00;
+ background-color: #ffcac4;
+ border-color: #e15647;
& hr {
- border-top-color: #ff8677;
+ border-top-color: #e15647;
}
& .alert-link {
@@ -176,6 +189,19 @@
}
}
+.btn-white {
+ color: $primary !important;
+ background-color: $oc-white !important;
+ border-color: transparent !important;
+ padding: 1rem 1.5rem !important;
+ font-size: 1rem;
+ &:hover {
+ color: $oc-white !important;
+ background-color: $secondary !important;
+ border-color: transparent !important;
+ }
+}
+
.btn-small {
background-color: $primary !important;
border-color: transparent !important;
@@ -355,7 +381,7 @@
}
}
#styleguide-nav {
- background-color: $oc-white !important;
+ background-color: $oc-gray-0 !important;
.nav-item:hover {
box-shadow: inset 0 -5px $primary;
diff --git a/_site/assets/styles/layout.scss b/_site/assets/styles/layout.scss
index 3e45704..323a9c4 100644
--- a/_site/assets/styles/layout.scss
+++ b/_site/assets/styles/layout.scss
@@ -165,6 +165,15 @@
background-color: #f1f3f5 !important;
}
+.bg {
+ &-primary {
+ background-color: $primary !important;
+ }
+ &-secondary {
+ background-color: $secondary !important;
+ }
+}
+
.b-border {
border-bottom: 2px solid lightgrey !important;
}
diff --git a/_site/assets/styles/main.css b/_site/assets/styles/main.css
index ee62ba7..b1f0cfb 100644
--- a/_site/assets/styles/main.css
+++ b/_site/assets/styles/main.css
@@ -59,6 +59,9 @@
.bg-box { background-color: #f1f3f5 !important; }
+.bg-primary { background-color: #4661A9 !important; }
+.bg-secondary { background-color: #60AB60 !important; }
+
.b-border { border-bottom: 2px solid lightgrey !important; }
.color { height: 100px; }
@@ -78,21 +81,24 @@ h4.header-display::before { height: 2.25rem; transform: translate(-15px, 0.5625r
.icon { font-size: 20px; background-color: #212529; padding: 20px; }
-.alert { border-radius: 25px; }
-.alert-custom { color: #041f67; background-color: #bbd6ff; border-color: #a4bfff; }
-.alert-custom hr { border-top-color: #7691d9; }
-.alert-custom .alert-link { color: #000850; }
-.alert-primary { color: #041f67; background-color: #bbd6ff; border-color: #a4bfff; }
-.alert-primary hr { border-top-color: #7691d9; }
-.alert-primary .alert-link { color: #000850; }
-.alert-success { color: #075207; background-color: #beffbe; border-color: #a7f2a7; }
-.alert-success hr { border-top-color: #7ac57a; }
+.alert { border-radius: 15px; }
+.alert-custom { color: #3b4f87; background-color: #e2e6f0; border-color: #6679ac; }
+.alert-custom hr { border-top-color: #6679ac; }
+.alert-custom .alert-link { color: #081b4f; }
+.alert-primary { color: #3b4f87; background-color: #e2e6f0; border-color: #6679ac; }
+.alert-primary hr { border-top-color: #6679ac; }
+.alert-primary .alert-link { color: #003600; }
+.alert-secondary { color: #495057; background-color: #e9ecef; border-color: #868e96; }
+.alert-secondary hr { border-top-color: #868e96; }
+.alert-secondary .alert-link { color: #343a40; }
+.alert-success { color: #105c10; background-color: #e1f2e1; border-color: #60ab60; }
+.alert-success hr { border-top-color: #1d731d; }
.alert-success .alert-link { color: #003b00; }
-.alert-warning { color: #bd8200; background-color: #ffffa9; border-color: #ffff92; }
-.alert-warning hr { border-top-color: #fff464; }
+.alert-warning { color: #6b4c00; background-color: #ffeab5; border-color: #cca443; }
+.alert-warning hr { border-top-color: #cca443; }
.alert-warning .alert-link { color: #a66b00; }
-.alert-danger { color: #9f1405; background-color: #ffcbbc; border-color: #ffb4a5; }
-.alert-danger hr { border-top-color: #ff8677; }
+.alert-danger { color: #700b00; background-color: #ffcac4; border-color: #e15647; }
+.alert-danger hr { border-top-color: #e15647; }
.alert-danger .alert-link { color: #880000; }
.background-primary { background-color: #4661A9; }
@@ -143,6 +149,9 @@ h4.header-display::before { height: 2.25rem; transform: translate(-15px, 0.5625r
.btn-primary { background-color: #4661A9 !important; border-color: transparent !important; padding: 1rem 1.5rem !important; font-size: 1rem; }
.btn-primary:hover { background-color: #60AB60 !important; border-color: transparent !important; }
+.btn-white { color: #4661A9 !important; background-color: #ffffff !important; border-color: transparent !important; padding: 1rem 1.5rem !important; font-size: 1rem; }
+.btn-white:hover { color: #ffffff !important; background-color: #60AB60 !important; border-color: transparent !important; }
+
.btn-small { background-color: #4661A9 !important; border-color: transparent !important; padding: .08rem .4rem 0 !important; font-size: .8rem; color: #ffffff; }
.btn-small:hover { background-color: #60AB60 !important; border-color: transparent !important; }
@@ -185,7 +194,7 @@ h4.header-display::before { height: 2.25rem; transform: translate(-15px, 0.5625r
.footer-extras ul li { margin: 0 0.5rem; }
.footer .spacer { content: " "; height: 2rem; }
-#styleguide-nav { background-color: #ffffff !important; }
+#styleguide-nav { background-color: #f8f9fa !important; }
#styleguide-nav .nav-item:hover { box-shadow: inset 0 -5px #4661A9; }
#styleguide-nav .nav-item:hover .nav-link { color: #4661A9; }
#styleguide-nav .nav-link { color: #212529; }
diff --git a/_site/components/index.html b/_site/components/index.html
index 54e9ac2..26c2482 100644
--- a/_site/components/index.html
+++ b/_site/components/index.html
@@ -117,14 +117,14 @@
-
+
+