summaryrefslogtreecommitdiffstats
path: root/site/content/docs/5.2/examples/product/product.css
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2023-01-24 12:33:51 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2023-01-24 12:33:51 +0000
commit3ea39841c8049525e31e9f4d6300f0c60cdb42de (patch)
tree855de60a8872eafb5911acd303aedcdbfe713a73 /site/content/docs/5.2/examples/product/product.css
parentInital commit. (diff)
downloadbootstrap-html-3ea39841c8049525e31e9f4d6300f0c60cdb42de.tar.xz
bootstrap-html-3ea39841c8049525e31e9f4d6300f0c60cdb42de.zip
Adding upstream version 5.2.3+dfsg.upstream/5.2.3+dfsg
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'site/content/docs/5.2/examples/product/product.css')
-rw-r--r--site/content/docs/5.2/examples/product/product.css69
1 files changed, 69 insertions, 0 deletions
diff --git a/site/content/docs/5.2/examples/product/product.css b/site/content/docs/5.2/examples/product/product.css
new file mode 100644
index 0000000..5fcb582
--- /dev/null
+++ b/site/content/docs/5.2/examples/product/product.css
@@ -0,0 +1,69 @@
+.container {
+ max-width: 960px;
+}
+
+/*
+ * Custom translucent site header
+ */
+
+.site-header {
+ background-color: rgba(0, 0, 0, .85);
+ -webkit-backdrop-filter: saturate(180%) blur(20px);
+ backdrop-filter: saturate(180%) blur(20px);
+}
+.site-header a {
+ color: #8e8e8e;
+ transition: color .15s ease-in-out;
+}
+.site-header a:hover {
+ color: #fff;
+ text-decoration: none;
+}
+
+/*
+ * Dummy devices (replace them with your own or something else entirely!)
+ */
+
+.product-device {
+ position: absolute;
+ right: 10%;
+ bottom: -30%;
+ width: 300px;
+ height: 540px;
+ background-color: #333;
+ border-radius: 21px;
+ transform: rotate(30deg);
+}
+
+.product-device::before {
+ position: absolute;
+ top: 10%;
+ right: 10px;
+ bottom: 10%;
+ left: 10px;
+ content: "";
+ background-color: rgba(255, 255, 255, .1);
+ border-radius: 5px;
+}
+
+.product-device-2 {
+ top: -25%;
+ right: auto;
+ bottom: 0;
+ left: 5%;
+ background-color: #e5e5e5;
+}
+
+
+/*
+ * Extra utilities
+ */
+
+.flex-equal > * {
+ flex: 1;
+}
+@media (min-width: 768px) {
+ .flex-md-equal > * {
+ flex: 1;
+ }
+}