Merge pull request Sulagna-Dutta-Roy#2112 from meetarora10/newui-branch

Improved UI of Random Bible Verse Extension
HarshadaGirase · Jul 5, 2024 · 24f4355 · 24f4355
2 parents cc1a5fd + fe73afe
commit 24f4355
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 4 deletions.
diff --git a/Random Bible verse/popup.html b/Random Bible verse/popup.html
@@ -5,6 +5,7 @@
     <link rel="stylesheet" href="styles.css">
 </head>
 <body>
+    <img src="./icon128.png" alt="">
     <h1>Random Bible Verse</h1>
     <button id="generate">Generate</button>
     <p id="verse">Click "Generate" to see a random Bible verse.</p>

diff --git a/Random Bible verse/styles.css b/Random Bible verse/styles.css
@@ -2,19 +2,28 @@ body {
   font-family: Arial, sans-serif;
   text-align: center;
   padding: 20px;
+  background: linear-gradient(45deg,rgb(233, 248, 95),rgb(207, 243, 81));
+}
+img{
+  height: 60px;
+  width: 60px;
 }
-
 h1 {
-  font-size: 24px;
-  margin-bottom: 20px;
+  font-size: 2rem;
+  margin-bottom: 100px;
 }
 
 button {
   font-size: 16px;
   padding: 10px 20px;
   margin-bottom: 20px;
+  cursor: pointer;
+  background: transparent;
+  border: 2px solid black;
+}
+button:hover{
+  background-color: rgb(233, 249, 90);
 }
-
 #verse {
   font-size: 18px;
   color: #333;