Remove custom properties from examples so that they work in IE (#27634)

diff --git a/site/docs/4.1/examples/album/album.css b/site/docs/4.1/examples/album/album.css
index f9d1518d3c74270d2eabce0ea3300741e2bb132c..bfc270d52e6a850318fd274c51f9919fa93d186d 100644 (file)
--- a/site/docs/4.1/examples/album/album.css
+++ b/site/docs/4.1/examples/album/album.css
@@ -1,17 +1,13 @@
-:root {
-  --jumbotron-padding-y: 3rem;
-}
-
 .jumbotron {
-  padding-top: var(--jumbotron-padding-y);
-  padding-bottom: var(--jumbotron-padding-y);
+  padding-top: 3rem;
+  padding-bottom: 3rem;
   margin-bottom: 0;
   background-color: #fff;
 }
 @media (min-width: 768px) {
   .jumbotron {
-    padding-top: calc(var(--jumbotron-padding-y) * 2);
-    padding-bottom: calc(var(--jumbotron-padding-y) * 2);
+    padding-top: 6rem;
+    padding-bottom: 6rem;
   }
 }
 

diff --git a/site/docs/4.1/examples/floating-labels/floating-labels.css b/site/docs/4.1/examples/floating-labels/floating-labels.css
index b929a45c075cee8c633699df6cbd14d00a0db50c..c322d9b56850d551af4b4eb87e8c54934279fccd 100644 (file)
--- a/site/docs/4.1/examples/floating-labels/floating-labels.css
+++ b/site/docs/4.1/examples/floating-labels/floating-labels.css
@@ -1,8 +1,3 @@
-:root {
-  --input-padding-x: .75rem;
-  --input-padding-y: .75rem;
-}
-
 html,
 body {
   height: 100%;
@@ -33,7 +28,7 @@ body {
 .form-label-group > input,
 .form-label-group > label {
   height: 3.125rem;
-  padding: var(--input-padding-y) var(--input-padding-x);
+  padding: .75rem;
 }
 
 .form-label-group > label {
@@ -72,13 +67,13 @@ body {
 }
 
 .form-label-group input:not(:placeholder-shown) {
-  padding-top: calc(var(--input-padding-y) + var(--input-padding-y) * (2 / 3));
-  padding-bottom: calc(var(--input-padding-y) / 3);
+  padding-top: 1.25rem;
+  padding-bottom: .25rem;
 }
 
 .form-label-group input:not(:placeholder-shown) ~ label {
-  padding-top: calc(var(--input-padding-y) / 3);
-  padding-bottom: calc(var(--input-padding-y) / 3);
+  padding-top: .25rem;
+  padding-bottom: .25rem;
   font-size: 12px;
   color: #777;
 }