XWIKI-13912: Impossible to control contrast of the panel headers on F…

…lamingo (#2497) * Added the panel header text color to the ThemeSheet.xml * Changed the name of the variable to fit other variables in the tab * Updated color themes * Fixed property name * Fixed colortheme files and homogeneized property names * Fixed codestyle * Fixed consistency * Fixed backward compatibility
xwiki · Jan 18, 2024 · 9990ac4 · 9990ac4
1 parent 1e0ddae
commit 9990ac4
Show file tree

Hide file tree

Showing 27 changed files with 371 additions and 10 deletions.
diff --git a/...in/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/accordion.less b/...in/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/accordion.less
@@ -4,12 +4,12 @@
 
 .accordionTabTitleBar h1 {
   display:block;
-  background-color: @xwiki-panel-header-bg;
+  background-color: @panel-header-bg;
   background-image: url(@xwiki-accordion-title-bar-background);
   background-repeat: no-repeat;
   background-position: center left;
   border-bottom: 1px solid @xwiki-border-color;
-  color: @xwiki-panel-header-text;
+  color: @panel-header-text;
   font: 700 .8em / 1.8em sans-serif;
   margin: 0;
   overflow: hidden;
@@ -30,4 +30,4 @@
 .openDetails {
   cursor: pointer;
   float: right;
-}
+}
diff --git a/...tform-flamingo-skin-resources/src/main/resources/flamingo/less/colorThemeMappingOutput.vm b/...tform-flamingo-skin-resources/src/main/resources/flamingo/less/colorThemeMappingOutput.vm
@@ -42,8 +42,8 @@
 #mapping("menuSelectedEntryLinkColor" "@navbar-default-link-active-color")
 #mapping("panelBackgroundColor", "@panel-bg")
 #mapping("panelTextColor", "@panel-default-text")
-#mapping("panelHeaderTextColor", "@xwiki-panel-header-text")
-#mapping("panelHeaderBackgroundColor", "@xwiki-panel-header-bg")
+#mapping("panelHeaderTextColor", "@panel-header-text")
+#mapping("panelHeaderBackgroundColor", "@panel-header-bg")
 #mapping("buttonPrimaryTextColor", "@btn-primary-color")
 #mapping("buttonPrimaryBackgroundColor", "@btn-primary-bg")
 #mapping("buttonSecondaryTextColor", "@btn-default-color")
@@ -54,4 +54,4 @@
 #mapping("notificationSuccessColor", "@brand-success")
 #mapping("notificationInfoColor", "@brand-info")
 #mapping("notificationWarningColor", "@brand-warning")
-#mapping("notificationErrorColor", "@brand-danger")
+#mapping("notificationErrorColor", "@brand-danger")
diff --git a/...-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/panels.less b/...-skin/xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/panels.less
@@ -11,7 +11,7 @@ h1.xwikipaneltitle, h2.xwikipaneltitle {
   .panel-title;
   margin: @padding-small-vertical @padding-large-horizontal @padding-large-vertical;
   padding: 0 0 @padding-large-vertical;
-  color: @xwiki-panel-header-text;
+  color: @panel-header-text;
   border-bottom: @border-width solid @xwiki-page-content-bg;
   box-shadow: 0 @border-width 0 @xwiki-border-color;
   overflow: hidden;

diff --git a/.../xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/variablesInit.vm b/.../xwiki-platform-flamingo-skin-resources/src/main/resources/flamingo/less/variablesInit.vm
@@ -98,6 +98,9 @@
 
   @panel-bg:                            $theme.panelBackgroundColor;
   @panel-default-text:                  $theme.panelTextColor;
+  @panel-header-bg:                     $theme.panelHeaderBackgroundColor;
+  @panel-header-text:                   $theme.panelHeaderTextColor;
+  ## Kept for backward compatibility
   @xwiki-panel-header-bg:               $theme.panelHeaderBackgroundColor;
   @xwiki-panel-header-text:             $theme.panelHeaderTextColor;
 
@@ -194,6 +197,7 @@
       "legend-border-color": "color",
       "panel-bg" : "color",
       "panel-default-text" : "color",
+      "panel-header-text" : "color",
       "breadcrumb-bg": "color",
       "breadcrumb-color": "color",
       "breadcrumb-separator": "escapedText",
@@ -225,13 +229,16 @@
   ## currently, it comes from the old color theme object (see colorThemeInit.vm)
   // Default
   @xwiki-border-color:                  $theme.borderColor;
-  @xwiki-panel-header-bg:               $theme.panelHeaderBackgroundColor;
-  @xwiki-panel-header-text:             $theme.panelHeaderTextColor;
+  @panel-header-bg:                     $theme.panelHeaderBackgroundColor;
+  @panel-header-text:                   $theme.panelHeaderTextColor;
   @xwiki-page-content-bg:               $theme.pageContentBackgroundColor;
   @xwiki-background-secondary-color:    $theme.backgroundSecondaryColor;
   @xwiki-page-header-bg-color:          $theme.pageHeaderBackgroundColor;
   @xwiki-page-header-bg-image:          $stringtool.defaultString($theme.headerBackgroundImage, '""');
   @xwiki-page-header-bg-position:       $stringtool.defaultString($theme.headerBackgroundPosition, '""');
+  ## Kept for backward compatibility
+  @xwiki-panel-header-bg:               $theme.panelHeaderBackgroundColor;
+  @xwiki-panel-header-text:             $theme.panelHeaderTextColor;
 
   ## Some values are changed from the bootstrap default in order to make sure there's no accessibility contrast issue
   ## Make sure the links are dark enough in the tmDrawer

diff --git a/...e/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cerulean.xml b/...e/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cerulean.xml
@@ -753,6 +753,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -1941,6 +1954,9 @@
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cosmo.xml b/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cosmo.xml
@@ -744,6 +744,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2059,6 +2072,9 @@ a.list-group-item {
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cyborg.xml b/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Cyborg.xml
@@ -753,6 +753,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2050,6 +2063,9 @@ a.list-group-item {
     <property>
       <panel-bg>#060606</panel-bg>
     </property>
+    <property>
+      <panel-header-text>#ffffff</panel-header-text>
+    </property>
     <property>
       <text-color>#999999</text-color>
     </property>

diff --git a/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Darkly.xml b/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Darkly.xml
@@ -753,6 +753,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2155,6 +2168,9 @@ a.list-group-item {
     <property>
       <panel-bg>#222222</panel-bg>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color>#ffffff</text-color>
     </property>

diff --git a/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Flatly.xml b/...eme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Flatly.xml
@@ -753,6 +753,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2138,6 +2151,9 @@ a.list-group-item {
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...me/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Journal.xml b/...me/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Journal.xml
@@ -744,6 +744,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -1944,6 +1957,9 @@
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Lumen.xml b/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Lumen.xml
@@ -744,6 +744,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2320,6 +2333,9 @@ a.list-group-item {
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Paper.xml b/...heme/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Paper.xml
@@ -744,6 +744,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2431,6 +2444,9 @@ div.main {
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/...e/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Readable.xml b/...e/xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Readable.xml
@@ -744,6 +744,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -1997,6 +2010,9 @@ legend {
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>

diff --git a/.../xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Sandstone.xml b/.../xwiki-platform-flamingo-theme-bootswatch/src/main/resources/FlamingoThemes/Sandstone.xml
@@ -753,6 +753,19 @@
         <validationRegExp/>
         <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
       </panel-bg>
+      <panel-header-text>
+        <customDisplay/>
+        <disabled>0</disabled>
+        <name>panel-header-text</name>
+        <number>46</number>
+        <picker>0</picker>
+        <prettyName>panel-header-text</prettyName>
+        <size>30</size>
+        <unmodifiable>0</unmodifiable>
+        <validationMessage/>
+        <validationRegExp/>
+        <classType>com.xpn.xwiki.objects.classes.StringClass</classType>
+      </panel-header-text>
       <text-color>
         <customDisplay/>
         <disabled>0</disabled>
@@ -2003,6 +2016,9 @@ input,
     <property>
       <panel-bg/>
     </property>
+    <property>
+      <panel-header-text/>
+    </property>
     <property>
       <text-color/>
     </property>