Chillcraft/Colloid-gtk-theme
3
0
Fork 0
mirror of https://github.com/vinceliuice/Colloid-gtk-theme.git synced 2025-09-16 05:18:38 -07:00
Code Issues Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
vinceliuice
2023-10-19 18:34:26 +08:00
parent b3bb0af34f
commit 9c8fc02cbe
5 changed files with 282 additions and 304 deletions
Download Patch File Download Diff File Expand all files Collapse all files

386
src/sass/gtk/_common-4.0.scss
View File

@@ -699,8 +699,8 @@ button {
// big standalone buttons like in Documents pager
&.osd {
min-width: $small-size;
min-width: $small-size;
min-height: 24px;
min-width: 24px;
padding: ($medium-size - 24px) / 2;
box-shadow: none;
background-color: rgba(black, 0.35);
@@ -2446,35 +2446,68 @@ tabbar {
}
.box {
background-color: transparent;
background-image: none;
padding: 0;
margin: 0;
border-radius: 0;
min-height: $medium-size;
border-bottom: none;
background: none;
border: none;
box-shadow: none;
&:backdrop {
background-color: transparent;
transition: none;
> scrolledwindow,
> .start-action,
> .end-action {
filter: none;
transition: none;
}
}
}
scrolledwindow.pinned {
undershoot {
border: 0 solid $border;
tabbox {
padding: 0;
min-height: $medium-size;
> background {
background: none;
}
&:dir(rtl) undershoot.left {
border-left-width: 1px;
}
> separator {
margin: 9px 0;
transition: opacity 150ms ease-in-out;
&:dir(ltr) undershoot.right {
border-right-width: 1px;
}
tabbox {
> background {
&:dir(ltr) {
box-shadow: inset -1px 0 $border;
}
&:dir(rtl) {
box-shadow: inset 1px 0 $border;
}
&.hidden {
opacity: 0;
}
}
> tabboxchild {
padding: 0;
}
}
tab {
@extend %tabs_tab;
padding: $space-size;
margin: $space-size 2px;
&.needs-attention {
background-image: $tab_needs_attention_gradient;
&:hover {
background-image: image(gtkalpha(currentColor, .03)), $tab_needs_attention_gradient;
}
}
}
tabbox.single-tab tab {
&, &:hover, &:active {
background: none;
}
}
undershoot {
@@ -2497,114 +2530,51 @@ tabbar {
@include need-attention-gradient("left");
}
tabbox {
background-color: $fill;
background-image: none;
padding: 0;
margin: 0;
border-radius: 0;
border-bottom: 1px solid $border;
> background {
background: none;
}
> separator {
margin: 9px 0;
min-width: 1px;
transition: opacity 150ms ease-in-out;
&.hidden {
opacity: 0;
}
}
> tabboxchild {
margin: 0 -3px;
padding: 0;
> tab {
@extend %tabs_tab;
margin: 3px;
}
}
}
tab {
@extend %tabs_tab;
&.needs-attention {
background-image: $tab_needs_attention_gradient;
&:hover {
background-image: image(gtkalpha(currentColor, .03)), $tab_needs_attention_gradient;
}
}
}
.start-action,
.end-action {
background-color: $fill;
background-clip: padding-box;
border-color: $border;
border-style: solid;
transition: background 150ms ease-in-out;
button {
border: none;
border-radius: 0;
}
padding: 6px 5px;
}
.start-action:dir(ltr),
.end-action:dir(rtl) {
border-right-width: 1px;
padding-right: 0;
}
.start-action:dir(rtl),
.end-action:dir(ltr) {
border-left-width: 1px;
padding-left: 0;
}
&:not(.inline) {
scrolledwindow.pinned {
undershoot {
border-color: $border;
}
}
&.inline {
@extend %tabbar-inline;
}
}
undershoot {
&.left {
@include undershoot-gradient("right", $titlebar);
}
%tabbar-inline .box {
background-color: transparent;
color: inherit;
box-shadow: none;
padding-bottom: 0;
&.right {
@include undershoot-gradient("left", $titlebar);
}
}
&:backdrop {
background-color: transparent;
transition: none;
.needs-attention-left undershoot.left {
@include need-attention-gradient("right");
> scrolledwindow,
> .start-action,
> .end-action {
filter: none;
transition: none;
}
}
}
.needs-attention-right undershoot.right {
@include need-attention-gradient("left");
}
tabbox > background {
background-color: $titlebar;
}
.start-action,
.end-action {
background-color: gtkalpha($titlebar, .6);
border-color: $border;
}
&:backdrop .box {
background-color: $titlebar-backdrop;
transition: $transition;
}
%tabbar-shrunk {
tabbox,
.start-action,
.end-action {
padding-top: $space-size / 2;
padding-bottom: $space-size / 2;
}
}
@@ -2638,16 +2608,96 @@ dnd {
min-width: $small-size;
min-height: $small-size;
border-radius: $circular-radius;
}
&.tab-close-button {
margin-right: -$space-size / 2;
}
indicator {
min-height: 2px;
border-radius: 2px;
background: gtkalpha($primary, 0.5);
transform: translateY(4px);
}
}
}
tabthumbnail {
border-radius: $corner-radius;
> box {
margin: $space-size;
}
&:drop(active) {
box-shadow: inset 0 0 0 2px gtkalpha($drop_target_color, .4);
background-color: gtkalpha($drop_target_color, .1);
}
transition: $transition-shadow;
.needs-attention {
&:dir(ltr) { transform: translate(8px, -8px); }
&:dir(rtl) { transform: translate(-8px, -8px); }
> widget {
background: $primary;
min-width: $space-size * 2;
min-height: $space-size * 2;
border-radius: $modal-radius;
margin: $space-size / 2;
box-shadow: 0 1px 2px gtkalpha($primary, .4);
}
}
.card {
background: none;
border: none;
box-shadow: none;
color: inherit;
picture {
outline: 1px solid $border;
outline-offset: -1px;
border-radius: $corner-radius;
}
}
&.pinned .card {
background-color: $fill;
color: $text;
}
.icon-title-box {
border-spacing: $space-size;
}
.tab-unpin-icon {
margin: $space-size;
min-width: 24px;
min-height: 24px;
}
button.circular {
margin: $space-size;
background-color: $fill;
min-width: 24px;
min-height: 24px;
&:hover {
background-color: $overlay-hover;
}
&:active {
background-color: $overlay-active;
}
}
}
taboverview > .overview .new-tab-button {
margin: 18px;
}
tabview:drop(active),
tabbox:drop(active) {
tabbox:drop(active),
tabgrid:drop(active) {
box-shadow: none;
}
@@ -2718,14 +2768,14 @@ scrollbar {
> range > trough > slider {
min-width: 4px;
min-height: 4px;
margin: 4px - 1px;
margin: 0;
border: 1px solid rgba($base, 0.3);
}
button {
min-width: 4px;
min-height: 4px;
margin: 4px - 1px;
margin: 0;
border: 1px solid rgba($base, 0.3);
border-radius: $circular-radius;
background-color: $text-disabled;
@@ -2749,7 +2799,7 @@ scrollbar {
}
&.dragging,
&.hovering { background-color: rgba($surface, 0.9); }
&.hovering { background-color: $fill; }
}
&.horizontal > range > trough > slider { min-width: $_slider_min_length; }
@@ -3429,19 +3479,24 @@ scrolledwindow {
viewport.frame list { border: none; }
}
// This is used when content is touch-dragged past boundaries.
// draws a box on top of the content, the size changes programmatically.
@at-root overshoot {
&.top { @include overshoot(top); }
> overshoot {
&.top {
@include overshoot(top);
}
&.bottom { @include overshoot(bottom); }
&.bottom {
@include overshoot(bottom);
}
&.left { @include overshoot(left); }
&.left {
@include overshoot(left);
}
&.right { @include overshoot(right); }
&.right {
@include overshoot(right);
}
}
// Overflow indication, works similarly to the overshoot, the size if fixed tho.
&.undershoot-top {
@include undershoot(top);
}
@@ -3459,11 +3514,6 @@ scrolledwindow {
&:dir(ltr) { @include undershoot(right); }
&:dir(rtl) { @include undershoot(left); }
}
> junction { // the small square between two scrollbars
border: none;
background-color: $base;
}
}
// vbox and hbox separators
@@ -4200,9 +4250,18 @@ window.messagedialog {
border-spacing: 10px;
}
.response-area > box > button {
.response-area button {
@extend %button-flat;
@extend %dialog_action_button;
margin: 0;
&:first-child {
margin-left: 0;
}
&:last-child {
margin-right: 0;
}
&.suggested {
color: $primary;
@@ -4212,35 +4271,6 @@ window.messagedialog {
color: $destructive;
}
}
&.csd:not(.solid-csd) {
border-radius: $window-radius;
.response-area {
> box.horizontal > button {
margin: 0;
&:first-child {
margin-left: 0;
}
&:last-child {
margin-right: 0;
}
}
> box.vertical > button {
margin-top: 0;
margin-bottom: 0;
&:last-child {
border-bottom-left-radius: $window-radius;
border-bottom-right-radius: $window-radius;
margin-bottom: 0;
}
}
}
}
}
filechooser {
@@ -4278,20 +4308,20 @@ filechooserbutton:drop(active) {
border-style: none;
background-color: $base-alt;
&:not(separator) {
&:dir(ltr),
&.left,
&.left:dir(rtl) {
border-right: 1px solid $border;
border-left-style: none;
}
// &:not(separator) {
// &:dir(ltr),
// &.left,
// &.left:dir(rtl) {
// border-right: 1px solid $border;
// border-left-style: none;
// }
&:dir(rtl),
&.right {
border-left: 1px solid $border;
border-right-style: none;
}
}
// &:dir(rtl),
// &.right {
// border-left: 1px solid $border;
// border-right-style: none;
// }
// }
listview.view,
list {
@@ -4299,7 +4329,7 @@ filechooserbutton:drop(active) {
color: inherit;
}
paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & { border-style: none; }}
// paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & { border-style: none; }}
}
stacksidebar {

4
src/sass/gtk/_drawing-4.0.scss
View File

@@ -306,7 +306,7 @@
}
#{$_selector} undershoot.#{$p} {
box-shadow: none;
box-shadow: inset $_border_pos $border;
background: linear-gradient(to $_direction, gtkalpha($c, .75), transparent 4px);
}
}
@@ -325,7 +325,7 @@
@mixin transition-shadows($color) {
> dimming {
background: none;
background: $color;
}
> border {

10
src/sass/gtk/apps/_gnome-3.0.scss
View File

@@ -468,14 +468,10 @@ frame.gedit-map-frame > border {
leaflet list.navigation-sidebar {
background-color: $base-alt;
border-bottom-left-radius: $window-radius;
}
.tweak {
// padding-top: 3px;
padding: 3px;
&.title:hover { box-shadow: none; }
window.background.csd:not(.maximized) & {
border-bottom-left-radius: $window-radius;
}
}
.tweak-group-white,

6
src/sass/gtk/apps/_gnome-4.0.scss
View File

@@ -298,7 +298,9 @@ datechooser {
navigator {
label { font-weight: bold; }
button.toggle, button.image-button {
button.flat,
button.toggle,
button.image-button {
min-height: $medium-size;
min-width: $medium-size;
padding: 0;
@@ -645,7 +647,7 @@ screenshot-carousel button,
}
}
button.card.category-tile {
.category-tile.card {
padding: $space-size * 3.5;
border: none;
border-radius: $corner-radius;

180
src/sass/gtk/apps/_libadwaita.scss
View File

@@ -369,6 +369,14 @@ overlay-split-view {
@include transition-shadows($frame);
}
toolbarview.undershoot-top scrolledwindow {
@include undershoot(top);
}
toolbarview.undershoot-bottom scrolledwindow {
@include undershoot(bottom);
}
// Sidebar
.unfolded stacksidebar.sidebar { border: none; }
@@ -381,14 +389,65 @@ overlay-split-view {
transition: background-color $duration $ease-out;
}
.sidebar-pane {
background-color: transparent;
color: inherit;
}
.toolbar,
.navigation-sidebar,
headerbar,
searchbar > revealer > box {
background-color: transparent;
box-shadow: none;
border: none;
}
banner > revealer > widget {
background-color: gtkmix($primary, $base-alt, 30%);
color: $text;
&:backdrop {
background-color: gtkmix($primary, $base-alt, 30%);
}
}
}
.content-pane {
tabbar {
tab {
&:checked:not(:active), &:selected:not(:active) {
background-color: $overlay-selected;
color: $text;
box-shadow: none;
}
}
}
}
/* Middle pane in three-pane setups */
.content-pane .sidebar-pane,
.sidebar-pane .content-pane {
background-color: $base;
color: $text;
&:backdrop {
background-color: $background;
transition: background-color $duration $ease-out;
}
banner > revealer > widget {
background-color: gtkmix($primary, $base, 30%);
color: $text;
&:backdrop {
background-color: gtkmix($primary, $base, 30%);
}
}
}
.sidebar-pane,
.content-pane .sidebar-pane,
.sidebar-pane .content-pane {
toolbarview.undershoot-top scrolledwindow {
@include undershoot(top);
}
@@ -424,18 +483,7 @@ overlay-split-view {
@include transition-shadows($frame);
}
banner > revealer > widget {
background-color: gtkmix($primary, $base-alt, 30%);
color: $text;
&:backdrop {
background-color: gtkmix($primary, $base-alt, 30%);
}
}
&:dir(ltr), &.end:dir(rtl) {
border-top-left-radius: $window-radius;
&, banner > revealer > widget {
box-shadow: none;
border-right: 1px solid $border;
@@ -443,123 +491,25 @@ overlay-split-view {
}
&:dir(rtl), &.end:dir(ltr) {
border-top-right-radius: $window-radius;
&, banner > revealer > widget {
box-shadow: none;
border-left: 1px solid $border;
}
}
window.maxmized &:dir(ltr),
window.maxmized &.end:dir(rtl) {
border-top-left-radius: 0;
}
window.maxmized &:dir(rtl),
window.maxmized &.end:dir(rtl) {
border-top-right-radius: 0;
}
}
/* Middle pane in three-pane setups */
.content-pane .sidebar-pane,
.sidebar-pane .content-pane {
background-color: $base;
color: $text;
&:backdrop {
background-color: $background;
transition: background-color $duration $ease-out;
}
toolbarview.undershoot-top scrolledwindow {
@include undershoot(top);
}
toolbarview.undershoot-bottom scrolledwindow {
@include undershoot(bottom);
}
scrolledwindow {
&.undershoot-top {
@include undershoot(top);
}
&.undershoot-bottom {
@include undershoot(bottom)
}
&.undershoot-start {
&:dir(ltr) { @include undershoot(left); }
&:dir(rtl) { @include undershoot(right); }
}
&.undershoot-end {
&:dir(ltr) { @include undershoot(right); }
&:dir(rtl) { @include undershoot(left); }
}
}
flap,
leaflet,
navigation-view,
overlay-split-view {
@include transition-shadows($border);
}
banner > revealer > widget {
background-color: gtkmix($primary, $base, 30%);
color: $text;
&:backdrop {
background-color: gtkmix($primary, $base, 30%);
}
}
&:dir(ltr), &.end:dir(rtl) {
border-top-left-radius: $window-radius;
&, banner > revealer > widget {
box-shadow: none;
border-right: 1px solid $border;
}
}
&:dir(rtl), &.end:dir(ltr) {
border-top-right-radius: $window-radius;
&, banner > revealer > widget {
box-shadow: none;
border-left: 1px solid $border;
}
}
window.maxmized &:dir(ltr),
window.maxmized &.end:dir(rtl) {
border-top-left-radius: 0;
}
window.maxmized &:dir(rtl),
window.maxmized &.end:dir(rtl) {
border-top-right-radius: 0;
}
}
.sidebar-pane .sidebar-pane {
background-color: transparent;
color: inherit;
}
// Gnome >= 45.0
.top-bar {
.sidebar-pane,
.content-pane {
headerbar {
&, &:backdrop {
background-color: transparent;
box-shadow: none;
}
}
}
// Gnome >= 45.0
.top-bar {
.collapse-spacing {
padding: 0;
}