Changeset 37280

Timestamp:

2023-02-05T11:45:16+13:00 (4 months ago)

Author:

davidb

Message:

Change in approach to customise the CSS. Makes use of 'root' CSS variables

Location:

gs3-installations/eurovision-lod/trunk/interfaces/eurovision

Files:

• interfaceConfig.xml (modified) (1 diff)
• style/core-extra.css (added)
• style/custom.css (modified) (5 diffs)

gs3-installations/eurovision-lod/trunk/interfaces/eurovision/interfaceConfig.xml

@@ -47 +47 @@
     </actionList>
     <optionList>
-            <option name="cssTheme" value="interfaces/eurovision-lod/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"/> -->
+
+        <!-- 
+             Or, alternative, as being done here ...
+             Specify your own jquery-ui custome CSS file in this interface directory.
+        -->
+        <!--
+            <option name="cssTheme" value="interfaces/eurovision/style/themes/main/jquery-ui-1.8.16.custom.css"/>
+        -->
+        
         <option name="highlightQueryTerms" value="true"/>
         <!-- Set one or other of the following two options (berryBasket and favouriteBasket) to true -->

gs3-installations/eurovision-lod/trunk/interfaces/eurovision/style/custom.css

@@ -30 +30 @@
 }
 
+.ui-widget-header {
+    border: 1px solid hsl(295, 40%, 28%);
+}
 
 #resultsArea {
@@ -37 +40 @@
 .termHighlight {
     background: hsl(195, 47%, 35%);;
+}
+
+
+.ui-button {
+    padding: 0.3em 0.75em;
 }
 
@@ -157 +165 @@
 }
 
-/*
-#quicksearcharea { */
+
+#quicksearcharea ul {
+    margin-top: 5px;
+}
+
+#quicksearcharea li {
+    display: inline;
+    list-style: none;
+    margin-left: 5px;
+    padding: 4px 6px 4px 10px;
+    font-size: 10px;
+}
 
 form select, form input {
@@ -212 +230 @@
 }
 
+/*
 #gs-nav li:hover {
     background-color: hsl(295, 92%, 30%);
 }
+*/
 
 /* but keep the currently selected one white on-hover */
+/*
 #gs-nav li.ui-tabs-selected:hover, #gs-nav li.ui-tabs-selected:hover a {
     background-color: #fff;
     cursor: default;
 }
+*/
+
+
+#gs-nav li:hover {
+    background-color: var(--gs-primary-hover-bg);
+}
+
+
+#gs-nav li.ui-tabs-selected:hover, #gs-nav li.ui-tabs-selected:hover a {
+    background-color: var(--gs-primary-bg);
+    cursor: default;
+}
+
+
 
 
@@ -261 +296 @@
     vertical-align: bottom;
 }
+
+
+