增加站点导航卡片样式

source/scss/list/_index.scss

@@ -1,2 +1,3 @@
 @import './ul-avatar-list';
-@import './ul-order-list-simple-card';
+@import './ul-order-list-simple-card';
+@import './ul-site-list';

source/scss/list/_ul-site-list.scss

@@ -0,0 +1,72 @@
+.ul-site-group {
+    margin-bottom: 8px;
+}
+
+.ul-site-group-header {
+    font-size     : 16px;
+    color         : #333;
+    padding-bottom: 8px;
+}
+
+.ul-site-list {
+    display        : flex;
+    align-items    : flex-start;
+    justify-content: flex-start;
+    flex-wrap      : wrap;
+    margin-top     : 8px;
+}
+
+.ul-site-item {
+    width          : 20%;
+    margin-right   : 5%;
+    display        : flex;
+    align-items    : flex-start;
+    justify-content: flex-start;
+    margin-bottom  : 15px;
+
+    &.card {
+        background-color: #fff;
+        border-radius   : 5px;
+        padding         : 10px;
+        margin-right    : 15px;
+    }
+}
+
+.ul-site-item-logo {
+    width              : 34px;
+    height             : 34px;
+    margin-right       : 8px;
+    margin-top         : 4px;
+    background-size    : cover;
+    background-position: center;
+
+
+}
+
+
+.ul-site-item-info {
+    width: calc(100% - 34px);
+
+}
+
+.ul-site-item-title {
+    color          : #4662d9;
+    font-weight    : bold;
+    text-decoration: none;
+}
+
+.ul-site-item-desc {
+    font-size: 12px;
+    color    : #666;
+}
+
+@media screen and (max-width:450px) {
+    .ul-site-item {
+        width: 49%;
+    }
+
+    .ul-site-item-desc {
+        font-size : 11px;
+        margin-top: 3px;
+    }
+}