feat: Add Docker Compose

docker/jws-0.0.2/keycloak-themes/jws/login/resources/css/style.css

@@ -0,0 +1,159 @@
+@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500;600;700;800;900&display=swap");
+
+.pf-c-button.pf-m-primary {
+  --pf-c-button--m-primary--BackgroundColor: #1a458a;
+}
+
+#kc-header,
+#kc-header-wrapper {
+  padding: 0 0 0 0 !important;
+}
+
+.pf-c-form-control[aria-invalid=true] {
+  background-repeat: no-repeat;
+}
+
+[id^="input-error"] {
+  color: #ea2223;
+}
+
+#kc-registration a {
+  color: #1a458a;
+  font-weight: 800;
+  text-decoration: none;
+}
+
+.login-pf-page .login-pf-settings a {
+  color: #ea2223;
+  font-weight: 800;
+  text-decoration: none;
+}
+
+div.kc-logo-text {
+  background-image: url("../img/logo.png");
+  background-size: contain;
+  background-position: center center;
+  height: 150px;
+  width: 80%;
+  margin-inline: auto;
+}
+
+.login-pf body {
+  font-family: "Noto Sans Thai";
+  background: url("../img/bg.png") no-repeat center center fixed;
+  background-size: cover;
+  height: 100%;
+}
+
+#kc-form-options .checkbox {
+  color: inherit;
+}
+
+.card-pf {
+  border-top: 0;
+  border-radius: 1rem;
+  backdrop-filter: blur(16px);
+  background-color: hsla(0 0 100% / 0.5);
+}
+
+#kc-info-wrapper {
+  background: transparent;
+  height: 100%;
+}
+
+.pf-c-form-control {
+  border: white;
+  outline: none;
+  box-shadow:
+    0 3px 5px -2px hsl(0 0 0% / 8%),
+    0 7px 14px -5px hsl(0 0 0% / 10%);
+}
+
+.pf-c-form-control:focus {
+  border: none;
+}
+
+.pf-c-button.pf-m-control {
+  border: none;
+  background: transparent;
+}
+
+.pf-c-button:after {
+  display: none;
+}
+
+.pf-c-form-control {
+  background: white;
+  padding: 1.75rem 2rem !important;
+  border-radius: 1rem !important;
+}
+
+.pf-c-input-group,
+.pf-c-button {
+  border-radius: 1rem !important;
+  box-shadow:
+    0 3px 5px -2px hsl(0 0% 0% / 8%),
+    0 7px 14px -5px hsl(0 0% 0% / 10%);
+}
+
+.pf-c-input-group .pf-c-form-control,
+.pf-c-input-group .pf-c-button {
+  box-shadow: none;
+}
+
+#kc-form-buttons .pf-c-button {
+  padding: 0.75rem 2rem !important;
+}
+
+@media (prefers-color-scheme: dark) {
+  .login-pf body {
+    background: linear-gradient(rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.85)),
+      url("../img/bg.png");
+    color: white;
+  }
+
+  .pf-c-button.pf-m-primary {
+    --pf-c-button--m-primary--BackgroundColor: #008bff;
+  }
+
+  .pf-c-button.pf-m-primary:hover {
+    --pf-c-button--m-primary--BackgroundColor: #1971c2;
+  }
+
+  #kc-locale ul {
+    color: white !important;
+    background: #212121 !important;
+  }
+
+  .pf-c-dropdown__menu-item {
+    outline: none !important;
+    color: white;
+    background: #212121;
+  }
+
+  .pf-c-dropdown__menu-item:hover {
+    outline: none !important;
+    color: white;
+    background: #121212;
+  }
+
+  .card-pf {
+    color: white;
+    background-color: hsla(0 0% 10% / 1);
+    border: 1px solid hsl(0 0% 20%);
+  }
+
+  .pf-c-form-control,
+  .pf-c-input-group {
+    color: white;
+    background-color: hsla(0 0% 15% / 1);
+  }
+
+  .pf-c-input-group i {
+    color: white;
+  }
+
+  #kc-registration a {
+    color: #008bff;
+  }
+}

docker/jws-0.0.2/keycloak-themes/jws/login/theme.properties

@@ -0,0 +1,3 @@
+parent=keycloak
+import=common/keycloak
+styles=css/login.css css/style.css