style: media query modal tablet

dezoliveira · Aug 16, 2023 · 430c79a · 430c79a
1 parent 8f7c39b
commit 430c79a
Show file tree

Hide file tree

Showing 2 changed files with 61 additions and 1 deletion.
diff --git a/script.js b/script.js
@@ -98,7 +98,7 @@ const copyLink = async (link) => {
       Copiado para área de tranferência!\n
       Link: ${link}
       Abra um terminal git e digite:\n
-      git clone "{{ o link copiado}}"
+      git clone "${link}"
     `
   )
 }

diff --git a/style.css b/style.css
@@ -346,10 +346,16 @@ section.contact {
   gap: 10px;
 }
 
+.contact .form span {
+  width: 100%;
+}
+
 .contact .form input,
 .contact .form textarea {
   width: 100%;
   padding: 8px;
+  border: 1px solid #a8a29e;
+  border-radius: 5px;
 }
 
 .contact .form input {
@@ -485,6 +491,60 @@ footer.footer {
     font-size: 18px;
   }
 
+  /* Modal */
+  .modal {
+    width: 70%;
+    height: 70%;
+  }
+
+  .modal .card img {
+    width: 100%;
+  }
+
+  .modal .card .card-title {
+    font-size: 25px;
+  }
+
+  .modal .card .card-title h1 {
+    font-size: 30px;
+  }
+
+  .modal .card-title .languages {
+    max-width: 500px;
+    gap: 10px;
+  } 
+
+  .modal .card-title .languages li {
+    padding: 5px 15px;
+    font-size: 20px;
+  }
+
+  .modal .card .card-body {
+    padding: 40px;
+  }
+
+  .modal .card .card-body p {
+    text-align: justify;
+    font-size: 25px;
+  }
+
+  .btn-disabled {
+    padding: 15px 25px;
+  }
+
+  .btn-github, .btn-live, .btn-disabled {
+    font-size: 25px;
+  }
+
+  .close-icon {
+    position: absolute;
+    top: 5px;
+    right: 20px;
+    font-size: 40px;
+  }
+
+
+  /* Contact */
   section.contact {
     padding: 200px 30px 150px;
   }