Merge pull request #79 from nighca/example-optimization

Examples optimization

Author: xushiwei

105-Assignments/assign-1.gop

@@ -1,4 +1,5 @@
 # assignment
+
 // = is used for assigning.  The values of multiple variables can be changed in one line. In this way, their values can be swapped without an intermediary variable.
 var age int
 

105-Assignments/assign-2.gop

@@ -1,4 +1,5 @@
 # = vs :=
+
 // := is used for declaring and initializing. Multiple variables can be declared and intialized at one line.
 age := 21 // age is declared and initialized to 21
 println age

public/site.css

@@ -185,8 +185,17 @@ body {
         column-count: 2;
     }
 }
+/* See goplus/www/goplus.org/utils/index.scss */
 .text-wrapper pre, .text-wrapper code {
-    font-family: 'Menlo', 'Monaco', 'Consolas', 'Lucida Console', monospace;
+    padding: 0.2em 0.4em;
+    margin: 0;
+    font-size: 85%;
+    border-radius: 6px;
+    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
+}
+
+.text-wrapper code {
+    background-color: rgba(175, 184, 193, 0.2);
 }
 
 /* next example link in example page */

templates/example.tmpl

@@ -31,17 +31,23 @@
           <p>No content yet, you can help us build it <a href="https://github.com/goplus/tutorial/tree/main/{{.Name}}">here</a>.</p>
         {{end}}
         {{range .Files}}
+          {{if .HeadDoc}}
           <div class="docs">
             {{range .HeadDoc}}
               {{.DocsRendered}}
             {{end}}
           </div>
+          {{end}}
+          {{if .Code}}
           <goplus-code half-code language="{{.Lang}}">{{range .Code}}{{if .DocsRendered}}<goplus-code-doc>{{.DocsRendered}}</goplus-code-doc>{{end}}{{.CodeRendered}}{{end}}</goplus-code>
+          {{end}}
+          {{if .TailDoc}}
           <div class="docs">
             {{range .TailDoc}}
               {{.DocsRendered}}
             {{end}}
           </div>
+          {{end}}
         {{end}}
         {{if .Next}}
         <p class="next">