repos square

web_src/vuepages/pages/repos/components/ReposList.vue

@@ -97,6 +97,11 @@ export default {
 </script>
 
 <style scoped lang="less">
+.list-container {
+  margin-left: 12px;
+  margin-right: 12px;
+}
+
 .center {
   text-align: center;
 }

web_src/vuepages/pages/repos/components/SearchBar.vue

@@ -28,16 +28,19 @@
           <span style="margin-left:10px;">{{ $t('repos.search') }}</span>
         </div>
       </div>
-      <div class="_repo_search_label">
-        <a v-if="type == 'square'" :href="`/explore/repos?q=${searchInputValue.trim()}&topic=${item.v}&sort=${sort}`"
-          :style="{ backgroundColor: topicColors[index % topicColors.length] }" v-for="(item, index) in topics"
-          :key="index">{{ item.v }}</a>
-        <a v-if="type == 'search'" href="javascript:;" @click="changeTopic({ k: '', v: '' })"
-          style="color:#40485b;font-weight:bold;"
-          :style="{ backgroundColor: selectTopic == '' ? selectedColor : defaultColor }">{{ $t('repos.allFields') }}</a>
-        <a v-if="type == 'search'" href="javascript:;" @click="changeTopic(item)" style="color:#40485b;"
-          :style="{ backgroundColor: selectTopic.toLocaleLowerCase() == item.k ? selectedColor : defaultColor }"
-          v-for="(item, index) in topics" :key="index">{{ item.v }}</a>
+      <div class="_repo_search_label_c">
+        <div class="_repo_search_label">
+          <a v-if="type == 'square'" :href="`/explore/repos?q=${searchInputValue.trim()}&topic=${item.v}&sort=${sort}`"
+            :style="{ backgroundColor: topicColors[index % topicColors.length] }" v-for="(item, index) in topics"
+            :key="index">{{ item.v }}</a>
+          <a v-if="type == 'search'" href="javascript:;" @click="changeTopic({ k: '', v: '' })"
+            style="color:#40485b;font-weight:bold;"
+            :style="{ backgroundColor: selectTopic == '' ? selectedColor : defaultColor }">{{ $t('repos.allFields')
+            }}</a>
+          <a v-if="type == 'search'" href="javascript:;" @click="changeTopic(item)" style="color:#40485b;"
+            :style="{ backgroundColor: selectTopic.toLocaleLowerCase() == item.k ? selectedColor : defaultColor }"
+            v-for="(item, index) in topics" :key="index">{{ item.v }}</a>
+        </div>
       </div>
     </div>
   </div>
@@ -207,10 +210,16 @@ export default {
   cursor: pointer;
 }
 
+._repo_search_label_c {
+  display: flex;
+  justify-content: center;
+}
+
 ._repo_search_label {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
+  max-width: 1200px;
 }
 
 ._repo_search_label a {