diff --git a/sreez/src/app.rs b/sreez/src/app.rs index c67276e..88c8ee9 100644 --- a/sreez/src/app.rs +++ b/sreez/src/app.rs @@ -20,7 +20,7 @@ pub fn App() -> impl IntoView { // content for this welcome page -
+
diff --git a/sreez/src/pages/initial_offer.rs b/sreez/src/pages/initial_offer.rs index aca9c90..cfbb1c8 100644 --- a/sreez/src/pages/initial_offer.rs +++ b/sreez/src/pages/initial_offer.rs @@ -3,24 +3,24 @@ use leptos::*; #[component] pub fn InitialOffer() -> impl IntoView { view! { -
-

"Imagine a world where your startup's infrastructure is as resilient as the biggest tech giants', but without the overhead."

-

"Welcome to SREEZ, where we make that dream a reality"

-
-
- SREEZ mascot. Yes it is text-to-image generated by GPT4/DALL·E +
-

"SREEZ" +

"Site Reliability Engineering for Everyone, eZ : SREEZ"
- "Site Reliability Engineering for Everyone, eZ" + "Site Reliability Engineering for Everyone, eZ"

-

+

"Stay focused"
"on your features,"
"we take care"
"of the infrastructure."

+ SREEZ mascot. Yes it is text-to-image generated by GPT4/DALL·E +
+
+

"Imagine a world where your startup's infrastructure is as resilient as the biggest tech giants', but without the overhead."

+

"Welcome to SREEZ, where we make that dream a reality"

@@ -49,7 +49,8 @@ pub fn InitialOffer() -> impl IntoView {
-

"And much more, just ""ask us!"

+

"And much more, just "

+
@@ -58,7 +59,7 @@ pub fn InitialOffer() -> impl IntoView {

"10 555 CAD / Year"

"Coming soon"

- "Subscribe to waitlist" + "Subscribe to waitlist"

  • "Dedicated Kubernetes namespace - Auto-Healing, Auto-Scaling, Fully Managed"
    • @@ -79,7 +80,7 @@ pub fn InitialOffer() -> impl IntoView {

    "55 555 CAD / Year"

    "5 available "

    - "Get it now" + "Get it now"

    • "Everything in lower package, plus"
      • @@ -101,7 +102,7 @@ pub fn InitialOffer() -> impl IntoView {

      "555 555 CAD / Year"

      "1 available "

      - "Get it now" + "Get it now"

      • "Everything in lower package, plus"
        • @@ -121,7 +122,7 @@ pub fn InitialOffer() -> impl IntoView {

        "Not ready to make a move yet but want to improve your infrastructure"

        - "Subscribe to our mailing list" + "Subscribe to our mailing list" " for SRE advice and events"

        diff --git a/sreez/style/main.scss b/sreez/style/main.scss index 84a20a7..5e0d5c1 100644 --- a/sreez/style/main.scss +++ b/sreez/style/main.scss @@ -1,22 +1,25 @@ body { font-family: sans-serif; text-align: center; - font-size: 1.25rem; + font-size: 1.4rem; } body { - background-color: #FAFAF5; font-family: Roboto, helvetica; font-family: Poppins, helvetica; } -.font-size-4xl { +.font-4xl { font-size: 3rem; } -.font-size-xl { - font-size: 1.5rem; +.font-xl { + font-size: 1.7rem; +} + +.line-1 { + line-height: 1rem; } .color-gray { @@ -32,6 +35,10 @@ ol { flex-direction: row; } +.wrap { + flex-wrap: wrap; +} + .column { display: flex; flex-direction: column; @@ -88,12 +95,6 @@ ol { flex: 1; min-width: 250px; max-width: 400px; - // border: solid 3px #ccc; - //border-radius: 20px; - // background-color: white; - //border: 2px solid #eee; - //border-right: 2px solid #fc314e88; - //border-left: 2px solid #fc314e88; margin: 30px; display: flex; flex-direction: column; @@ -152,22 +153,29 @@ ol.huge-list-markers li{ } } +@media (min-width: 900px) { .text-2x { font-size: 2rem; } .text-3x { - font-size: 3rem; + font-size: 3.5rem; } .text-4x { font-size: 4rem; } +} .font-bold { font-weight: 800; } +.font-600 { + font-weight: 600; +} + + .max-width-400 { max-width: 400px; } @@ -175,3 +183,25 @@ ol.huge-list-markers li{ .height-110 { height: 110px; } + +.bg-light, body { + background-color: #F8F9F1; +} + +.btn-dark { + background-color: #007488; + color: #FFF; +} + +.btn { + border: none; + padding: 0.7rem 1rem; + border-radius: 0.75rem; + font-weight: 700; + font-size: inherit; + text-transform: capitalize; + cursor: pointer; + &:hover { + background-color: #007488CC; + } +}