Fix some styling

src/tabs/PermissionRequest.css

@@ -10,45 +10,45 @@ body {
   padding-bottom: 50px;
 }
 
-.container {
+.permission-request.container {
   width: 90%;
   margin: 100px auto;
   max-width: 628px;
 }
 
-h1 {
+.permission-request h1 {
   font-size: 2rem;
   font-weight: bold;
 }
 
-h2 {
+.permission-request h2 {
   font-size: 1.5rem;
   font-weight: bold;
   margin-top: 4rem;
   margin-bottom: 1rem;
 }
 
-.text-color {
+.permission-request .text-color {
   color: #7C7C97;
 }
 
-.paragraph {
+.permission-request .paragraph {
   font-size: 1rem;
   margin-top: 20px;
   max-width: 500px;
   line-height: 1.3;
 }
 
-.card-list {
+.permission-request .card-list {
   margin: 1rem 0;
 }
 
-.card-list>*+* {
+.permission-request .card-list>*+* {
   margin-top: 1rem;
 }
 
-.card {
-  padding: 20px;
+.permission-request .card {
+  padding: 25px 20px;
   border: 1px solid #272A37;
   display: grid;
   grid-template-columns: auto 1fr auto;
@@ -57,9 +57,10 @@ h2 {
 }
 
 
-.card .icon-circle {
+.permission-request .card .icon-circle {
   width: 2rem;
   height: 2rem;
+  font-size: 1rem;
   background-color: rgba(39, 42, 55, 0.35);
   border: 1px solid #272A37;
   border-radius: 50%;
@@ -68,37 +69,37 @@ h2 {
   align-items: center;
 }
 
-.card.purple, .card.purple .icon-circle {
+.permission-request .card.purple, .permission-request .card.purple .icon-circle {
   border-color: #49277C;
 }
 
-.card.purple .icon-circle {
+.permission-request .card.purple .icon-circle {
   background-color: rgba(51, 27, 87, .4);
 }
 
-.card svg {
+.permission-request .card .icon-circle > div {
   display: block;
   width: 1rem;
   height: 1rem;
 }
 
-.card h3 {
+.permission-request .card h3 {
   font-size: 1rem;
   font-weight: bold;
   color: white;
-  margin-top: 0;
+  margin-top: 5px;
 }
 
-.card .paragraph {
+.permission-request .card .paragraph {
   margin-top: 0.5rem;
 }
 
-.card .center-y {
+.permission-request .card .center-y {
   display: flex;
   align-items: center;
 }
 
-.card button {
+.permission-request .card button {
   padding: 1rem;
   border-radius: 10px;
   border: 0;
@@ -108,11 +109,11 @@ h2 {
   color: white;
 }
 
-.card:not(.purple) svg {
+.permission-request .card:not(.purple) .icon-circle {
   color: #7C7C97;
 }
 
-.footer {
+.permission-request .footer {
   position: fixed;
   bottom: 0;
   left: 0;
@@ -122,4 +123,4 @@ h2 {
   display: flex;
   justify-content: center;
   align-items: center;
-}
+}