Changeset 36042 for main

Timestamp:

2022-02-03T11:10:21+13:00 (2 years ago)

Author:

cstephen

Message:

Fix right sidebar layout (TOC)
Use core styles
Use upgraded default interface

Location:

main/trunk/model-interfaces-dev/wmtb

Files:

• interfaceConfig.xml (modified) (1 diff)
• scripts/jquery.min.js (deleted)
• styles/gs-wmtb-custom.css (modified) (6 diffs)
• transform/layouts/header.xsl (modified) (1 diff)
• transform/layouts/main.xsl (modified) (2 diffs)
• transform/layouts/toc.xsl (added)

main/trunk/model-interfaces-dev/wmtb/interfaceConfig.xml

@@ -43 +43 @@
     </actionList>
     <optionList>
-        <option name="cssTheme" value="interfaces/default/style/themes/main/jquery-ui-1.8.16.custom.css"/>
+        <!-- Uncomment and update this option if you want to introduce custom CSS to this interface. -->
+        <!-- <option name="cssTheme" value="interfaces/default/style/themes/main/jquery-ui.theme.css"/> -->
+
         <option name="highlightQueryTerms" value="true"/>
         <!-- Set one or other of the following two options (berryBasket and favouriteBasket) to true -->

main/trunk/model-interfaces-dev/wmtb/styles/gs-wmtb-custom.css

@@ -10 +10 @@
     --bp-small-max: 1024px; /* 1 less */
     --a-link-color: rgb(86, 154, 189);
+    --content-padding: 2rem;
+}
+
+/* Override core styles to suit */
+
+body {
+    background-color: initial;
+}
+
+#gs_content {
+    padding: var(--content-padding);
+}
+
+.sectionHeader {
+    font-family: 'Montserrat', sans-serif;
+}
+
+div#rightSidebar {
+    min-width: initial;
+    float: initial;
+    margin: initial;
 }
 
@@ -129 +150 @@
 /* Selecting the children ensures that there is space between them */
 div.outer > * {
-    padding: 2rem;
+    padding: var(--content-padding);
 }
 
@@ -137 +158 @@
 div.outer.collectionDisplay {
     display: grid;
-    grid-template-columns: 1fr 3fr 1fr;
+    grid-template-columns: 1fr 2.8fr 1fr;
+}
+
+div.outer.collectionDisplay > * {
+    border-right: 1px solid #eaecef;
+}
+
+div.outer.collectionDisplay > :last-child {
+    border-right: none;
 }
 
@@ -143 +172 @@
     display: flex;
     flex-direction: column;
-    
-    border-right: 1px solid #eaecef;
 }
 
@@ -154 +181 @@
 .side-navbar a.active {
     font-weight: bold;
+
+    /* Override core styles */
+    background-color: inherit;
 }
 
@@ -160 +190 @@
     appearance: none;
     width: 100%;
-    border: 1px solid #eaecef;
+    border: 1px solid #d9dbdf;
 }
 

main/trunk/model-interfaces-dev/wmtb/transform/layouts/header.xsl

@@ -60 +60 @@
         <!-- whakatohea.co.nz stylesheets and fonts -->
         
+        <!--
+            TODO: These should go, they can interfere with Greenstone styling
+            and add an unnecessary overhead to render/load times.
+            Need to extract the font styling and re-create the page image header.
+            I suspect it will be easier to maintain our own recreation regardless.
+        -->
         <link rel="stylesheet" type="text/css" href="interfaces/{$interface_name}/styles/main_style.css" title="wsite-theme-css"/>
         <link id="wsite-base-style" rel="stylesheet" type="text/css" href="interfaces/{$interface_name}/styles/sites.css"/>
-            
-        <link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
+        <link rel="stylesheet" type="text/css" href="interfaces/{$interface_name}/styles/wsite.css"/>
 
         <link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
         <link href='//fonts.googleapis.com/css?family=Montserrat:400,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Montserrat:400,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Montserrat:400,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Montserrat:400,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,700,400italic,700italic&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-        <link href='//fonts.googleapis.com/css?family=Montserrat:400,700&amp;subset=latin,latin-ext' rel='stylesheet' type='text/css' />
-
-        <link rel="stylesheet" type="text/css" href="interfaces/{$interface_name}/styles/wsite.css"/>
 
         <!-- The all important Greenstone styling customisations -->
+        <link rel="stylesheet" href="interfaces/{$interface_name}/style/core.css" type="text/css"/>
         <link rel="stylesheet" href="interfaces/{$interface_name}/styles/gs-wmtb-custom.css" type="text/css" />
         
         <link rel="shortcut icon" href="interfaces/{$interface_name}/images/favicon.ico"/> 
         
-        <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery.min.js"><xsl:text> </xsl:text></script>
-        <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery-ui-1.10.2.custom/js/jquery-ui-1.10.2.custom.min.js"><xsl:text> </xsl:text></script>
+        <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery-3.6.0.min.js"><xsl:text> </xsl:text></script>
+        <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery-ui-1.13.0.custom/jquery-ui.min.js"><xsl:text> </xsl:text></script>
         <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery.themeswitcher.min.js"><xsl:text> </xsl:text></script>
         <script type="text/javascript" src="interfaces/{$interface_name}/js/jquery.blockUI.js"><xsl:text> </xsl:text></script>

main/trunk/model-interfaces-dev/wmtb/transform/layouts/main.xsl

@@ -2 +2 @@
 <xsl:stylesheet version="1.0"
   xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
-
   xmlns:java="http://xml.apache.org/xslt/java"
   xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil"
   xmlns:gslib="http://www.greenstone.org/skinning"
-    xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
-    
-    xmlns:lxslt="http://xml.apache.org/xslt"
-    xmlns:result="http://www.example.com/results"
-    xmlns:exsl="http://exslt.org/common"
+  xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
+  xmlns:lxslt="http://xml.apache.org/xslt"
+  xmlns:result="http://www.example.com/results"
+  xmlns:exsl="http://exslt.org/common"
 
   extension-element-prefixes="java util result exsl"
   exclude-result-prefixes="util java util">
+
+  <xsl:import href="./toc.xsl" />
   <!--
   <xsl:import href="footer.xsl"/>
@@ -129 +129 @@
         <xsl:apply-templates select="/page"/>               
       </div>
-      <br class="clear" />
-      
+
+      <xsl:if test="not(/page/pageResponse/format[@type='display']/gsf:option[@name='sideBar']) or /page/pageResponse/format[@type='display']/gsf:option[@name='sideBar']/@value='true'">
+        <!-- We need this for-each statement to select the right node -->
+        <xsl:for-each select="/page/pageResponse/document">
+          <xsl:call-template name="rightSidebarTOCAlt"/>
+        </xsl:for-each>
+      </xsl:if>
+
+      <!-- <br class="clear" /> -->
+
     </div><!-- end class main-wrap-->
+
     <xsl:call-template name="wmtb-footer"/>
-    
+
   </div> <!-- end site-canvas -->
       </div> <!-- end shifted-frame -->