Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Plasma
Breeze for GTK
Commits
3a328da0
Commit
3a328da0
authored
Jan 17, 2022
by
Artem Grinev
Committed by
Nate Graham
Jan 17, 2022
Browse files
gtk3, gtk4: Disable overshoot effect
This makes scrolling be more consistent with Breeze QStyle.
CCBUG: 443919
parent
7e7caf2a
Changes
2
Hide whitespace changes
Inline
Side-by-side
src/gtk3/widgets/_overshoot.scss
View file @
3a328da0
@charset
"UTF-8"
;
@mixin
overshoot
(
$p
,
$t
:
normal
,
$c
:
gtk
(
"@theme_fg_color"
)
)
{
//
// overshoot
//
// $p: position
// $t: type
// $c: base color
//
// possible $p values:
// top, bottom, right, left
//
// possible $t values:
// normal, backdrop
//
$_small_gradient_length
:
5%
;
$_big_gradient_length
:
100%
;
$_position
:
center
top
;
$_small_gradient_size
:
100%
$_small_gradient_length
;
$_big_gradient_size
:
100%
$_big_gradient_length
;
@if
$p
==
bottom
{
$_position
:
center
bottom
;
$_linear_gradient_direction
:
to
top
;
}
@else
if
$p
==
right
{
$_position
:
right
center
;
$_small_gradient_size
:
$_small_gradient_length
100%
;
$_big_gradient_size
:
$_big_gradient_length
100%
;
}
@else
if
$p
==
left
{
$_position
:
left
center
;
$_small_gradient_size
:
$_small_gradient_length
100%
;
$_big_gradient_size
:
$_big_gradient_length
100%
;
}
$_small_gradient_color
:
$c
;
$_big_gradient_color
:
$c
;
@if
$c
==
gtk
(
"@theme_fg_color"
)
{
$_small_gradient_color
:
gtkshade
(
"@borders"
,
0
.9
);
$_big_gradient_color
:
gtk
(
"@theme_fg_color"
);
@if
$t
==
backdrop
{
$_small_gradient_color
:
gtk
(
"@unfocused_borders"
);
}
}
$_small_gradient
:
-gtk-gradient
(
radial
,
$_position
,
0
,
$_position
,
0
.5
,
to
(
$_small_gradient_color
)
,
to
(
gtkalpha
(
$_small_gradient_color
,
0
))
);
$_big_gradient
:
-gtk-gradient
(
radial
,
$_position
,
0
,
$_position
,
0
.6
,
from
(
gtkalpha
(
$_big_gradient_color
,
0
.07
))
,
to
(
gtkalpha
(
$_big_gradient_color
,
0
))
);
@if
$t
==
normal
{
background-image
:
$_small_gradient
,
$_big_gradient
;
background-size
:
$_small_gradient_size
,
$_big_gradient_size
;
}
@else
if
$t
==
backdrop
{
background-image
:
$_small_gradient
;
background-size
:
$_small_gradient_size
;
}
background-repeat
:
no-repeat
;
background-position
:
$_position
;
background-color
:
transparent
;
// reset some properties to be sure to not inherit them somehow
border
:
none
;
//
box-shadow
:
none
;
//
}
scrolledwindow
{
// This is used when content is touch-dragged past boundaries.
// draws a box on top of the content, the size changes programmatically.
overshoot
{
&
.top
{
@include
overshoot
(
top
);
&
:backdrop
{
@include
overshoot
(
top
,
backdrop
);
}
}
&
.bottom
{
@include
overshoot
(
bottom
);
&
:backdrop
{
@include
overshoot
(
bottom
,
backdrop
);
}
}
&
.left
{
@include
overshoot
(
left
);
&
:backdrop
{
@include
overshoot
(
left
,
backdrop
);
}
}
&
.right
{
@include
overshoot
(
right
);
&
:backdrop
{
@include
overshoot
(
right
,
backdrop
);
}
}
}
// Overflow indication, works similarly to the overshoot, the size if fixed tho.
overshoot
,
undershoot
{
background-image
:
none
;
border
:
none
;
background
:
none
;
}
}
src/gtk4/widgets/_overshoot.scss
View file @
3a328da0
@charset
"UTF-8"
;
@mixin
overshoot
(
$p
,
$t
:
normal
,
$c
:
gtk
(
"@theme_fg_color"
)
)
{
//
// overshoot
//
// $p: position
// $t: type
// $c: base color
//
// possible $p values:
// top, bottom, right, left
//
// possible $t values:
// normal, backdrop
//
$_small_gradient_length
:
5%
;
$_big_gradient_length
:
100%
;
$_position
:
center
top
;
$_small_gradient_size
:
100%
$_small_gradient_length
;
$_big_gradient_size
:
100%
$_big_gradient_length
;
@if
$p
==
bottom
{
$_position
:
center
bottom
;
$_linear_gradient_direction
:
to
top
;
}
@else
if
$p
==
right
{
$_position
:
right
center
;
$_small_gradient_size
:
$_small_gradient_length
100%
;
$_big_gradient_size
:
$_big_gradient_length
100%
;
}
@else
if
$p
==
left
{
$_position
:
left
center
;
$_small_gradient_size
:
$_small_gradient_length
100%
;
$_big_gradient_size
:
$_big_gradient_length
100%
;
}
$_small_gradient_color
:
$c
;
$_big_gradient_color
:
$c
;
@if
$c
==
gtk
(
"@theme_fg_color"
)
{
$_small_gradient_color
:
gtkshade
(
"@borders"
,
0
.9
);
$_big_gradient_color
:
gtk
(
"@theme_fg_color"
);
@if
$t
==
backdrop
{
$_small_gradient_color
:
gtk
(
"@unfocused_borders"
);
}
}
$_small_gradient
:
radial-gradient
(
circle
,
$_small_gradient_color
0%
,
gtkalpha
(
$_small_gradient_color
,
0
)
5px
);
$_big_gradient
:
radial-gradient
(
circle
,
gtkalpha
(
$_big_gradient_color
,
0
.07
)
0%
,
gtkalpha
(
$_big_gradient_color
,
0
)
6px
);
@if
$t
==
normal
{
background-image
:
$_small_gradient
,
$_big_gradient
;
background-size
:
$_small_gradient_size
,
$_big_gradient_size
;
}
@else
if
$t
==
backdrop
{
background-image
:
$_small_gradient
;
background-size
:
$_small_gradient_size
;
}
background-repeat
:
no-repeat
;
background-position
:
$_position
;
background-color
:
transparent
;
// reset some properties to be sure to not inherit them somehow
border
:
none
;
//
box-shadow
:
none
;
//
}
scrolledwindow
{
// This is used when content is touch-dragged past boundaries.
// draws a box on top of the content, the size changes programmatically.
overshoot
{
&
.top
{
@include
overshoot
(
top
);
&
:backdrop
{
@include
overshoot
(
top
,
backdrop
);
}
}
&
.bottom
{
@include
overshoot
(
bottom
);
&
:backdrop
{
@include
overshoot
(
bottom
,
backdrop
);
}
}
&
.left
{
@include
overshoot
(
left
);
&
:backdrop
{
@include
overshoot
(
left
,
backdrop
);
}
}
&
.right
{
@include
overshoot
(
right
);
&
:backdrop
{
@include
overshoot
(
right
,
backdrop
);
}
}
}
// Overflow indication, works similarly to the overshoot, the size if fixed tho.
overshoot
,
undershoot
{
background-image
:
none
;
border
:
none
;
background
:
none
;
}
}
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment