getting it white

src/plainui/jinja2/plainui/components/three_cards.html

 {% macro three_cards(cards) -%}
 {% if cards %}
-    <div class="border p-6 text-light text-center mx-0">
     <div class="card-deck">
         {% for card in cards %}
             <article class="card">
-                    <header class="card-header">
-                        <h3 class="card-title text-white mb-0">{{card.title}}</h3>
+                <header class="card-header text-center">
+                    <h3 class="card-title text-dark mb-0">{{card.title}}</h3>
                 </header>
-                    <section class="card-body mt-2 px-3 shadow-darkmorphism">
+                <section class="card-body mt-2 px-3">
                     <p class="card-text">{{ card.text}}</p>
                 </section>
                 {% if card.link %}
-                        <footer class="card-footer p-0 shadow-darkmorphism mt-2">
-                            <a href="{{ card.link.url }}" class="btn btn-block btn-xxl{% if card.link.type %} btn-{{card.link.type}}{% endif %}">
+                    <footer class="card-footer p-0 mt-2">
+                        <a href="{{ card.link.url }}" class="btn btn-block btn-l{% if card.link.type %} btn-{{card.link.type}}{% endif %}">
                             {{ card.link.text }}
                         </a>
                     </footer>
@@ -20,6 +19,5 @@
             </article>
         {% endfor %}
     </div>
-    </div>
 {% endif %}
 {%- endmacro %}

src/plainui/styles/_util-classes.scss

@@ -52,6 +52,7 @@ h5,
 h6,
 .h6 {
     text-transform: lowercase;
+    letter-spacing: 0.075em;
 }
 
 .shadow-darkmorphism {
@@ -174,6 +175,14 @@ h6,
     }
 }
 
+.card-header {
+    padding: 0.5rem;
+}
+
+.card-footer {
+    border-top: none;
+}
+
 .form-check {
     padding-left: 1.75rem;
     &-input {

src/plainui/styles/utils/_bootstrap-theme-plattform.scss

@@ -5,7 +5,7 @@
 @import "./forms";
 
 $gray-100: map-get($plattform, "four");
-$gray-900: map-get($plattform, "bg");
+$gray-900: map-get($plattform, "bg-three");
 
 // bootstrap colors map has only white, gray-dark, use theme-colors instead
 $primary: map-get($plattform, "one");

src/plainui/styles/utils/_colors.scss

 $plattform: (
-    "one": #AE30FF, // original: #B239FF
-    "two": #6800E7,
-    "three": #05B9EC,
-    "four": #FFFFFF,
-    "bg": #100E23,
-    "bg-two": #29255B,
-    "font-pink": #B33CFF // necessary for high contrast theme
+    "one": #FFF, // original: #B239FF
+    "two": #000,
+    "three": #fff,
+    "four": #ffff,
+    "bg": rgba(0,0,0,1),
+    "bg-two": #fff,
+    "bg-three": #4C4C4C,
+    "font-pink": #cdb3dd // necessary for high contrast theme
 );
 
 $assembly: (
@@ -16,6 +17,7 @@ $assembly: (
     "four": #FFFFFF,
     "bg": #0E1C23,
     "bg-two": #212B30,
+    "bg-three": #4C4C4C
 );
 
 $world: (
@@ -24,7 +26,8 @@ $world: (
     "three": #751DE7,
     "four": #FFFFFF,
     "bg": #160624,
-    "bg-two": #330E54
+    "bg-two": #330E54,
+    "bg-three": #4C4C4C
 );
 
 $high-contrast: (
@@ -32,5 +35,6 @@ $high-contrast: (
     "two": #46EED5,
     "three": #751DE7,
     "four": #FFFFFF,
-    "bg": #160624
+    "bg": #160624,
+    "bg-three": #4C4C4C
 );

src/plainui/styles/utils/_fonts.scss

 $font-family-sans-serif: "SpaceMono", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 $headings-font-family: "Changa", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 
-$font-size-base: 1rem; //16px
-$line-height-base: 1.222;
+$font-size-base: 0.8125rem; //13px
+$line-height-base: 1.5;
 
-$h1-font-size: 4rem; //64px
-$h2-font-size: 2.25rem; //36px
-$h3-font-size: 1.75rem; //28px
-$h4-font-size: 1.5rem; //24px
+$h1-font-size: 4.25rem; //68px
+$h2-font-size: 1.25rem; //20px
+$h3-font-size: 1.125rem; //18px
+$h4-font-size: 1.125rem; //28px
 $h5-font-size: $font-size-base;
 $h6-font-size: $font-size-base;
 

src/plainui/styles/utils/_globals.scss

@@ -27,6 +27,8 @@ $spacers: (
     17: ($spacer * 8) //128
 );
 
+$bg-opacity-color: rgba(0,0,0,0.5);
+
 $sizes: (
     170: 10.625rem,
     25: 25%,
@@ -49,9 +51,9 @@ $table-border-color: transparent;
 
 $card-spacer-y: $spacer;
 $card-spacer-x: ($spacer * 0.5);
-$card-border-width: 0;
-$card-border-color: null;
-$card-bg: transparent;
+$card-border-width: 1px;
+$card-border-color: #fff;
+$card-bg: $bg-opacity-color;
 
 $card-columns-gap: $card-spacer-x;
 $card-columns-margin: $card-spacer-y;