diff --git a/resources/public/css/orchestrator.css b/resources/public/css/orchestrator.css index 5c41b6e6d..f90f02c8c 100644 --- a/resources/public/css/orchestrator.css +++ b/resources/public/css/orchestrator.css @@ -1,3 +1,17 @@ +/* ── Modern theme variables ─────────────────────────────────────────── */ +:root { + --orc-primary: #0d6efd; + --orc-primary-dark: #0a58ca; + --orc-bg: #f4f6f9; + --orc-card-bg: #ffffff; + --orc-card-border: #dee2e6; + --orc-card-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); + --orc-navbar-bg: #212529; + --orc-font-family: system-ui, -apple-system, "Segoe UI", Roboto, + "Helvetica Neue", Arial, sans-serif; +} + +/* ── Base ───────────────────────────────────────────────────────────── */ .hiddenMessage { display: none; } @@ -7,9 +21,57 @@ } body { - background-color: #f7f7f7; + font-family: var(--orc-font-family); + background-color: var(--orc-bg); background-repeat: repeat; - padding-top: 50px; + padding-top: 56px; +} + +/* ── Navbar ─────────────────────────────────────────────────────────── */ +.navbar { + background-color: var(--orc-navbar-bg) !important; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15); + min-height: auto; + margin-bottom: 0; +} + +.navbar .navbar-brand { + font-weight: 600; + letter-spacing: 0.02em; +} + +/* ── Card-based panels ──────────────────────────────────────────────── */ +.card { + background-color: var(--orc-card-bg); + border: 1px solid var(--orc-card-border); + border-radius: 0.5rem; + box-shadow: var(--orc-card-shadow); + margin-bottom: 1rem; +} + +.card-header { + background-color: #f8f9fa; + border-bottom: 1px solid var(--orc-card-border); + font-weight: 600; +} + +/* ── Bootstrap 3 → 5 compatibility helpers ──────────────────────────── */ +.pull-left { float: left !important; } +.pull-right { float: right !important; } + +.input-sm { + padding: 0.25rem 0.5rem; + font-size: 0.875rem; +} + +.btn-xs { + padding: 0.125rem 0.375rem; + font-size: 0.75rem; + border-radius: 0.2rem; +} + +.glyphicon { + font-family: "Glyphicons Halflings"; } .orchestrator-brand { @@ -35,9 +97,6 @@ body { overflow-y: auto; } -.navbar { - margin-bottom: 0px; -} .navbar-nav > li > .dropdown { padding-bottom: 15px; @@ -408,7 +467,7 @@ body { padding: 5px 9px; } -#node_modal .begin-downtime .panel-body { +#node_modal .begin-downtime .card-body { background-color: #d9edf7; } diff --git a/resources/templates/about.tmpl b/resources/templates/about.tmpl index 00cedafa2..0eb5ad1d4 100644 --- a/resources/templates/about.tmpl +++ b/resources/templates/about.tmpl @@ -1,9 +1,9 @@
-
-
+
+
About
-
+

Orchestrator is a MySQL replication topology management and visualization tool, allowing for:

    diff --git a/resources/templates/agent.tmpl b/resources/templates/agent.tmpl index b1d0893aa..ebb786f4f 100644 --- a/resources/templates/agent.tmpl +++ b/resources/templates/agent.tmpl @@ -3,14 +3,14 @@
    -
    -
    +
    +
    Agent:
    -
    +
    -
    -
    +
    +
    Info
    @@ -48,8 +48,8 @@
    -
    -
    +
    +
    Snapshots
    @@ -91,9 +91,9 @@ -
    -
    -
    +
    +
    +
    Active seeds
    @@ -111,9 +111,9 @@
    -
    -
    -
    +
    +
    +
    Active seed states
    @@ -128,9 +128,9 @@
    -
    -
    -
    +
    +
    +
    Recent seeds
    diff --git a/resources/templates/agent_seed_details.tmpl b/resources/templates/agent_seed_details.tmpl index a7c373ef4..f335d042b 100644 --- a/resources/templates/agent_seed_details.tmpl +++ b/resources/templates/agent_seed_details.tmpl @@ -3,13 +3,13 @@
    -
    -
    +
    +
    Seed
    -
    -
    -
    +
    +
    +
    Seed details
    @@ -27,9 +27,9 @@
    -
    -
    -
    +
    +
    +
    Seed states
    diff --git a/resources/templates/audit.tmpl b/resources/templates/audit.tmpl index fa1383d0b..ace1fba8d 100644 --- a/resources/templates/audit.tmpl +++ b/resources/templates/audit.tmpl @@ -1,6 +1,6 @@
    -
    -
    +
    +
      diff --git a/resources/templates/audit_failure_detection.tmpl b/resources/templates/audit_failure_detection.tmpl index 5cba61a08..576e65d40 100644 --- a/resources/templates/audit_failure_detection.tmpl +++ b/resources/templates/audit_failure_detection.tmpl @@ -1,6 +1,6 @@
      -
      -
      +
      +
        diff --git a/resources/templates/audit_recovery.tmpl b/resources/templates/audit_recovery.tmpl index 290b71120..7687102c6 100644 --- a/resources/templates/audit_recovery.tmpl +++ b/resources/templates/audit_recovery.tmpl @@ -1,6 +1,6 @@
        -
        -
        +
        +
          diff --git a/resources/templates/discover.tmpl b/resources/templates/discover.tmpl index e58c56d04..f39ee1f06 100644 --- a/resources/templates/discover.tmpl +++ b/resources/templates/discover.tmpl @@ -1,9 +1,9 @@
          -
          -
          +
          +
          Discover a new instance
          -
          +

          Enter a MySQL hostname and a port. Orchestrator will try and resolve the CNAME. diff --git a/resources/templates/faq.tmpl b/resources/templates/faq.tmpl index ce03e2385..dc8922dc3 100644 --- a/resources/templates/faq.tmpl +++ b/resources/templates/faq.tmpl @@ -1,9 +1,9 @@

          -
          -
          +
          +
          FAQ
          -
          +

          Who should use orchestrator?

          diff --git a/resources/templates/layout.tmpl b/resources/templates/layout.tmpl index 8ff9753f4..7775c3075 100644 --- a/resources/templates/layout.tmpl +++ b/resources/templates/layout.tmpl @@ -17,7 +17,7 @@ - + @@ -31,108 +31,98 @@ } - - -