Add StarshipOS branding and global dark theme to both XWiki instances
- Global high-contrast dark theme (#000000 bg / #ffffff fg) via cssVariablesInit.min.css override for xwiki-org and xwiki-com - StarshipOS SVG logo (Santino Shiba Inu badge + logotype) - SVG, 16px and 144px PNG favicons from the same badge design - docker-compose.yml bind-mounts all assets so changes survive restarts Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,6 @@
|
||||
.env
|
||||
gitea/
|
||||
nexus/
|
||||
postgres/data/
|
||||
xwiki-org/data/
|
||||
xwiki-com/data/
|
||||
@@ -0,0 +1,118 @@
|
||||
services:
|
||||
|
||||
postgres:
|
||||
image: postgres:16
|
||||
container_name: strshipos-postgres
|
||||
restart: unless-stopped
|
||||
environment:
|
||||
POSTGRES_PASSWORD: ${POSTGRES_ROOT_PASSWORD}
|
||||
volumes:
|
||||
- ./postgres/data:/var/lib/postgresql/data
|
||||
- ./postgres/init:/docker-entrypoint-initdb.d:ro
|
||||
networks:
|
||||
- internal
|
||||
healthcheck:
|
||||
test: ["CMD-SHELL", "pg_isready -U postgres"]
|
||||
interval: 10s
|
||||
timeout: 5s
|
||||
retries: 5
|
||||
|
||||
gitea:
|
||||
image: gitea/gitea:latest
|
||||
container_name: strshipos-gitea
|
||||
restart: unless-stopped
|
||||
depends_on:
|
||||
postgres:
|
||||
condition: service_healthy
|
||||
environment:
|
||||
- USER_UID=1000
|
||||
- USER_GID=1000
|
||||
- GITEA__database__DB_TYPE=postgres
|
||||
- GITEA__database__HOST=postgres:5432
|
||||
- GITEA__database__NAME=gitea
|
||||
- GITEA__database__USER=gitea
|
||||
- GITEA__database__PASSWD=${GITEA_DB_PASSWORD}
|
||||
- GITEA__server__DOMAIN=gitea.strshipos.com
|
||||
- GITEA__server__SSH_DOMAIN=gitea.strshipos.com
|
||||
- GITEA__server__ROOT_URL=https://gitea.strshipos.com/
|
||||
- GITEA__server__HTTP_PORT=3000
|
||||
- GITEA__server__SSH_PORT=2222
|
||||
- GITEA__server__SSH_LISTEN_PORT=22
|
||||
- GITEA__security__SECRET_KEY=${GITEA_SECRET_KEY}
|
||||
- GITEA__service__DISABLE_REGISTRATION=false
|
||||
volumes:
|
||||
- ./gitea/data:/data
|
||||
ports:
|
||||
- "127.0.0.1:3000:3000"
|
||||
- "0.0.0.0:2222:22"
|
||||
networks:
|
||||
- internal
|
||||
|
||||
nexus:
|
||||
image: sonatype/nexus3:latest
|
||||
container_name: strshipos-nexus
|
||||
restart: unless-stopped
|
||||
environment:
|
||||
- INSTALL4J_ADD_VM_PARAMS=-Xms256m -Xmx768m -XX:MaxDirectMemorySize=512m -Djava.util.prefs.userRoot=/nexus-data/jvm
|
||||
volumes:
|
||||
- ./nexus/data:/nexus-data
|
||||
ports:
|
||||
- "127.0.0.1:8081:8081"
|
||||
networks:
|
||||
- internal
|
||||
|
||||
xwiki-org:
|
||||
image: xwiki:lts-postgres-tomcat
|
||||
container_name: strshipos-xwiki-org
|
||||
restart: unless-stopped
|
||||
depends_on:
|
||||
postgres:
|
||||
condition: service_healthy
|
||||
environment:
|
||||
- DB_HOST=postgres
|
||||
- DB_PORT=5432
|
||||
- DB_DATABASE=xwiki_org
|
||||
- DB_USER=xwiki_org
|
||||
- DB_PASSWORD=${XWIKI_ORG_DB_PASSWORD}
|
||||
- JAVA_OPTS=-Xms256m -Xmx512m
|
||||
volumes:
|
||||
- ./xwiki-org/data:/usr/local/xwiki
|
||||
- ./xwiki-org/cssVariablesInit.min.css:/usr/local/tomcat/webapps/ROOT/skins/flamingo/cssVariablesInit.min.css
|
||||
- ./logo.svg:/usr/local/tomcat/webapps/ROOT/skins/flamingo/logo.svg
|
||||
- ./favicon.svg:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon.svg
|
||||
- ./favicon16.png:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon16.png
|
||||
- ./favicon144.png:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon144.png
|
||||
ports:
|
||||
- "127.0.0.1:8090:8080"
|
||||
networks:
|
||||
- internal
|
||||
|
||||
xwiki-com:
|
||||
image: xwiki:lts-postgres-tomcat
|
||||
container_name: strshipos-xwiki-com
|
||||
restart: unless-stopped
|
||||
depends_on:
|
||||
postgres:
|
||||
condition: service_healthy
|
||||
environment:
|
||||
- DB_HOST=postgres
|
||||
- DB_PORT=5432
|
||||
- DB_DATABASE=xwiki_com
|
||||
- DB_USER=xwiki_com
|
||||
- DB_PASSWORD=${XWIKI_COM_DB_PASSWORD}
|
||||
- JAVA_OPTS=-Xms256m -Xmx512m
|
||||
volumes:
|
||||
- ./xwiki-com/data:/usr/local/xwiki
|
||||
- ./xwiki-com/cssVariablesInit.min.css:/usr/local/tomcat/webapps/ROOT/skins/flamingo/cssVariablesInit.min.css
|
||||
- ./logo.svg:/usr/local/tomcat/webapps/ROOT/skins/flamingo/logo.svg
|
||||
- ./favicon.svg:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon.svg
|
||||
- ./favicon16.png:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon16.png
|
||||
- ./favicon144.png:/usr/local/tomcat/webapps/ROOT/resources/icons/xwiki/favicon144.png
|
||||
ports:
|
||||
- "127.0.0.1:8091:8080"
|
||||
networks:
|
||||
- internal
|
||||
|
||||
networks:
|
||||
internal:
|
||||
driver: bridge
|
||||
+63
@@ -0,0 +1,63 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 72 72" width="72" height="72">
|
||||
<defs>
|
||||
<path id="favArc" d="M 8,36 A 28,28 0 0,1 64,36"/>
|
||||
<radialGradient id="gal" cx="45%" cy="40%" r="60%">
|
||||
<stop offset="0%" stop-color="#1a2a5a" stop-opacity="0.7"/>
|
||||
<stop offset="100%" stop-color="#06081a" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
|
||||
<!-- Background circle -->
|
||||
<circle cx="36" cy="36" r="36" fill="#06081a"/>
|
||||
<circle cx="36" cy="36" r="36" fill="url(#gal)"/>
|
||||
<!-- Border rings -->
|
||||
<circle cx="36" cy="36" r="34" fill="none" stroke="#ffffff" stroke-width="1.5"/>
|
||||
<circle cx="36" cy="36" r="30" fill="none" stroke="#ffffff" stroke-width="0.5" stroke-dasharray="2,3"/>
|
||||
|
||||
<!-- Ears (behind head) -->
|
||||
<ellipse cx="21" cy="23" rx="7.5" ry="10" fill="#c05010" transform="rotate(-18,21,23)"/>
|
||||
<ellipse cx="51" cy="23" rx="7.5" ry="10" fill="#c05010" transform="rotate(18,51,23)"/>
|
||||
<ellipse cx="21" cy="23" rx="4.5" ry="6" fill="#e07830" transform="rotate(-18,21,23)"/>
|
||||
<ellipse cx="51" cy="23" rx="4.5" ry="6" fill="#e07830" transform="rotate(18,51,23)"/>
|
||||
|
||||
<!-- Head -->
|
||||
<ellipse cx="36" cy="38" rx="16" ry="15" fill="#e07820"/>
|
||||
<!-- Chin/cheek patch -->
|
||||
<ellipse cx="36" cy="43" rx="11" ry="9" fill="#f5d090"/>
|
||||
<!-- Forehead blaze -->
|
||||
<ellipse cx="36" cy="29" rx="5.5" ry="4.5" fill="#f8e8c0"/>
|
||||
|
||||
<!-- Eyes -->
|
||||
<ellipse cx="28.5" cy="36" rx="4.5" ry="4" fill="#1a0a00"/>
|
||||
<ellipse cx="43.5" cy="36" rx="4.5" ry="4" fill="#1a0a00"/>
|
||||
<circle cx="29" cy="36" r="3" fill="#5a3010"/>
|
||||
<circle cx="43" cy="36" r="3" fill="#5a3010"/>
|
||||
<circle cx="29" cy="36" r="2" fill="#0d0800"/>
|
||||
<circle cx="43" cy="36" r="2" fill="#0d0800"/>
|
||||
<circle cx="30" cy="34.5" r="1" fill="#ffffff"/>
|
||||
<circle cx="44" cy="34.5" r="1" fill="#ffffff"/>
|
||||
<!-- Brows -->
|
||||
<path d="M 24.5,32 Q 28.5,30.5 32,31.5" stroke="#1a0a00" stroke-width="1.5" fill="none" stroke-linecap="round"/>
|
||||
<path d="M 40,31.5 Q 43.5,30.5 47.5,32" stroke="#1a0a00" stroke-width="1.5" fill="none" stroke-linecap="round"/>
|
||||
|
||||
<!-- Nose + smirk -->
|
||||
<ellipse cx="36" cy="41" rx="3" ry="2" fill="#1a0a00"/>
|
||||
<path d="M 34,43.5 Q 37.5,47 43,44.5" stroke="#1a0a00" stroke-width="1.3" fill="none" stroke-linecap="round"/>
|
||||
<path d="M 34,43.5 Q 32,44 31.5,43" stroke="#1a0a00" stroke-width="1" fill="none" stroke-linecap="round"/>
|
||||
|
||||
<!-- Collar + SANTINO tag -->
|
||||
<path d="M 21,52 Q 36,57 51,52" stroke="#2a6a8a" stroke-width="4.5" fill="none" stroke-linecap="round"/>
|
||||
<rect x="27" y="54" width="18" height="9" rx="2.5" ry="2.5" fill="#1a4a6a"/>
|
||||
<circle cx="27" cy="58.5" r="4" fill="#1a4a6a"/>
|
||||
<circle cx="45" cy="58.5" r="4" fill="#1a4a6a"/>
|
||||
<text x="36" y="61" font-family="Arial, sans-serif" font-size="4.5" font-weight="bold"
|
||||
fill="#ffffff" text-anchor="middle" letter-spacing="0.5">SANTINO</text>
|
||||
|
||||
<!-- Arced "starshipOS" text -->
|
||||
<text font-family="Arial, sans-serif" font-size="8" font-weight="bold"
|
||||
fill="#ffffff" letter-spacing="0.5">
|
||||
<textPath href="#favArc" startOffset="8%">starshipOS</textPath>
|
||||
</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 901 B |
@@ -0,0 +1,85 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 230 72" width="230" height="72">
|
||||
<defs>
|
||||
<!-- Arc path for text -->
|
||||
<path id="topArc" d="M 11,36 A 25,25 0 0,1 61,36"/>
|
||||
<!-- Galaxy gradient -->
|
||||
<radialGradient id="gal" cx="45%" cy="40%" r="60%">
|
||||
<stop offset="0%" stop-color="#1a2a5a" stop-opacity="0.7"/>
|
||||
<stop offset="100%" stop-color="#06081a" stop-opacity="0"/>
|
||||
</radialGradient>
|
||||
</defs>
|
||||
|
||||
<!-- ── BADGE ── -->
|
||||
<!-- Space-blue background -->
|
||||
<circle cx="36" cy="36" r="34" fill="#06081a"/>
|
||||
<!-- Subtle galaxy gradient overlay -->
|
||||
<circle cx="36" cy="36" r="34" fill="url(#gal)"/>
|
||||
<!-- Outer border rings -->
|
||||
<circle cx="36" cy="36" r="33" fill="none" stroke="#ffffff" stroke-width="1.2"/>
|
||||
<circle cx="36" cy="36" r="29" fill="none" stroke="#ffffff" stroke-width="0.4" stroke-dasharray="2,3"/>
|
||||
|
||||
<!-- ── DOG EARS (behind head) ── -->
|
||||
<ellipse cx="22" cy="24" rx="7" ry="9" fill="#c05010" transform="rotate(-18,22,24)"/>
|
||||
<ellipse cx="50" cy="24" rx="7" ry="9" fill="#c05010" transform="rotate(18,50,24)"/>
|
||||
<!-- Inner ear -->
|
||||
<ellipse cx="22" cy="24" rx="4" ry="5.5" fill="#e07830" transform="rotate(-18,22,24)"/>
|
||||
<ellipse cx="50" cy="24" rx="4" ry="5.5" fill="#e07830" transform="rotate(18,50,24)"/>
|
||||
|
||||
<!-- ── DOG HEAD ── -->
|
||||
<ellipse cx="36" cy="37" rx="15" ry="14" fill="#e07820"/>
|
||||
<!-- White cheek/chin patch -->
|
||||
<ellipse cx="36" cy="42" rx="10" ry="8" fill="#f5d090"/>
|
||||
<!-- White forehead blaze -->
|
||||
<ellipse cx="36" cy="29" rx="5" ry="4" fill="#f8e8c0"/>
|
||||
|
||||
<!-- ── EYES ── -->
|
||||
<!-- Eye whites -->
|
||||
<ellipse cx="29" cy="35" rx="4" ry="3.5" fill="#1a0a00"/>
|
||||
<ellipse cx="43" cy="35" rx="4" ry="3.5" fill="#1a0a00"/>
|
||||
<!-- Irises -->
|
||||
<circle cx="29.5" cy="35" r="2.8" fill="#5a3010"/>
|
||||
<circle cx="42.5" cy="35" r="2.8" fill="#5a3010"/>
|
||||
<!-- Pupils -->
|
||||
<circle cx="29.5" cy="35" r="1.8" fill="#0d0800"/>
|
||||
<circle cx="42.5" cy="35" r="1.8" fill="#0d0800"/>
|
||||
<!-- Eye shine -->
|
||||
<circle cx="30.3" cy="33.8" r="0.9" fill="#ffffff"/>
|
||||
<circle cx="43.3" cy="33.8" r="0.9" fill="#ffffff"/>
|
||||
<!-- Confident brow lines -->
|
||||
<path d="M 25.5,31.5 Q 29,30 32,31" stroke="#1a0a00" stroke-width="1.5" fill="none" stroke-linecap="round"/>
|
||||
<path d="M 40,31 Q 43,30 46.5,31.5" stroke="#1a0a00" stroke-width="1.5" fill="none" stroke-linecap="round"/>
|
||||
|
||||
<!-- ── NOSE + MOUTH ── -->
|
||||
<ellipse cx="36" cy="40" rx="3" ry="2" fill="#1a0a00"/>
|
||||
<!-- Smirk -->
|
||||
<path d="M 34,42.5 Q 37,45.5 42,43.5" stroke="#1a0a00" stroke-width="1.3" fill="none" stroke-linecap="round"/>
|
||||
<path d="M 34,42.5 Q 32,43 31.5,42" stroke="#1a0a00" stroke-width="1" fill="none" stroke-linecap="round"/>
|
||||
|
||||
<!-- ── SANTINO COLLAR TAG ── -->
|
||||
<!-- Collar band -->
|
||||
<path d="M 22,50 Q 36,55 50,50" stroke="#2a6a8a" stroke-width="4" fill="none" stroke-linecap="round"/>
|
||||
<!-- Bone-shaped tag -->
|
||||
<rect x="28" y="52" width="16" height="8" rx="2" ry="2" fill="#1a4a6a"/>
|
||||
<circle cx="28" cy="56" r="3.5" fill="#1a4a6a"/>
|
||||
<circle cx="44" cy="56" r="3.5" fill="#1a4a6a"/>
|
||||
<text x="36" y="58.5" font-family="Arial, sans-serif" font-size="4.5" font-weight="bold"
|
||||
fill="#ffffff" text-anchor="middle" letter-spacing="0.5">SANTINO</text>
|
||||
|
||||
<!-- ── ARCED TEXT ── -->
|
||||
<text font-family="Arial, sans-serif" font-size="7.5" font-weight="bold"
|
||||
fill="#ffffff" letter-spacing="0.8">
|
||||
<textPath href="#topArc" startOffset="5%">starshipOS</textPath>
|
||||
</text>
|
||||
|
||||
<!-- ── LOGOTYPE TEXT to the right ── -->
|
||||
<!-- "starship" light weight -->
|
||||
<text x="80" y="36" font-family="'Helvetica Neue', Arial, sans-serif"
|
||||
font-size="23" font-weight="300" fill="#ffffff" letter-spacing="-0.5">starship</text>
|
||||
<!-- "OS" bold -->
|
||||
<text x="80" y="62" font-family="'Helvetica Neue', Arial, sans-serif"
|
||||
font-size="23" font-weight="800" fill="#ffffff" letter-spacing="1">OS</text>
|
||||
<!-- Thin separator line -->
|
||||
<line x1="80" y1="42" x2="228" y2="42" stroke="#ffffff" stroke-width="0.5" stroke-opacity="0.3"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
Vendored
+260
@@ -0,0 +1,260 @@
|
||||
/*!
|
||||
## ---------------------------------------------------------------------------
|
||||
## See the NOTICE file distributed with this work for additional
|
||||
## information regarding copyright ownership.
|
||||
##
|
||||
## This is free software; you can redistribute it and/or modify it
|
||||
## under the terms of the GNU Lesser General Public License as
|
||||
## published by the Free Software Foundation; either version 2.1 of
|
||||
## the License, or (at your option) any later version.
|
||||
##
|
||||
## This software is distributed in the hope that it will be useful,
|
||||
## but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
## MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
|
||||
## Lesser General Public License for more details.
|
||||
##
|
||||
## You should have received a copy of the GNU Lesser General Public
|
||||
## License along with this software; if not, write to the Free
|
||||
## Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA
|
||||
## 02110-1301 USA, or see the FSF site: http://www.fsf.org.
|
||||
## ---------------------------------------------------------------------------
|
||||
## The variables defined in this file were added in XWiki 17.3.0-RC1
|
||||
## Those variables will become stable at the end of the cycle 17.
|
||||
|
||||
######################
|
||||
## Preparation
|
||||
######################
|
||||
#set ($themeDocFullName = "$!xwiki.getUserPreference('colorTheme')")
|
||||
#if ($themeDocFullName == '')
|
||||
#set ($themeDocFullName = 'ColorThemes.DefaultColorTheme')
|
||||
#end
|
||||
#set ($themeDoc = $xwiki.getDocument($themeDocFullName))
|
||||
#set ($themeObj = $themeDoc.getObject('FlamingoThemesCode.ThemeClass'))
|
||||
|
||||
## List of all the new variables added to the CSS property set (from oldest to latest).
|
||||
## Those variables do not have a LESS variable equivalent in previous systems. They were introduced mostly to replace
|
||||
## whole mixins. There should be no overlap between this category of variables and the others.
|
||||
## List of versions where variables were introduced:
|
||||
## * 17.3.0RC1: 100vw, int-viewport-width, font-weight-regular, font-weight-semibold, font-weight-bold
|
||||
## * 17.9.0RC1: login-form-max-width
|
||||
#set($newVariables = {
|
||||
"100vw": "100vw",
|
||||
"int-viewport-width": "calc(10000 * tan(atan2(var(--100vw), 10000px)))",
|
||||
"login-form-max-width": "450px",
|
||||
"font-weight-regular": 400,
|
||||
"font-weight-semibold": 700,
|
||||
"font-weight-bold": "900"
|
||||
})
|
||||
|
||||
## Retrieve the lists of variables
|
||||
#template('variablelist.vm')
|
||||
## If you want to update the values set for the old colortheme, see colorThemeInit.vm, a source of truth shared
|
||||
## with LESS variables defined in xwiki-platform-flamingo-skin-resources -> variablesInit.vm -> initFromOldColorTheme
|
||||
## A couple variables are excluded from the set, we do not port them to CSS
|
||||
#set($excludeFromOldColorThemeMapping = ['xwiki-panel-header-bg', 'xwiki-panel-header-text'])
|
||||
#foreach($excludedVariable in $excludeFromOldColorThemeMapping)
|
||||
#set($discard = $oldColorThemeVariables.remove($excludedVariable))
|
||||
#end
|
||||
|
||||
## $flamingoColorThemeVariables is the list of all the variables available to customize directly in the Flamingo
|
||||
## theme editor. These mappings will not always end up in the initialization of a CSS variable.
|
||||
## If you want to update the values set for the flamingo colortheme, see the colortheme xml,
|
||||
## a source of truth shared with LESS variables, defined in xwiki-platform-flamingo-theme-ui
|
||||
## To make sure all of those variables are still available even when not set in the colortheme,
|
||||
## we make sure that they all appear in another mapping above.
|
||||
## The key is the name and the value is a type for the variable.
|
||||
|
||||
## $xsVariablesValuesCSS is the list of all the variables set in XWiki standard for various purposes.
|
||||
## Those should all be defined in variables.less and variablesInit.vm
|
||||
## Some values are changed from the bootstrap default in order to make sure there's no accessibility contrast issue
|
||||
## The key is their name and the value is the string representing the value in CSS syntax.
|
||||
## The equivalent LESS variables should be available in: xwiki-platform-flamingo-skin-resources-->variables.less
|
||||
|
||||
|
||||
## $bootstrapVariables is the list of Bootstrap variables we need to give default values for XWiki standard variables
|
||||
## The key is their name and the value is the string representing the value in CSS syntax.
|
||||
## The equivalent LESS variables are available in: xwiki-platform-bootstrap-->variables.less
|
||||
|
||||
## We merge the four maps into one list.
|
||||
## We allow different values from different maps for the same variable. This is an extra fallback in case the first one
|
||||
## doesn't work. This could be the case for defaults that rely on other variables.
|
||||
## Values follow CSS cascading order (last one wins).
|
||||
#set($variableValueSets = [$oldColorThemeVariables, $bootstrapVariables, $xsVariablesValuesCSS, $newVariables])
|
||||
|
||||
######################
|
||||
## Generation
|
||||
######################
|
||||
|
||||
#define($css)
|
||||
## We use a tan/arctan2 hack to get a proper unitless viewport width. This hack can be avoided when the CSS Values and
|
||||
## Units module Level 4 is accepted and supported in browsers.
|
||||
## https://drafts.csswg.org/css-values/#calc-type-checking
|
||||
@property --100vw {
|
||||
syntax: "<length>";
|
||||
initial-value: 0px;
|
||||
inherits: false;
|
||||
}
|
||||
|
||||
:root {
|
||||
## First, we make sure that the necessary variables from bootstrap and XS are given at least one value.
|
||||
#foreach($variableWithValue in $variableValueSets)
|
||||
#foreach($variableName in $variableWithValue.keySet())
|
||||
#set($value = $variableWithValue.get($variableName))
|
||||
#if("$!value" != '')
|
||||
--$variableName: $!value;
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
|
||||
## Create CSS variables for each flamingo colorTheme variable that is set.
|
||||
## Right now we have the variable type info for all of those, but we don't use those yet.
|
||||
## Those values will override anything already declared in the XS/bootstrap defaults.
|
||||
#foreach($property in $flamingoColorThemeVariables.keySet())
|
||||
#set($value = $themeDoc.getValue($property, $themeObj))
|
||||
#if("$!value" != '')
|
||||
## If the value we want to set is a LESS variables, we make sure to convert it into a CSS variable.
|
||||
#if($stringtool.startsWith($!value, '@'))
|
||||
#set($value = 'var(--' + $stringtool.substring($value, 1) + ')')
|
||||
#end
|
||||
#set($propertyType = $flamingoColorThemeVariables.get($property))
|
||||
## For now we only use `string` variables, because it's the easiest to setup and because it's 100% compatible with
|
||||
## LESS variables. We could use the extra info we have on the variable types to use the @property syntax later.
|
||||
#if($propertyType == 'escapedText')
|
||||
--$property: "$escapetool.javascript($!value)";
|
||||
#else
|
||||
--$property: $!value;
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
}
|
||||
#end
|
||||
*/$!css
|
||||
|
||||
/* ===== HIGH CONTRAST DARK THEME ===== */
|
||||
:root {
|
||||
--body-bg: #000000;
|
||||
--xwiki-page-content-bg: #000000;
|
||||
--xwiki-background-secondary-color: #000000;
|
||||
--xwiki-page-header-bg-color: #000000;
|
||||
--panel-bg: #000000;
|
||||
--panel-header-bg: #000000;
|
||||
--panel-header-text: #ffffff;
|
||||
--panel-default-text: #ffffff;
|
||||
--text-color: #ffffff;
|
||||
--headings-color: #ffffff;
|
||||
--link-color: #ffffff;
|
||||
--navbar-default-bg: #000000;
|
||||
--navbar-default-color: #ffffff;
|
||||
--navbar-default-link-color: #ffffff;
|
||||
--navbar-default-link-hover-color: #ffffff;
|
||||
--navbar-default-link-hover-bg: #000000;
|
||||
--navbar-default-link-active-bg: #000000;
|
||||
--navbar-default-link-active-color: #ffffff;
|
||||
--navbar-default-link-disabled-color: #ffffff;
|
||||
--dropdown-bg: #000000;
|
||||
--dropdown-link-color: #ffffff;
|
||||
--dropdown-link-hover-bg: #000000;
|
||||
--dropdown-link-hover-color: #ffffff;
|
||||
--dropdown-border: rgba(255,255,255,0.8);
|
||||
--dropdown-divider-bg: #ffffff;
|
||||
--input-bg: #000000;
|
||||
--input-color: #ffffff;
|
||||
--input-border: #ffffff;
|
||||
--input-border-focus: #ffffff;
|
||||
--input-color-placeholder: #ffffff;
|
||||
--breadcrumb-bg: #000000;
|
||||
--breadcrumb-link-color: #ffffff;
|
||||
--breadcrumb-color: #ffffff;
|
||||
--btn-default-bg: #000000;
|
||||
--btn-default-color: #ffffff;
|
||||
--btn-default-border: #ffffff;
|
||||
--btn-primary-bg: #000000;
|
||||
--btn-primary-color: #ffffff;
|
||||
--table-bg: #000000;
|
||||
--table-border-color: #ffffff;
|
||||
--table-bg-hover: #000000;
|
||||
--xwiki-border-color: #ffffff;
|
||||
--nav-tabs-border-color: #ffffff;
|
||||
--nav-tabs-active-link-hover-border-color: #ffffff;
|
||||
--nav-tabs-active-link-hover-bg: #000000;
|
||||
--nav-link-hover-bg: #000000;
|
||||
--list-group-border: #ffffff;
|
||||
--pagination-border: #ffffff;
|
||||
--pagination-hover-border: #ffffff;
|
||||
--pagination-disabled-border: #ffffff;
|
||||
--thumbnail-border: #ffffff;
|
||||
--legend-border-color: #ffffff;
|
||||
--legend-color: #ffffff;
|
||||
--navbar-default-toggle-border-color: #ffffff;
|
||||
}
|
||||
|
||||
*, *::before, *::after,
|
||||
html, body,
|
||||
.main, #mainContentArea, #xwikicontent, .xwikicontent,
|
||||
.wiki-content, .content-body, .xcontent, #body,
|
||||
.main-container, .container, .container-fluid,
|
||||
.panel, .panel-body, .panel-default, .panel-heading, .panel-footer,
|
||||
.navbar, .navbar-default, .navbar-header, .navbar-collapse,
|
||||
header, .header, #header,
|
||||
footer, .footer, #footer,
|
||||
.sidebar, #leftPanels, #rightPanels,
|
||||
.breadcrumb,
|
||||
.dropdown-menu,
|
||||
.modal-content, .modal-header, .modal-body, .modal-footer,
|
||||
.alert, .infomessage, .warningmessage, .errormessage, .successmessage,
|
||||
.drawer-nav, .drawer-overlay,
|
||||
.popover, .popover-content,
|
||||
.tab-content, .nav-tabs, .nav-pills,
|
||||
.list-group, .list-group-item,
|
||||
.well,
|
||||
.page-header,
|
||||
.actionmenu, #actionmenu {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
a, a:visited, a:hover, a:focus,
|
||||
.navbar a, .navbar .nav > li > a,
|
||||
.dropdown-menu > li > a,
|
||||
.nav > li > a,
|
||||
.breadcrumb > li > a,
|
||||
.list-group-item,
|
||||
.panel-title a {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
table, th, td, tr, thead, tbody, tfoot {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
input, textarea, select, .form-control,
|
||||
input[type=text], input[type=password], input[type=email],
|
||||
input[type=search], input[type=number], input[type=url] {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
input::placeholder, textarea::placeholder { color: #ffffff !important; opacity: 1 !important; }
|
||||
|
||||
.btn, button, input[type=submit], input[type=button], input[type=reset] {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
pre, code, .code, .box, .code-block, kbd, samp {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
hr { border-color: #ffffff !important; }
|
||||
|
||||
img { filter: brightness(0.9) contrast(1.1); }
|
||||
|
||||
svg text, svg tspan { fill: #ffffff !important; }
|
||||
/* ===== END HIGH CONTRAST DARK THEME ===== */
|
||||
Vendored
+260
@@ -0,0 +1,260 @@
|
||||
/*!
|
||||
## ---------------------------------------------------------------------------
|
||||
## See the NOTICE file distributed with this work for additional
|
||||
## information regarding copyright ownership.
|
||||
##
|
||||
## This is free software; you can redistribute it and/or modify it
|
||||
## under the terms of the GNU Lesser General Public License as
|
||||
## published by the Free Software Foundation; either version 2.1 of
|
||||
## the License, or (at your option) any later version.
|
||||
##
|
||||
## This software is distributed in the hope that it will be useful,
|
||||
## but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
## MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
|
||||
## Lesser General Public License for more details.
|
||||
##
|
||||
## You should have received a copy of the GNU Lesser General Public
|
||||
## License along with this software; if not, write to the Free
|
||||
## Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA
|
||||
## 02110-1301 USA, or see the FSF site: http://www.fsf.org.
|
||||
## ---------------------------------------------------------------------------
|
||||
## The variables defined in this file were added in XWiki 17.3.0-RC1
|
||||
## Those variables will become stable at the end of the cycle 17.
|
||||
|
||||
######################
|
||||
## Preparation
|
||||
######################
|
||||
#set ($themeDocFullName = "$!xwiki.getUserPreference('colorTheme')")
|
||||
#if ($themeDocFullName == '')
|
||||
#set ($themeDocFullName = 'ColorThemes.DefaultColorTheme')
|
||||
#end
|
||||
#set ($themeDoc = $xwiki.getDocument($themeDocFullName))
|
||||
#set ($themeObj = $themeDoc.getObject('FlamingoThemesCode.ThemeClass'))
|
||||
|
||||
## List of all the new variables added to the CSS property set (from oldest to latest).
|
||||
## Those variables do not have a LESS variable equivalent in previous systems. They were introduced mostly to replace
|
||||
## whole mixins. There should be no overlap between this category of variables and the others.
|
||||
## List of versions where variables were introduced:
|
||||
## * 17.3.0RC1: 100vw, int-viewport-width, font-weight-regular, font-weight-semibold, font-weight-bold
|
||||
## * 17.9.0RC1: login-form-max-width
|
||||
#set($newVariables = {
|
||||
"100vw": "100vw",
|
||||
"int-viewport-width": "calc(10000 * tan(atan2(var(--100vw), 10000px)))",
|
||||
"login-form-max-width": "450px",
|
||||
"font-weight-regular": 400,
|
||||
"font-weight-semibold": 700,
|
||||
"font-weight-bold": "900"
|
||||
})
|
||||
|
||||
## Retrieve the lists of variables
|
||||
#template('variablelist.vm')
|
||||
## If you want to update the values set for the old colortheme, see colorThemeInit.vm, a source of truth shared
|
||||
## with LESS variables defined in xwiki-platform-flamingo-skin-resources -> variablesInit.vm -> initFromOldColorTheme
|
||||
## A couple variables are excluded from the set, we do not port them to CSS
|
||||
#set($excludeFromOldColorThemeMapping = ['xwiki-panel-header-bg', 'xwiki-panel-header-text'])
|
||||
#foreach($excludedVariable in $excludeFromOldColorThemeMapping)
|
||||
#set($discard = $oldColorThemeVariables.remove($excludedVariable))
|
||||
#end
|
||||
|
||||
## $flamingoColorThemeVariables is the list of all the variables available to customize directly in the Flamingo
|
||||
## theme editor. These mappings will not always end up in the initialization of a CSS variable.
|
||||
## If you want to update the values set for the flamingo colortheme, see the colortheme xml,
|
||||
## a source of truth shared with LESS variables, defined in xwiki-platform-flamingo-theme-ui
|
||||
## To make sure all of those variables are still available even when not set in the colortheme,
|
||||
## we make sure that they all appear in another mapping above.
|
||||
## The key is the name and the value is a type for the variable.
|
||||
|
||||
## $xsVariablesValuesCSS is the list of all the variables set in XWiki standard for various purposes.
|
||||
## Those should all be defined in variables.less and variablesInit.vm
|
||||
## Some values are changed from the bootstrap default in order to make sure there's no accessibility contrast issue
|
||||
## The key is their name and the value is the string representing the value in CSS syntax.
|
||||
## The equivalent LESS variables should be available in: xwiki-platform-flamingo-skin-resources-->variables.less
|
||||
|
||||
|
||||
## $bootstrapVariables is the list of Bootstrap variables we need to give default values for XWiki standard variables
|
||||
## The key is their name and the value is the string representing the value in CSS syntax.
|
||||
## The equivalent LESS variables are available in: xwiki-platform-bootstrap-->variables.less
|
||||
|
||||
## We merge the four maps into one list.
|
||||
## We allow different values from different maps for the same variable. This is an extra fallback in case the first one
|
||||
## doesn't work. This could be the case for defaults that rely on other variables.
|
||||
## Values follow CSS cascading order (last one wins).
|
||||
#set($variableValueSets = [$oldColorThemeVariables, $bootstrapVariables, $xsVariablesValuesCSS, $newVariables])
|
||||
|
||||
######################
|
||||
## Generation
|
||||
######################
|
||||
|
||||
#define($css)
|
||||
## We use a tan/arctan2 hack to get a proper unitless viewport width. This hack can be avoided when the CSS Values and
|
||||
## Units module Level 4 is accepted and supported in browsers.
|
||||
## https://drafts.csswg.org/css-values/#calc-type-checking
|
||||
@property --100vw {
|
||||
syntax: "<length>";
|
||||
initial-value: 0px;
|
||||
inherits: false;
|
||||
}
|
||||
|
||||
:root {
|
||||
## First, we make sure that the necessary variables from bootstrap and XS are given at least one value.
|
||||
#foreach($variableWithValue in $variableValueSets)
|
||||
#foreach($variableName in $variableWithValue.keySet())
|
||||
#set($value = $variableWithValue.get($variableName))
|
||||
#if("$!value" != '')
|
||||
--$variableName: $!value;
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
|
||||
## Create CSS variables for each flamingo colorTheme variable that is set.
|
||||
## Right now we have the variable type info for all of those, but we don't use those yet.
|
||||
## Those values will override anything already declared in the XS/bootstrap defaults.
|
||||
#foreach($property in $flamingoColorThemeVariables.keySet())
|
||||
#set($value = $themeDoc.getValue($property, $themeObj))
|
||||
#if("$!value" != '')
|
||||
## If the value we want to set is a LESS variables, we make sure to convert it into a CSS variable.
|
||||
#if($stringtool.startsWith($!value, '@'))
|
||||
#set($value = 'var(--' + $stringtool.substring($value, 1) + ')')
|
||||
#end
|
||||
#set($propertyType = $flamingoColorThemeVariables.get($property))
|
||||
## For now we only use `string` variables, because it's the easiest to setup and because it's 100% compatible with
|
||||
## LESS variables. We could use the extra info we have on the variable types to use the @property syntax later.
|
||||
#if($propertyType == 'escapedText')
|
||||
--$property: "$escapetool.javascript($!value)";
|
||||
#else
|
||||
--$property: $!value;
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
}
|
||||
#end
|
||||
*/$!css
|
||||
|
||||
/* ===== HIGH CONTRAST DARK THEME ===== */
|
||||
:root {
|
||||
--body-bg: #000000;
|
||||
--xwiki-page-content-bg: #000000;
|
||||
--xwiki-background-secondary-color: #000000;
|
||||
--xwiki-page-header-bg-color: #000000;
|
||||
--panel-bg: #000000;
|
||||
--panel-header-bg: #000000;
|
||||
--panel-header-text: #ffffff;
|
||||
--panel-default-text: #ffffff;
|
||||
--text-color: #ffffff;
|
||||
--headings-color: #ffffff;
|
||||
--link-color: #ffffff;
|
||||
--navbar-default-bg: #000000;
|
||||
--navbar-default-color: #ffffff;
|
||||
--navbar-default-link-color: #ffffff;
|
||||
--navbar-default-link-hover-color: #ffffff;
|
||||
--navbar-default-link-hover-bg: #000000;
|
||||
--navbar-default-link-active-bg: #000000;
|
||||
--navbar-default-link-active-color: #ffffff;
|
||||
--navbar-default-link-disabled-color: #ffffff;
|
||||
--dropdown-bg: #000000;
|
||||
--dropdown-link-color: #ffffff;
|
||||
--dropdown-link-hover-bg: #000000;
|
||||
--dropdown-link-hover-color: #ffffff;
|
||||
--dropdown-border: rgba(255,255,255,0.8);
|
||||
--dropdown-divider-bg: #ffffff;
|
||||
--input-bg: #000000;
|
||||
--input-color: #ffffff;
|
||||
--input-border: #ffffff;
|
||||
--input-border-focus: #ffffff;
|
||||
--input-color-placeholder: #ffffff;
|
||||
--breadcrumb-bg: #000000;
|
||||
--breadcrumb-link-color: #ffffff;
|
||||
--breadcrumb-color: #ffffff;
|
||||
--btn-default-bg: #000000;
|
||||
--btn-default-color: #ffffff;
|
||||
--btn-default-border: #ffffff;
|
||||
--btn-primary-bg: #000000;
|
||||
--btn-primary-color: #ffffff;
|
||||
--table-bg: #000000;
|
||||
--table-border-color: #ffffff;
|
||||
--table-bg-hover: #000000;
|
||||
--xwiki-border-color: #ffffff;
|
||||
--nav-tabs-border-color: #ffffff;
|
||||
--nav-tabs-active-link-hover-border-color: #ffffff;
|
||||
--nav-tabs-active-link-hover-bg: #000000;
|
||||
--nav-link-hover-bg: #000000;
|
||||
--list-group-border: #ffffff;
|
||||
--pagination-border: #ffffff;
|
||||
--pagination-hover-border: #ffffff;
|
||||
--pagination-disabled-border: #ffffff;
|
||||
--thumbnail-border: #ffffff;
|
||||
--legend-border-color: #ffffff;
|
||||
--legend-color: #ffffff;
|
||||
--navbar-default-toggle-border-color: #ffffff;
|
||||
}
|
||||
|
||||
*, *::before, *::after,
|
||||
html, body,
|
||||
.main, #mainContentArea, #xwikicontent, .xwikicontent,
|
||||
.wiki-content, .content-body, .xcontent, #body,
|
||||
.main-container, .container, .container-fluid,
|
||||
.panel, .panel-body, .panel-default, .panel-heading, .panel-footer,
|
||||
.navbar, .navbar-default, .navbar-header, .navbar-collapse,
|
||||
header, .header, #header,
|
||||
footer, .footer, #footer,
|
||||
.sidebar, #leftPanels, #rightPanels,
|
||||
.breadcrumb,
|
||||
.dropdown-menu,
|
||||
.modal-content, .modal-header, .modal-body, .modal-footer,
|
||||
.alert, .infomessage, .warningmessage, .errormessage, .successmessage,
|
||||
.drawer-nav, .drawer-overlay,
|
||||
.popover, .popover-content,
|
||||
.tab-content, .nav-tabs, .nav-pills,
|
||||
.list-group, .list-group-item,
|
||||
.well,
|
||||
.page-header,
|
||||
.actionmenu, #actionmenu {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
a, a:visited, a:hover, a:focus,
|
||||
.navbar a, .navbar .nav > li > a,
|
||||
.dropdown-menu > li > a,
|
||||
.nav > li > a,
|
||||
.breadcrumb > li > a,
|
||||
.list-group-item,
|
||||
.panel-title a {
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
table, th, td, tr, thead, tbody, tfoot {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
input, textarea, select, .form-control,
|
||||
input[type=text], input[type=password], input[type=email],
|
||||
input[type=search], input[type=number], input[type=url] {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
input::placeholder, textarea::placeholder { color: #ffffff !important; opacity: 1 !important; }
|
||||
|
||||
.btn, button, input[type=submit], input[type=button], input[type=reset] {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
pre, code, .code, .box, .code-block, kbd, samp {
|
||||
background-color: #000000 !important;
|
||||
color: #ffffff !important;
|
||||
border-color: #ffffff !important;
|
||||
}
|
||||
|
||||
hr { border-color: #ffffff !important; }
|
||||
|
||||
img { filter: brightness(0.9) contrast(1.1); }
|
||||
|
||||
svg text, svg tspan { fill: #ffffff !important; }
|
||||
/* ===== END HIGH CONTRAST DARK THEME ===== */
|
||||
Reference in New Issue
Block a user