diff --git a/.tanzu/config/httproute.yml b/.tanzu/config/httproute.yml new file mode 100644 index 000000000..42f6fb724 --- /dev/null +++ b/.tanzu/config/httproute.yml @@ -0,0 +1,25 @@ +apiVersion: gateway.networking.k8s.io/v1beta1 +kind: HTTPRoute +metadata: + name: petclinic-route + annotations: + healthcheck.gslb.tanzu.vmware.com/service: spring-petclinic + healthcheck.gslb.tanzu.vmware.com/path: / + healthcheck.gslb.tanzu.vmware.com/port: "80" +spec: + parentRefs: + - group: gateway.networking.k8s.io + kind: Gateway + name: default-gateway + sectionName: http-petclinic + rules: + - backendRefs: + - group: "" + kind: Service + name: spring-petclinic + port: 8080 + weight: 1 + matches: + - path: + type: PathPrefix + value: / diff --git a/.tanzu/config/spring-petclinic.yml b/.tanzu/config/spring-petclinic.yml new file mode 100644 index 000000000..26c47b519 --- /dev/null +++ b/.tanzu/config/spring-petclinic.yml @@ -0,0 +1,18 @@ +apiVersion: apps.tanzu.vmware.com/v1 +kind: ContainerApp +metadata: + creationTimestamp: null + name: spring-petclinic +spec: + nonSecretEnv: + - name: SPRING_PROFILES_ACTIVE + value: openai + build: + buildpacks: {} + nonSecretEnv: + - name: BP_JVM_VERSION + value: "17" + path: ../.. + ports: + - name: main + port: 8080 diff --git a/src/main/resources/static/resources/css/petclinic.css b/src/main/resources/static/resources/css/petclinic.css index 240e43311..6f67141b8 100644 --- a/src/main/resources/static/resources/css/petclinic.css +++ b/src/main/resources/static/resources/css/petclinic.css @@ -9610,4 +9610,118 @@ strong { margin-top: 10px; margin-bottom: 30px; } } -/*# sourceMappingURL=../../../../../../target/petclinic.css.map */ \ No newline at end of file +/*# sourceMappingURL=../../../../../../target/petclinic.css.map */ + + + +/* Chatbox container */ +.chatbox { + position: fixed; + bottom: 10px; + right: 10px; + width: 300px; + background-color: #f1f1f1; + border-radius: 10px; + box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); + display: flex; + flex-direction: column; +} + +/* Header styling */ +.chatbox-header { + background-color: #075E54; + color: white; + padding: 10px; + text-align: center; + border-top-left-radius: 10px; + border-top-right-radius: 10px; + cursor: pointer; +} + +/* Chatbox content styling */ +.chatbox-content { + display: flex; + flex-direction: column; + height: 400px; /* Adjust to desired height */ + overflow: hidden; /* Hide overflow to make it scrollable */ +} + +/* Minimize style */ +.chatbox.minimized .chatbox-content { + height: 40px; /* Height when minimized (header only) */ +} + +.chatbox.minimized .chatbox-messages, +.chatbox.minimized .chatbox-footer { + display: none; +} + +.chatbox-messages { + flex-grow: 1; + overflow-y: auto; /* Allows vertical scrolling */ + padding: 10px; +} + +/* Chat bubbles styling */ +.chat-bubble { + max-width: 80%; + padding: 10px; + border-radius: 20px; + margin-bottom: 10px; + position: relative; + word-wrap: break-word; + font-size: 14px; +} + +/* Ensure bold and italic styles are handled */ +.chat-bubble strong { + font-weight: bold; +} + +.chat-bubble em { + font-style: italic; +} + +.chat-bubble.user { + background-color: #dcf8c6; /* WhatsApp-style light green */ + margin-left: auto; + text-align: right; + border-bottom-right-radius: 0; +} + +.chat-bubble.bot { + background-color: #ffffff; + margin-right: auto; + text-align: left; + border-bottom-left-radius: 0; + border: 1px solid #e1e1e1; +} + +/* Input field and button */ +.chatbox-footer { + padding: 10px; + background-color: #f9f9f9; + display: flex; +} + +.chatbox-footer input { + flex-grow: 1; + padding: 10px; + border-radius: 20px; + border: 1px solid #ccc; + margin-right: 10px; + outline: none; +} + +.chatbox-footer button { + background-color: #075E54; + color: white; + border: none; + padding: 10px; + border-radius: 50%; + cursor: pointer; +} + +.chatbox-footer button:hover { + background-color: #128C7E; +} diff --git a/src/main/scss/chatbot.scss b/src/main/scss/chatbot.scss new file mode 100644 index 000000000..fbce21b19 --- /dev/null +++ b/src/main/scss/chatbot.scss @@ -0,0 +1,88 @@ +.chatbox { + position: fixed; + bottom: 0; + right: 0; + width: 300px; + border-radius: 10px 10px 0 0; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); + font-family: Arial, sans-serif; + background-color: #f0f0f0; + overflow: hidden; + + &.minimized { + height: 40px; + } + + &-header { + background-color: $spring-green; + color: white; + padding: 10px; + cursor: pointer; + font-weight: bold; + text-align: center; + } + + &-content { + height: 400px; + display: flex; + flex-direction: column; + justify-content: space-between; + background-color: white; + transition: height 0.3s ease; + } + + &-messages { + padding: 10px; + overflow-y: auto; + height: 90%; + display: flex; + flex-direction: column; + gap: 10px; + + .chat-bubble { + padding: 10px; + border-radius: 15px; + max-width: 70%; + word-wrap: break-word; + + &.user { + background-color: $spring-brown; + color: white; + align-self: flex-end; + } + + &.bot { + background-color: $spring-grey; + color: black; + align-self: flex-start; + } + } + } + + &-footer { + display: flex; + padding: 10px; + background-color: $spring-light-grey; + + input { + flex: 1; + padding: 10px; + border-radius: 5px; + border: 1px solid $spring-brown; + } + + button { + margin-left: 10px; + padding: 10px 20px; + background-color: $spring-green; + color: white; + border: none; + border-radius: 5px; + cursor: pointer; + + &:hover { + background-color: darken($spring-green, 10%); + } + } + } +} diff --git a/src/main/scss/petclinic.scss b/src/main/scss/petclinic.scss index 9136fbd6e..d147779d7 100644 --- a/src/main/scss/petclinic.scss +++ b/src/main/scss/petclinic.scss @@ -337,3 +337,4 @@ hr { @import "typography.scss"; @import "header.scss"; @import "responsive.scss"; +@import "chatbot.scss"; \ No newline at end of file diff --git a/tanzu.yml b/tanzu.yml new file mode 100644 index 000000000..ca7b3ffe2 --- /dev/null +++ b/tanzu.yml @@ -0,0 +1,6 @@ +apiVersion: config.tanzu.vmware.com/v1 +configuration: + dev: + paths: + - .tanzu/config/ +kind: TanzuConfig