!104 Add a floating FAQ figure on the main page.

Merge pull request !104 from chenyujiahw/website0409

i18n/en.toml

@@ -102,6 +102,9 @@ other = "Get more in "
 [main_mail_more_link]
 other = "/en/community/mails.html"
 
+[main_faq]
+other = "/en/about_openeuler/docs/whtisopeneuler.html"
+
 [main_mail_more_list]
 other = "Mail List"
 

i18n/zh.toml

@@ -101,6 +101,9 @@ other = "更多订阅请点击"
 [main_mail_more_link]
 other = "/zh/community/mails.html"
 
+[main_faq]
+other = "/zh/about_openeuler/docs/whtisopeneuler.html"
+
 [main_mail_more_list]
 other = "邮件列表"
 # DOC page

themes/project/layouts/index.html

@@ -27,10 +27,11 @@
 
     {{ partial "footer.html" . }}
 
-  </div>
-  <!-- /#all -->
+    {{ partial "floatingFaq.html" . }}
 
-  {{ partial "scripts.html" . }}
+    </div>
+    <!-- /#all -->
+    {{ partial "scripts.html" . }}
 
 </body>
 

themes/project/layouts/partials/floatingFaq.html

+
+<div id="FAQ">
+    <a href="{{i18n "main_faq"}}">
+        <img src="../img/service.png" alt="">
+        <span>FAQ</span>
+    </a>
+</div>
\ No newline at end of file

themes/project/static/css/custom.css

@@ -135,6 +135,31 @@
   border: 1px solid #78ABF6;
 }
 
+#FAQ{
+  width: 56px;
+  height: 56px;
+  background-color: #EF0005;
+  color: #fff;
+  position: fixed;
+  right: 0;
+  top: 70%;
+  border-radius: 2px;
+}
+#FAQ a{
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 13px;
+}
+#FAQ a img{
+  width: 24px;
+}
+
+
 /*�ֲ�end*/
 @media screen and (max-width:768px){
   .wrapper>div>div>p:nth-child(1) {

themes/project/static/css/custommobile.css

@@ -459,6 +459,11 @@
   .main .content .nav li p {
     font-size: .24rem;
   }
+
+  #FAQ{
+    display:none
+  }
+  
   footer {
     padding: .4rem .6rem;
   }