Add 'readable width' theme for making release notes more easily readable

kommunarr · May 13, 2024 · 9928d93 · 9928d93
1 parent 8a8d321
commit 9928d93
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 0 deletions.
diff --git a/src/renderer/App.css b/src/renderer/App.css
@@ -40,6 +40,7 @@
   overflow-y: scroll;
   block-size: 40vh;
   display: block;
+  padding-inline: 15px;
 }
 
 .fade-enter-active, .fade-leave-active {

diff --git a/src/renderer/App.vue b/src/renderer/App.vue
@@ -15,6 +15,7 @@
     <ft-prompt
       v-if="showReleaseNotes"
       :label="changeLogTitle"
+      theme="readable-width"
       @click="showReleaseNotes = !showReleaseNotes"
     >
       <span

diff --git a/src/renderer/components/ft-prompt/ft-prompt.css b/src/renderer/components/ft-prompt/ft-prompt.css
@@ -47,6 +47,13 @@
   padding-block: 10px;
 }
 
+.promptCard.readable-width {
+  max-inline-size: 40em;
+  margin-inline: auto;
+  inset-inline: 0;
+  padding-inline: 0;
+}
+
 .center {
   text-align: center;
 }