Skip to content
Commits on Source (103)
......@@ -28,7 +28,6 @@ default:
variables:
FDO_UPSTREAM_REPO: GNOME/gnome-shell
BUNDLE: "extensions-git.flatpak"
JS_LOG: "js-report.txt"
LINT_LOG: "eslint-report.xml"
LINT_MR_LOG: "eslint-mr-report.xml"
......@@ -46,16 +45,16 @@ workflow:
- if: '$CI_COMMIT_BRANCH =~ /^gnome-[0-9-]+$/'
- when: 'manual'
.gnome-shell.fedora:35:
.gnome-shell.fedora:
variables:
FDO_DISTRIBUTION_VERSION: 35
FDO_DISTRIBUTION_TAG: '2022-01-18.0'
FDO_DISTRIBUTION_VERSION: 38
FDO_DISTRIBUTION_TAG: '2023-04-21.1'
FDO_DISTRIBUTION_PACKAGES:
findutils
mozjs91-devel
gjs
nodejs
npm
meson
pkgconfig(gobject-introspection-1.0)
pkgconfig(gio-2.0)
pkgconfig(gio-unix-2.0)
pkgconfig(gnome-autoar-0)
......@@ -68,13 +67,15 @@ workflow:
'C Development Tools and Libraries' &&
./.gitlab-ci/install-meson-project.sh \
https://gitlab.gnome.org/fmuellner/gjs-ci-tools.git \
main &&
./.gitlab-ci/install-meson-project.sh \
--subdir subprojects/extensions-tool/ \
--prepare ./generate-translations.sh \
-Dman=false \
https://gitlab.gnome.org/GNOME/gnome-shell.git \
main \
subprojects/extensions-tool/ \
./generate-translations.sh &&
dnf clean all
main
check_commit_log:
extends:
......@@ -119,26 +120,24 @@ check-merge-request:
build-fedora-container:
extends:
- .fdo.container-build@fedora@x86_64
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: prep
js_check:
extends:
- .fdo.distribution-image@fedora
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: review
script:
- find js -name '*.js' $(printf "! -wholename %s " $(cat .jscheckignore)) -exec js91 -c '{}' ';' 2>&1 | tee $JS_LOG
- (! grep -q . $JS_LOG)
- gjs-check-syntax
artifacts:
paths:
- ${JS_LOG}
when: on_failure
reports:
junit: gjs-check-syntax.junit.xml
eslint:
extends:
- .fdo.distribution-image@fedora
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: review
script:
- export NODE_PATH=$(npm root -g)
......@@ -151,7 +150,7 @@ eslint:
eslint_mr:
extends:
- .fdo.distribution-image@fedora
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: review
script:
- export NODE_PATH=$(npm root -g)
......@@ -168,7 +167,7 @@ eslint_mr:
potfile_c_check:
extends:
- .fdo.distribution-image@fedora
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: review
script:
- ./.gitlab-ci/check-potfiles.sh
......@@ -176,10 +175,13 @@ potfile_c_check:
potfile_js_check:
extends:
- .fdo.distribution-image@fedora
- .gnome-shell.fedora:35
- .gnome-shell.fedora
stage: review
script:
- js91 -m .gitlab-ci/check-potfiles.js
- gjs-check-potfiles
artifacts:
reports:
junit: gjs-check-potfiles.junit.xml
build:
stage: build
......
const gettextFuncs = new Set([
'_',
'N_',
'C_',
'NC_',
'dcgettext',
'dgettext',
'dngettext',
'dpgettext',
'gettext',
'ngettext',
'pgettext',
]);
function dirname(file) {
const split = file.split('/');
split.pop();
return split.join('/');
}
const scriptDir = dirname(import.meta.url);
const root = dirname(scriptDir);
const excludedFiles = new Set();
const foundFiles = new Set()
function addExcludes(filename) {
const contents = os.file.readFile(filename);
const lines = contents.split('\n')
.filter(l => l && !l.startsWith('#'));
lines.forEach(line => excludedFiles.add(line));
}
addExcludes(`${root}/po/POTFILES.in`);
addExcludes(`${root}/po/POTFILES.skip`);
function walkAst(node, func) {
func(node);
nodesToWalk(node).forEach(n => walkAst(n, func));
}
function findGettextCalls(node) {
switch(node.type) {
case 'CallExpression':
if (node.callee.type === 'Identifier' &&
gettextFuncs.has(node.callee.name))
throw new Error();
if (node.callee.type === 'MemberExpression' &&
node.callee.object.type === 'Identifier' &&
node.callee.object.name === 'Gettext' &&
node.callee.property.type === 'Identifier' &&
gettextFuncs.has(node.callee.property.name))
throw new Error();
break;
}
return true;
}
function nodesToWalk(node) {
switch(node.type) {
case 'ArrayPattern':
case 'BreakStatement':
case 'CallSiteObject': // i.e. strings passed to template
case 'ContinueStatement':
case 'DebuggerStatement':
case 'EmptyStatement':
case 'Identifier':
case 'Literal':
case 'MetaProperty': // i.e. new.target
case 'Super':
case 'ThisExpression':
return [];
case 'ArrowFunctionExpression':
case 'FunctionDeclaration':
case 'FunctionExpression':
return [...node.defaults, node.body].filter(n => !!n);
case 'AssignmentExpression':
case 'BinaryExpression':
case 'ComprehensionBlock':
case 'LogicalExpression':
return [node.left, node.right];
case 'ArrayExpression':
case 'TemplateLiteral':
return node.elements.filter(n => !!n);
case 'BlockStatement':
case 'Program':
return node.body;
case 'StaticClassBlock':
return [node.body];
case 'ClassField':
return [node.name, node.init];
case 'CallExpression':
case 'NewExpression':
case 'OptionalCallExpression':
case 'TaggedTemplate':
return [node.callee, ...node.arguments];
case 'CatchClause':
return [node.body, node.guard].filter(n => !!n);
case 'ClassExpression':
case 'ClassStatement':
return [...node.body, node.superClass].filter(n => !!n);
case 'ClassMethod':
return [node.name, node.body];
case 'ComprehensionExpression':
case 'GeneratorExpression':
return [node.body, ...node.blocks, node.filter].filter(n => !!n);
case 'ComprehensionIf':
return [node.test];
case 'ComputedName':
return [node.name];
case 'ConditionalExpression':
case 'IfStatement':
return [node.test, node.consequent, node.alternate].filter(n => !!n);
case 'DoWhileStatement':
case 'WhileStatement':
return [node.body, node.test];
case 'ExportDeclaration':
return [node.declaration, node.source].filter(n => !!n);
case 'ImportDeclaration':
return [...node.specifiers, node.source];
case 'LetStatement':
return [...node.head, node.body];
case 'ExpressionStatement':
return [node.expression];
case 'ForInStatement':
case 'ForOfStatement':
return [node.body, node.left, node.right];
case 'ForStatement':
return [node.init, node.test, node.update, node.body].filter(n => !!n);
case 'LabeledStatement':
return [node.body];
case 'MemberExpression':
return [node.object, node.property];
case 'ObjectExpression':
case 'ObjectPattern':
return node.properties;
case 'OptionalExpression':
return [node.expression];
case 'OptionalMemberExpression':
return [node.object, node.property];
case 'Property':
case 'PrototypeMutation':
return [node.value];
case 'ReturnStatement':
case 'ThrowStatement':
case 'UnaryExpression':
case 'UpdateExpression':
case 'YieldExpression':
return node.argument ? [node.argument] : [];
case 'SequenceExpression':
return node.expressions;
case 'SpreadExpression':
return [node.expression];
case 'SwitchCase':
return [node.test, ...node.consequent].filter(n => !!n);
case 'SwitchStatement':
return [node.discriminant, ...node.cases];
case 'TryStatement':
return [node.block, node.handler, node.finalizer].filter(n => !!n);
case 'VariableDeclaration':
return node.declarations;
case 'VariableDeclarator':
return node.init ? [node.init] : [];
case 'WithStatement':
return [node.object, node.body];
default:
print(`Ignoring ${node.type}, you should probably fix this in the script`);
}
}
function walkDir(dir) {
os.file.listDir(dir).forEach(child => {
if (child.startsWith('.'))
return;
const path = os.path.join(dir, child);
const relativePath = path.replace(`${root}/`, '');
if (excludedFiles.has(relativePath))
return;
if (!child.endsWith('.js')) {
try {
walkDir(path);
} catch (e) {
// not a directory
}
return;
}
try {
const script = os.file.readFile(path);
const ast = Reflect.parse(script);
walkAst(ast, findGettextCalls);
} catch (e) {
foundFiles.add(path);
}
});
}
walkDir(root);
if (foundFiles.size === 0)
quit(0);
print('The following files are missing from po/POTFILES.in:')
foundFiles.forEach(f => print(` ${f}`));
quit(1);
......@@ -2,33 +2,81 @@
set -e
if [[ $# -lt 4 ]]; then
echo Usage: $0 [options] [repo-url] [commit] [subdir]
echo Options:
echo -Dkey=val
exit 1
fi
usage() {
cat <<-EOF
Usage: $(basename $0) [OPTION…] REPO_URL COMMIT
Check out and install a meson project
Options:
-Dkey=val Option to pass on to meson
--subdir Build subdirectory instead of whole project
--prepare Script to run before build
-h, --help Display this help
EOF
}
TEMP=$(getopt \
--name=$(basename $0) \
--options='D:h' \
--longoptions='subdir:' \
--longoptions='prepare:' \
--longoptions='help' \
-- "$@")
eval set -- "$TEMP"
unset TEMP
MESON_OPTIONS=()
SUBDIR=.
PREPARE=:
while true; do
case "$1" in
-D)
MESON_OPTIONS+=( -D$2 )
shift 2
;;
while [[ $1 =~ ^-D ]]; do
MESON_OPTIONS+=( "$1" )
shift
--subdir)
SUBDIR=$2
shift 2
;;
--prepare)
PREPARE=$2
shift 2
;;
-h|--help)
usage
exit 0
;;
--)
shift
break
;;
esac
done
if [[ $# -lt 2 ]]; then
usage
exit 1
fi
REPO_URL="$1"
COMMIT="$2"
SUBDIR="$3"
PREPARE="$4"
REPO_DIR="$(basename ${REPO_URL%.git})"
CHECKOUT_DIR=$(mktemp --directory)
trap "rm -rf $CHECKOUT_DIR" EXIT
git clone --depth 1 "$REPO_URL" -b "$COMMIT"
pushd "$REPO_DIR"
pushd "$SUBDIR"
git clone --depth 1 "$REPO_URL" -b "$COMMIT" "$CHECKOUT_DIR"
pushd "$CHECKOUT_DIR/$SUBDIR"
sh -c "$PREPARE"
meson --prefix=/usr _build "${MESON_OPTIONS[@]}"
meson setup --prefix=/usr _build "${MESON_OPTIONS[@]}"
meson install -C _build
popd
popd
rm -rf "$REPO_DIR"
js/ui/init.js
\ No newline at end of file
44.1
====
* Add section title in background apps menu [Florian; !2681]
* Fix visibility of xembed icons [Marco; !2684]
* Fix placeholder alignment in bluetooth menu [Sebastian; !2687]
* Fix recording screenshots in recent items [Carlos, Adam; !2692, !2725]
* Fix reloading extensions on version-validation changes [Florian; !2694]
* Fix force-enabling animations at runtime [Florian; !2698]
* Fix stuck session after logout dialog timeout [Florian; !2696]
* Fix window screenshots with pointer [Ivan; !2710, !2702]
* Only show network subtitles if they don't match the title [Georges; !2682]
* Fix constructing QuickMenuToggles with icon-name [Florian; !2726]
* Fix accessible names in VPN menu [Lukáš; !2720]
* Don't fail extracting extensions without schemas [Andy; !2727]
* Fixes and improvements to the light theme variant [Sam; !2515]
* Improve accessible name of wireless menu items [Lukáš; !2724]
* Use consistent naming for "Power Mode" toggle [Automeris; !2697]
* Fix support for transparent colors in symbolic SVGs [Florian; !2731]
* Fix notifications getting stuck indefinitely [msizanoen1; !2736]
* Fix keynav of menu-less buttons [Florian; !2734]
* Fix corner cases when matching apps on StartupWmClass [Marco; !2721]
* Fix occasional misalignment of search results [Sebastian; !2744]
* Fix regression in content-type sniffing on autorun [Balló; !2745]
* Fix building API documentation [Bobby; !2749]
* Fixed crash [Jonas Å.; !2722]
* Plugged leak [Sebastian; !2737]
* Misc. bug fixes and cleanups [Florian, Will, Daniel, Marco, Sebastian,
Jordan, Jonas D.; !2679, !2689, !2693, !2639, !2661, !2685, !2709, !2699,
!2711, !2723, !2728, !2730, !2739, !2738, !2740, !2712, !2695, !2193]
Contributors:
Jonas Ådahl, Jonas Dreßler, Carlos Garnacho, Balló György, Sam Hewitt,
Andy Holmes, Sebastian Keller, Ivan Molodetskikh, msizanoen1, Florian Müllner,
Automeris naranja, Georges Basile Stavracas Neto, Jordan Petridis, Bobby Rong,
Will Thompson, Marco Trevisan (Treviño), Lukáš Tyrychtr, Daniel van Vugt,
Adam Williamson
Translators:
Fran Dieguez [gl], Balázs Úr [hu], Andika Triwidada [id], Anders Jonsson [sv],
Martin [sl], Danial Behzadi [fa], Bruce Cowan [en_GB], Rūdolfs Mazurs [lv],
Asier Sarasua Garmendia [eu], Nathan Follens [nl], Sabri Ünal [tr],
Boyuan Yang [zh_CN], Guillaume Bernard [fr], Alexander Shopov [bg],
Aleksandr Melman [ru], MohammadSaleh Kamyab [fa], Yuri Chornoivan [uk],
Hugo Carvalho [pt], Fabio Tomat [fur], Kukuh Syafaat [id], Piotr Drąg [pl],
Марко Костић [sr], Aurimas Černius [lt], Yaron Shahrabani [he],
Philipp Kiemle [de]
44.0
====
* Bump version
......
......@@ -7,6 +7,7 @@
<arg type="b" direction="in"/>
<arg type="b" direction="in"/>
<arg type="b" direction="in"/>
<arg type="b" direction="in"/>
</method>
<method name="WaitWindows"/>
<method name="DestroyWindows"/>
......
This diff is collapsed.
......@@ -5,66 +5,70 @@
$is_highcontrast:false;
// base color for light theme
$_dark_base_color: desaturate($dark_4, 100%);
$base_color: if($variant == 'light', $light_1, $_dark_base_color);
$bg_color: if($variant == 'light', $light_2, lighten($base_color, 5%));
$fg_color: if($variant == 'light', transparentize(black, .2), white);
$fg_color: if($variant == 'light', $_dark_base_color, white);
$selected_fg_color: $light_1;
$selected_bg_color: $blue_3;
$selected_borders_color: if($variant== 'light', darken($selected_bg_color, 15%), darken($selected_bg_color, 20%));
$borders_color: if($variant == 'light', transparentize($fg_color, .5), transparentize($fg_color, .9));
$outer_borders_color: if($variant == 'light', rgba(255,255,255,0.8), lighten($bg_color, 5%));
$borders_color: if($variant == 'light', transparentize($fg_color, .85), transparentize($fg_color, .9));
$outer_borders_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%));
$link_color: if($variant == 'light', darken($selected_bg_color, 10%), lighten($selected_bg_color, 20%));
$link_visited_color: if($variant == 'light', darken($selected_bg_color, 20%), lighten($selected_bg_color, 10%));
$warning_color: if($variant == 'light', $yellow_5, #cd9309);
$warning_color: if($variant == 'light', $yellow_5, $yellow_3);
$error_color: if($variant == 'light', $red_3, $red_4);
$success_color: if($variant == 'light', $green_4, $green_5);
$destructive_color: $error_color;
$osd_fg_color: $light_1;
$osd_bg_color: $_dark_base_color; //hardcoded for both light & dark
// color definitions for OSD elements
$osd_fg_color: if($variant == 'light', $_dark_base_color, $light_1);
$osd_bg_color: if($variant == 'light', $light_3, lighten($_dark_base_color, 5%));
// derived osd colors
$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
$osd_insensitive_fg_color: if($variant == 'light', mix($osd_fg_color, $osd_bg_color, 80%), mix($osd_fg_color, $osd_bg_color, 70%));
$osd_borders_color: transparentize(black, 0.3);
$osd_outer_borders_color: transparentize($osd_fg_color, 0.9);
$osd_insensitive_fg_color: mix($osd_fg_color, $osd_bg_color, 70%);
$osd_borders_color: transparentize($osd_fg_color, 0.9);
$osd_outer_borders_color: transparentize($osd_fg_color, 0.98);
$shadow_color: if($variant == 'light', rgba(0,0,0,0.1), rgba(0,0,0,0.2));
$shadow_color: if($variant == 'light', rgba(0,0,0,.05), rgba(0,0,0,0.2));
// button
$button_mix_factor: 9%;
// buttons
$button_mix_factor: if($variant == 'light', 12%, 9%);
// notifications
$bubble_buttons_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%));
// overview background color
$system_bg_color: $base_color;
// color definitions for system elements (e.g. the overview)
$system_base_color: $_dark_base_color; // always dark
$system_fg_color: $light_2;
// derived system colors
$system_bg_color: lighten($system_base_color, 5%);
$system_borders_color: transparentize($system_fg_color, .9);
$system_insensitive_fg_color: mix($system_fg_color, $system_bg_color, 50%);
$system_overlay_bg_color: mix($system_base_color, $system_fg_color, 90%); // for non-transparent items, e.g. dash
//insensitive state derived colors
$insensitive_fg_color: mix($fg_color, $bg_color, 50%);
// derived global colors
// insensitive state
$insensitive_fg_color: if($variant == 'light', mix($fg_color, $bg_color, 60%), mix($fg_color, $bg_color, 50%));
$insensitive_bg_color: mix($bg_color, $base_color, 60%);
$insensitive_borders_color: mix($borders_color, $base_color, 60%);
//colors for the backdrop state, derived from the main colors.
$backdrop_base_color: if($variant =='light', darken($base_color,1%), lighten($base_color,1%));
$backdrop_bg_color: $bg_color;
$backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 80%);
$backdrop_insensitive_color: if($variant =='light', darken($backdrop_bg_color,15%), lighten($backdrop_bg_color,15%));
$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
$backdrop_dark_fill: mix($backdrop_borders_color,$backdrop_bg_color, 35%);
// derived checked colors
// checked state
$checked_bg_color: if($variant=='light', darken($bg_color, 7%), lighten($bg_color, 7%));
$checked_fg_color: if($variant=='light', darken($fg_color, 7%), lighten($fg_color, 7%));
// derived hover colors
$hover_bg_color: if($variant=='light', darken($bg_color, 3%), lighten($bg_color, 10%));
$hover_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 10%));
// hover state
$hover_bg_color: if($variant=='light', darken($bg_color,9%), lighten($bg_color, 10%));
$hover_fg_color: if($variant=='light', darken($fg_color,9%), lighten($fg_color, 10%));
// derived active colors
$active_bg_color: if($variant=='light', darken($bg_color, 5%), lighten($bg_color, 12%));
$active_fg_color: if($variant=='light', darken($fg_color, 5%), lighten($fg_color, 12%));
// active state
$active_bg_color: if($variant=='light', darken($bg_color, 11%), lighten($bg_color, 12%));
$active_fg_color: if($variant=='light', darken($fg_color, 11%), lighten($fg_color, 12%));
......@@ -57,18 +57,6 @@ stage {
/* Common Stylings */
// osd panels
%osd_panel {
color: $osd_fg_color;
background-color: $osd_bg_color;
border: 1px solid $osd_outer_borders_color;
border-radius: 999px;
padding: $base_padding*2;
@if $is_highcontrast {
border: 2px solid $hc_inset_color;
}
}
// icon tiles
%tile {
border-radius: $base_border_radius * 2; // 16px
......@@ -77,19 +65,24 @@ stage {
border: 2px solid transparent;
transition-duration: 200ms;
text-align: center;
color: inherit;
@if $is_highcontrast {
border-color: $hc_inset_color;
}
}
// normal button styling
%button {
%button_common {
border-radius: $base_border_radius;
border-style: solid;
border-width: 1px;
font-weight: bold;
padding: $base_padding*.5 $base_padding*4;
}
%button {
@extend %button_common;
@include button(normal);
&:focus { @include button(focus);}
&:hover { @include button(hover);}
......@@ -111,19 +104,24 @@ stage {
// normal entry style
%entry {
%entry_common {
border-radius: $base_border_radius;
padding: $base_padding*1.5 $base_padding*1.5;
color: $fg_color;
selection-background-color: $selected_bg_color;
selected-color: $selected_fg_color;
@include entry(normal);
&:hover { @include entry(hover);}
&:focus { @include entry(focus);}
&:insensitive { @include entry(insensitive);}
}
%entry {
@extend %entry_common;
@include entry(normal, $c:$fg_color);
&:hover { @include entry(hover, $c:$fg_color);}
&:focus { @include entry(focus, $c:$fg_color);}
&:insensitive { @include entry(insensitive, $c:$fg_color);}
StLabel.hint-text {
color: transparentize($fg_color, 0.3);
}
}
// buttons in dialogs/notifications
// lighter in color and have a greater radius
......@@ -166,36 +164,21 @@ stage {
}
}
// buttons on OSD elements
// that are undecorated by default and use OSD colors
%osd_button {
@include button(undecorated);
&:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);}
}
// tooltip
%tooltip {
background-color: $osd_bg_color;
color: $osd_fg_color;
border:1px solid $osd_outer_borders_color;
background-color: transparentize(black, 0.1);
color: $light_1;
border-radius: 99px;
padding: $base_padding $base_padding * 2;
text-align: center;
@if $is_highcontrast {
background-color: $osd_bg_color;
color: $osd_fg_color;
border: 1px solid $hc_inset_color;
border-color: $hc_inset_color;
}
}
/* General Typography */
%large_title {
font-weight: 300;
@include fontsize(24);
......@@ -243,3 +226,68 @@ stage {
%monospace {font-family: monospace;}
%numeric { font-feature-settings: "tnum";}
/* OSD Elements */
%osd_panel {
color: $osd_fg_color;
background-color: $osd_bg_color;
border: 1px solid $osd_outer_borders_color;
border-radius: 999px;
padding: $base_padding*2;
@if $is_highcontrast {
border: 2px solid $hc_inset_color;
}
}
// entries
%osd_entry {
@extend %entry_common;
@include entry(normal, $c:$osd_fg_color,);
&:hover { @include entry(hover, $c:$osd_fg_color,);}
&:focus { @include entry(focus, $c:$osd_fg_color,);}
&:insensitive { @include entry(insensitive, $c:$osd_fg_color,);}
StLabel.hint-text {color: transparentize($osd_fg_color, 0.3); }
}
// buttons on OSD elements
%osd_button {
@extend %button_common;
@include button(normal, $tc:$osd_fg_color, $c:$osd_bg_color);
&:insensitive { @include button(insensitive, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:focus { @include button(focus, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:hover { @include button(hover, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:active { @include button(active, $tc:$osd_fg_color, $c:$osd_bg_color);}
&:outlined,&:checked { @include button(checked, $tc:$osd_fg_color, $c:$osd_bg_color);}
}
%osd_button_flat {
@extend %osd_button;
@include button(undecorated);
&:insensitive { @include button(undecorated, $tc:$osd_fg_color, $c:$osd_bg_color);}
}
/* System Elements */
// entries
%system_entry {
@extend %entry_common;
@include entry(normal, $c:$system_fg_color,);
&:hover { @include entry(hover, $c:$system_fg_color,);}
&:focus { @include entry(focus, $c:$system_fg_color,);}
&:insensitive { @include entry(insensitive, $c:$system_fg_color,);}
StLabel.hint-text { color: transparentize($system_fg_color, 0.3);}
}
// buttons
%system_button {
@include button(normal, $tc:$system_fg_color, $c:$system_bg_color);
&:insensitive { @include button(insensitive, $tc:$system_fg_color, $c:$system_bg_color);}
&:focus { @include button(focus, $tc:$system_fg_color, $c:$system_bg_color);}
&:hover { @include button(hover, $tc:$system_fg_color, $c:$system_bg_color);}
&:active { @include button(active, $tc:$system_fg_color, $c:$system_bg_color);}
&:outlined,&:checked { @include button(checked, $tc:$system_fg_color, $c:$system_bg_color);}
}
......@@ -23,23 +23,22 @@
@else { box-shadow: $shadow1; }
}
// entries
@mixin entry($t, $fc:$selected_bg_color) {
// Text entries
@mixin entry($t, $c) {
//
// Entries drawing function
//
// $t: entry type
// $fc: focus color
// $c: text color, used to derive background color of entries
//
// possible $t values:
// normal, focus, insensitive
// possible $t values: normal, focus, insensitive
//
transition-duration: 100ms;
@if $t==normal {
background-color: transparentize($fg_color, 0.9);
color: transparentize($fg_color,0.3);
background-color: transparentize($c, 0.85);
color: transparentize($c,0.3);
@if $is_highcontrast {
box-shadow: inset 0 0 0 1px $hc_inset_color;
......@@ -47,20 +46,19 @@
}
@if $t==focus {
background-color: mix(transparentize($fg_color, 0.8), $selected_bg_color, 95%);
box-shadow: inset 0 0 0 2px $fc;
color: $fg_color;
background-color: mix(transparentize($c, 0.75), $selected_bg_color, 95%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3);
color: $c;
&:hover {}
}
@if $t==hover {
background-color:transparentize($fg_color, 0.8);
color: inherit;
background-color: transparentize($c, 0.75);
}
@if $t==insensitive {
background-color:transparentize($insensitive_fg_color, 0.8);
color: $insensitive_fg_color;
background-color:transparentize($c, 0.75);
color: transparentize($c, 0.5);
}
}
......@@ -162,44 +160,54 @@
}
}
// focused button
@if $t==focus {
color: $tc;
background-color: mix($button_bg_color, $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.4) !important;
&:hover {
background-color: mix(lighten($button_bg_color, 3%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3) !important;
}
&:active {
background-color: mix(lighten($button_bg_color, 6%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3) !important;
}
}
// hover button
@else if $t==hover {
color: $tc;
background-color: lighten($button_bg_color, 3%);
@if $is_highcontrast {
box-shadow: inset 0 0 0 1px $hc_inset_color !important;
background-color: if($variant == 'light', darken($button_bg_color, 3%), lighten($button_bg_color, 3%));
@if $is_highcontrast == "true" {
box-shadow: inset 0 0 0 1px lighten($button_inset_color, 3%);
background-color: mix(lighten($button_bg_color, 3%), $button_inset_color, 10%);
}
}
// active button
@else if $t==active {
color: $tc;
background-color: lighten($button_bg_color, 9%);
background-color: if($variant == 'light', darken($button_bg_color, 6%), lighten($button_bg_color, 6%));
@if $is_highcontrast == "true" {
box-shadow: inset 0 0 0 1px lighten($button_inset_color, 6%);
background-color: mix(lighten($button_bg_color, 6%), $button_inset_color, 10%);
}
}
// checked button
@else if $t==checked {
color: $tc;
background-color: lighten($button_bg_color, 9%);
background-color: if($variant == 'light', darken($button_bg_color, 9%), lighten($button_bg_color, 9%));
@if $is_highcontrast == "true" {
box-shadow: inset 0 0 0 1px lighten($button_inset_color, 9%);
background-color: mix(lighten($button_bg_color, 9%), $button_inset_color, 10%);
}
&:hover { background-color: lighten($button_bg_color, 12%);}
&:active { background-color: lighten($button_bg_color, 15%);}
}
// focused button
@if $t==focus {
color: $tc;
background-color: mix($button_bg_color, $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.4) !important;
&:hover {
background-color: mix(lighten($button_bg_color, 3%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3) !important;
}
&:active {
background-color: mix(lighten($button_bg_color, 6%), $selected_bg_color, 90%);
box-shadow: inset 0 0 0 2px transparentize($selected_bg_color, 0.3) !important;
}
}
// insensitive button
@else if $t==insensitive {
color: transparentize($tc, 0.5);
......@@ -274,17 +282,15 @@
// overview icon, dash, app grid
@mixin overview_icon($color, $flat: true) {
transition-duration: 400ms;
.overview-icon {
.overview-icon {
@extend %tile;
}
@if $flat {
.overview-icon { background-color: transparent;}
} @else {
.overview-icon {
background-color: transparentize($color, .93);
}
.overview-icon { background-color: transparentize($color, .93); }
}
&:hover .overview-icon { background-color: transparentize($color, .9);}
&:hover .overview-icon { background-color: transparentize($color, .87);}
&:selected .overview-icon,
&:focus .overview-icon {
......@@ -319,6 +325,12 @@
&:hover {@include button(hover);}
&:active {@include button(active);}
&:focus {@include button(focus);}
&:insensitive {
@include button(insensitive);
@if $flat {
background-color: transparent;
}
}
}
// styling for all menuitems in popovers
......
......@@ -5,66 +5,70 @@
$is_highcontrast:true;
$base_color: if($variant == 'light', white, black);
$base_color: if($variant == 'light', $light_1, $dark_5);
$bg_color: if($variant == 'light', darken($base_color, 10%), lighten($base_color, 10%));
$fg_color: if($variant == 'light', transparentize(black, .2), white);
$fg_color: if($variant == 'light', transparentize($dark_5, .2), $light_1);
$selected_fg_color: white;
$selected_fg_color: $light_1;
$selected_bg_color: $blue_3;
$selected_borders_color: darken($selected_bg_color, 20%);
$borders_color: if($variant == 'light', transparentize($fg_color, .5), transparentize($fg_color, .7));
$outer_borders_color: $borders_color;
$link_color: lighten($selected_bg_color,20%);
$link_visited_color: lighten($selected_bg_color,10%);
$warning_color: if($variant == 'light', $yellow_5, #cd9309);
$warning_color: if($variant == 'light', $yellow_5, $yellow_3);
$error_color: if($variant == 'light', $red_3, $red_4);
$success_color: if($variant == 'light', $green_4, $green_5);
$destructive_color: $error_color;
$osd_fg_color: white;
// color definitions for OSD elements
$osd_fg_color: $light_1;
$osd_bg_color: $base_color;
// derived osd colors
$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
$osd_insensitive_fg_color: if($variant == 'light', mix($osd_fg_color, $osd_bg_color, 80%), mix($osd_fg_color, $osd_bg_color, 70%));
$osd_insensitive_fg_color: mix($osd_fg_color, $osd_bg_color, 70%);
$osd_borders_color: transparentize($osd_fg_color, 0.8);
$osd_outer_borders_color: $osd_borders_color;
$shadow_color: rgba(0,0,0,0);
// hc
$hc_inset_color: transparentize($fg_color, 0.7);
// button
$button_mix_factor: 20%;
// notifications
$bubble_buttons_color: if($variant == 'light', darken($bg_color, 7%), lighten($bg_color, 5%));
// overview background color
$system_bg_color: black;
// color definitions for system elements
$system_base_color: $dark_5;
$system_fg_color: $light_1;
// derived system colors
$system_bg_color: lighten($system_base_color, 5%);
$system_borders_color: transparentize($system_fg_color, .9);
$system_insensitive_fg_color: mix($system_fg_color, $system_bg_color, 50%);
$system_overlay_bg_color: mix($system_bg_color, $system_fg_color, 90%);
//insensitive state derived colors
// derived global colors
// insensitive state
$insensitive_fg_color: mix($fg_color, $bg_color, 50%);
$insensitive_bg_color: mix($bg_color, $base_color, 60%);
$insensitive_borders_color: $borders_color;
//colors for the backdrop state, derived from the main colors.
$backdrop_base_color: lighten($base_color,1%);
$backdrop_bg_color: $bg_color;
$backdrop_fg_color: mix($fg_color, $backdrop_bg_color, 80%);
$backdrop_insensitive_color: lighten($backdrop_bg_color,15%);
$backdrop_borders_color: mix($borders_color, $bg_color, 90%);
$backdrop_dark_fill: mix($backdrop_borders_color,$backdrop_bg_color, 35%);
// derived checked colors
// checked state
$checked_bg_color: if($variant=='light', darken($bg_color, 12%), lighten($bg_color, 18%));
$checked_fg_color: if($variant=='light', darken($fg_color, 12%), lighten($fg_color, 18%));
// derived hover colors
// hover state
$hover_bg_color: if($variant=='light', darken($bg_color, 8%), lighten($bg_color, 20%));
$hover_fg_color: if($variant=='light', darken($fg_color, 10%), lighten($fg_color, 20%));
// derived active colors
// active state
$active_bg_color: if($variant=='light', darken($bg_color, 10%), lighten($bg_color, 22%));
$active_fg_color: if($variant=='light', darken($fg_color, 10%), lighten($fg_color, 22%));
// inset colour for high contrast
$hc_inset_color: transparentize($fg_color, 0.7);
......@@ -18,11 +18,12 @@ $app_icon_size: 96px;
// Icon tiles in the app grid
.app-well-app {
@include overview_icon($osd_fg_color);
@include overview_icon($system_fg_color);
.overview-icon {
padding: $base_padding*2;
border-radius: $base_border_radius*3;
color: $system_fg_color;
}
.overview-icon.overview-icon-with-label {
> StBoxLayout {
......@@ -33,7 +34,7 @@ $app_icon_size: 96px;
// app folders
.app-well-app.app-folder {
@include overview_icon($fg_color, $flat: false);
@include overview_icon($system_fg_color, $flat: false);
}
// expanded folder
......@@ -62,7 +63,7 @@ $app_icon_size: 96px;
}
/* FIXME: this is to keep the label in sync with the entry */
& .folder-name-label { padding: 5px 7px; color: $osd_fg_color; }
& .folder-name-label { padding: 5px 7px; color: $system_fg_color; }
& .edit-folder-button {
@extend %button;
......@@ -100,7 +101,7 @@ $app_icon_size: 96px;
width: 5px;
border-radius:5px;
margin-bottom: 8px;
background-color: $osd_fg_color;
background-color: $system_fg_color;
}
// Rename popup for app folders
......@@ -130,8 +131,8 @@ $app_icon_size: 96px;
// shutdown and other actions in the grid
.system-action-icon {
background-color: rgba(0,0,0,0.8);
color: white;
background-color: transparentize($system_fg_color,.9);
color: $system_fg_color;
border-radius: 99px;
icon-size: $app_icon_size * 0.5;
@if $is_highcontrast {
......@@ -167,11 +168,14 @@ $app_icon_size: 96px;
width: 24px;
height: 24px;
border-radius: 99px;
> StIcon { color: $system_fg_color;}
@if $is_highcontrast {
@include button(normal, $osd_fg_color, transparentize($osd_bg_color, 0.5));
@include button(normal, $system_fg_color, transparentize($system_bg_color, 0.5));
}
&:insensitive { @include button(undecorated, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
&:hover { @include button(hover, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
&:active { @include button(active, $osd_fg_color, transparentize($osd_bg_color, 0.5));}
&:insensitive { @include button(undecorated, $system_fg_color, transparentize($system_bg_color, 0.5));}
&:hover { @include button(hover, $system_fg_color, transparentize($system_bg_color, 0.5));}
&:active { @include button(active, $system_fg_color, transparentize($system_bg_color, 0.5));}
}
......@@ -78,7 +78,7 @@
&:hover {background-color: $hover_bg_color;}
&:focus {
background-color: mix($bg_color, $selected_bg_color, 80%);
color: $selected_fg_color;
color: inherit;
box-shadow:inset 0 0 0 2px transparentize($selected_bg_color, 0.4);
}
......@@ -166,11 +166,11 @@
.events-list {
spacing: 2 * $base_padding;
color: $fg_color;
}
.events-title {
@extend %heading;
color: $insensitive_fg_color;
margin-bottom: $base_margin;
}
......
/* Dash */
$dash_background_color: lighten($system_bg_color, 5%);
// uses system colors
$dash_background_color: $system_overlay_bg_color;
$dash_placeholder_size: 32px;
$dash_padding: $base_padding*2; // 12px
$dash_border_radius: $modal_radius + $dash_padding;
......@@ -55,10 +57,11 @@ $dash_border_radius: $modal_radius + $dash_padding;
}
// show apps button
.show-apps { @include overview_icon($osd_fg_color);}
.show-apps { @include overview_icon($system_fg_color);}
.show-apps, .app-well-app {
padding-bottom: $dash_padding;
color: $system_fg_color;
}
}
......@@ -66,7 +69,7 @@ $dash_border_radius: $modal_radius + $dash_padding;
.dash-separator {
width: 1px;
margin: 0 $base_margin;
background-color: $borders_color;
background-color: $system_borders_color;
margin-bottom: $dash_padding;
@if $is_highcontrast {
width: 2px;
......
......@@ -16,6 +16,5 @@ StEntry {
StLabel.hint-text {
margin-left: 2px;
color: transparentize($fg_color, 0.3);
}
}
$_gdm_bg: $system_bg_color;
$_gdm_fg: white;
$_gdm_fg: $system_fg_color;
$_gdm_dialog_width: 23em;
// common style for gdm and lockscreen
......@@ -19,12 +19,12 @@ $_gdm_dialog_width: 23em;
// buttons
.login-dialog-button {
@extend .button;
&.cancel-button,
&.switch-user-button,
&.login-dialog-session-list-button {
@extend .icon-button;
@extend %system_button;
}
&.cancel-button {
......@@ -145,7 +145,9 @@ $_gdm_dialog_width: 23em;
width: 26em;
}
.login-dialog-prompt-entry {}
.login-dialog-prompt-entry {
@extend %system_entry;
}
/* Screen Shield */
......
......@@ -2,19 +2,21 @@
// Dialog
#LookingGlassDialog {
background-color: transparentize($bg_color,0.05);
@extend %osd_panel;
background-color: transparentize($osd_bg_color,0.02);
color: $osd_fg_color;
border-radius: 0 0 $modal_radius $modal_radius;
border: 1px solid $outer_borders_color;
border-top-width: 0;
color: $fg_color;
padding: $base_padding;
spacing: $base_padding;
box-shadow: 0 2px 4px 0 $shadow_color;
@if $is_highcontrast {
border: 2px solid $hc_inset_color;
background-color: $bg_color;
border-top-width: 0;
background-color: $osd_bg_color;
box-shadow:none;
}
......@@ -26,21 +28,21 @@
spacing: $base_padding;
.lg-toolbar-button {
@extend %osd_button;
padding: $base_padding $base_padding*2;
@extend %button;
& > StIcon { icon-size: $base_icon_size; }
}
}
.labels {
.labels {
spacing: $base_padding;
}
.notebook-tab {
@extend %osd_button;
-natural-hpadding: $base_padding*2;
-minimum-hpadding: $base_padding*2;
@extend %button;
padding: $base_padding $base_padding*2;
}
......@@ -51,8 +53,8 @@
.lg-dialog {
StEntry {
@extend %osd_entry;
min-height: 22px;
@extend %entry;
}
.shell-link {
......@@ -118,9 +120,9 @@
.lg-debug-flag-button {
StLabel { padding: $base_padding, 2 * $base_padding; }
color: $fg_color;
&:hover { color: lighten($fg_color, 20%); }
&:active { color: darken($fg_color, 20%); }
color: $osd_fg_color;
&:hover { color: lighten($osd_fg_color, 20%); }
&:active { color: darken($osd_fg_color, 20%); }
}
.lg-debug-flags-header {
......
......@@ -10,9 +10,9 @@
&:ltr {margin-left: 0; margin-right: $base_margin; padding-right: $base_padding; border-right-width: 1px; }
&:rtl {margin-right: 0; margin-left: $base_margin; padding-left: $base_padding; border-left-width: 1px; }
.message-list-placeholder {
.message-list-placeholder {
@extend %title_2;
color: transparentize($insensitive_fg_color, .5);
color: $insensitive_fg_color;
// icon size and color
> StIcon {
......@@ -25,7 +25,7 @@
.message-list-sections {
spacing: $base_padding;
margin: 0;
margin: 0;
padding-bottom: $base_padding;
// to account for scrollbar
......@@ -117,14 +117,14 @@
// close button
.message-close-button {
color: $fg_color;
background-color: transparentize($fg_color, 0.9);
background-color: transparentize($fg_color, 0.8);
border-radius: 99px;
padding: $base_padding - 1px;
margin: 1px;
&:hover {background-color: transparentize($fg_color, 0.8);}
&:active {background-color: transparentize($fg_color, 0.9);}
&:hover {background-color: transparentize($fg_color, 0.7);}
&:active {background-color: transparentize($fg_color, 0.8);}
& StIcon { icon-size: $base_icon_size; }
> StIcon { icon-size: $base_icon_size; }
}
// body
......@@ -154,7 +154,7 @@
color: $fg_color;
}
&:active {
&:active {
background-color: lighten($active_bg_color, 5%);
color: $fg_color;
}
......@@ -165,7 +165,7 @@
border-color: transparent;
}
}
// fix margin for last button
&:last-child:ltr { margin-right: $base_margin*3; }
&:last-child:rtl { margin-left: $base_margin*3; }
......
......@@ -30,7 +30,7 @@
.flashspot { background-color: white; }
// Hidden
.hidden { color: rgba(0,0,0,0);}
.hidden { color: transparent;}
// Caps-lock warning
.caps-lock-warning-label {
......
......@@ -5,7 +5,7 @@
}
#overviewGroup {
background-color: $system_bg_color;
background-color: $system_base_color;
}
.overview-controls {
......