Просмотр исходного кода

improve xslt layout and styling

Pi 2 лет назад
Родитель
Сommit
296c26216a
1 измененных файлов с 12 добавлено и 3 удалено
  1. 12 3
      xml/style.xsl

+ 12 - 3
xml/style.xsl

@@ -25,7 +25,13 @@
 	      <link rel="stylesheet" href="https://shandan.one/css/responsive-visibility-collapse.css"/>
         <title><xsl:value-of select="name(current())"/></title>
       </head>
-      <body style="position: absolute; max-width: 68em; min-width: min(100%, 68em); left: 50%; transform: translate(max(-50%, -34em),0)">
+      <body>
+        <div style="background: darkgray; position: sticky; top: 0; padding: 0.2em; width: 100%; z-index: 1; text-align: center;">
+        <form action="random">
+          <button type="submit">Generate</button>
+	</form>
+        </div>
+        <div style="position: relative; max-width: 68em; min-width: min(100%, 68em); left: 50%; transform: translate(max(-50%, -34em),0)">
         <table class="pure-table pure-table-bordered pure-table-striped">
           <tr style="text-transform: capitalize">
             <xsl:for-each select="$schema/xsd:complexType[@name=$rowtypename]/xsd:sequence/xsd:element/@name">
@@ -58,8 +64,10 @@
                 </xsl:when>
                 <xsl:when test="$elementtype = 'category'">
                   <xsl:choose>
-                  <xsl:when test="contains(.,'a_') or contains(.,'z_')">
-                  <td class="opt-all" style="text-transform: capitalize;">Kingdom</td>
+                  <xsl:when test="contains(.,'z_')">
+                  <td class="opt-all" rowspan="2" style="text-transform: capitalize;">Kingdom</td>
+                  </xsl:when>
+                  <xsl:when test="contains(.,'a_')">
                   </xsl:when>
 		  <xsl:otherwise>
                   <td class="opt-all" style="text-transform: capitalize;"><xsl:value-of select="."/></td>
@@ -76,6 +84,7 @@
             </tr>
           </xsl:for-each>
         </table>
+        </div>
       </body>
     </html>
   </xsl:template>