Styling of search result page

2020-04-25 15:28:40 +02:00
parent 4f45c768ec
commit 99b4e66504
5 changed files with 94 additions and 9 deletions
@@ -1,3 +1,65 @@
 // Place all the styles related to the PeopleCrawler controller here.
 // They will automatically be included in application.css.
 // You can use Sass (SCSS) here: https://sass-lang.com/
+
+.people-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+
+  a {
+    text-decoration: none;
+    color: black;
+  }
+
+  .person {
+    line-height: 72px;
+    width: 100%;
+    padding: 8px 0 8px 0;
+
+    .list-link {
+      float: left;
+      width: 89%;
+    }
+
+    .person-icon {
+      display: inline-block;
+      max-width: 48px;
+      height: auto;
+      margin-right: 8px;
+
+      img {
+        vertical-align: middle;
+        width: 48px;
+        height: 48px;
+        border-radius: 50%;
+        object-fit: cover;
+      }
+
+      svg {
+        vertical-align: middle;
+        width: 48px;
+        height: auto;
+      }
+    }
+
+    .person-name {
+      text-align: center;
+      width: 100%;
+    }
+
+    .add-to-fav {
+      display: inline-block;
+      vertical-align: middle;
+      float: right;
+      width: 36px;
+      height: 36px;
+
+      svg {
+        width: 100%;
+        height: auto;
+        vertical-align: middle;
+      }
+    }
+  }
+}