feat: feature modal style (#5032)

langgenius · Jun 7, 2024 · 3b62ab5 · 3b62ab5
1 parent d319d9f
commit 3b62ab5
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 12 deletions.
diff --git a/...figuration/config/feature/choose-feature/feature-item/preview-imgs/citation.png b/...figuration/config/feature/choose-feature/feature-item/preview-imgs/citation.png
diff --git a/...tion/config/feature/choose-feature/feature-item/preview-imgs/more-like-this.png b/...tion/config/feature/choose-feature/feature-item/preview-imgs/more-like-this.png
diff --git a/...tion/config/feature/choose-feature/feature-item/preview-imgs/speech-to-text.png b/...tion/config/feature/choose-feature/feature-item/preview-imgs/speech-to-text.png
diff --git a/...e/choose-feature/feature-item/preview-imgs/suggested-questions-after-answer.png b/...e/choose-feature/feature-item/preview-imgs/suggested-questions-after-answer.png
diff --git a/.../components/app/configuration/config/feature/choose-feature/feature-item/style.module.css b/.../components/app/configuration/config/feature/choose-feature/feature-item/style.module.css
@@ -1,7 +1,9 @@
 .preview {
   display: none;
   position: absolute;
-  transform: translate(480px, -54px);
+  top: 0;
+  left: 100%;
+  transform: translate(32px, -54px);
   width: 280px;
   height: 360px;
   background: center center no-repeat;
@@ -18,15 +20,15 @@
 }
 
 .suggestedQuestionsAfterAnswerPreview {
-  background-image: url(./preview-imgs/suggested-questions-after-answer.svg);
+  background-image: url(./preview-imgs/suggested-questions-after-answer.png);
 }
 
 .moreLikeThisPreview {
-  background-image: url(./preview-imgs/more-like-this.svg);
+  background-image: url(./preview-imgs/more-like-this.png);
 }
 
 .speechToTextPreview {
-  background-image: url(./preview-imgs/speech-to-text.svg);
+  background-image: url(./preview-imgs/speech-to-text.png);
 }
 
 .textToSpeechPreview {
@@ -35,5 +37,5 @@
 }
 
 .citationPreview {
-  background-image: url(./preview-imgs/citation.svg);
+  background-image: url(./preview-imgs/citation.png);
 }
diff --git a/web/app/components/base/features/feature-choose/feature-item/style.module.css b/web/app/components/base/features/feature-choose/feature-item/style.module.css
@@ -1,7 +1,9 @@
 .preview {
   display: none;
   position: absolute;
-  transform: translate(480px, -54px);
+  top: 0;
+  left: 100%;
+  transform: translate(32px, -54px);
   width: 280px;
   height: 360px;
   background: center center no-repeat;
@@ -14,26 +16,26 @@
 }
 
 .openingStatementPreview {
-  background-image: url(./preview-imgs/opening-statement.png);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/opening-statement.png);
 }
 
 .suggestedQuestionsAfterAnswerPreview {
-  background-image: url(./preview-imgs/suggested-questions-after-answer.svg);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/suggested-questions-after-answer.png);
 }
 
 .moreLikeThisPreview {
-  background-image: url(./preview-imgs/more-like-this.svg);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/more-like-this.png);
 }
 
 .speechToTextPreview {
-  background-image: url(./preview-imgs/speech-to-text.svg);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/speech-to-text.png);
 }
 
 .textToSpeechPreview {
   @apply shadow-lg rounded-lg;
-  background-image: url(./preview-imgs/[email protected]);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/[email protected]);
 }
 
 .citationPreview {
-  background-image: url(./preview-imgs/citation.svg);
+  background-image: url(~@/app/components/app/configuration/config/feature/choose-feature/feature-item/preview-imgs/citation.png);
 }