roundabout,
created on Sunday, 10 July 2016, 07:35:50 (1468136150),
received on Sunday, 11 May 2025, 13:21:56 (1746969716)
Author identity: nana-4 <hnmaigo@gmail.com>
c9cf8513b183f19e4709123ea82066c345b9b44b
gtk-3.0/_common.scss
@@ -965,7 +965,7 @@ headerbar {
color: $selected_fg_color;
&:backdrop {
// background-color: $headerbar_color;
color: $secondary_selected_fg_color;
}
.title {
@@ -986,30 +986,30 @@ headerbar {
@extend %button_basic.flat;
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
$selected_fg_color 0%,
currentColor 0%,
transparent 0%)
0 0 0 / 0 0 0px;
color: $secondary_selected_fg_color;
color: gtkalpha(currentColor, $enabled_opacity);
&:hover, &:active, &:checked { color: $selected_fg_color; }
&:hover, &:active { color: currentColor; }
&:disabled {
color: $insensitive_secondary_selected_fg_color;
color: gtkalpha(currentColor, $enabled_opacity * $disabled_opacity);
> label { color: inherit; }
}
&:checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
$selected_fg_color 100%,
currentColor 100%,
transparent 0%)
0 0 2 / 0 0 2px;
background-color: transparent;
color: $selected_fg_color;
color: currentColor;
&:disabled {
background-color: transparent;
color: $insensitive_selected_fg_color;
color: gtkalpha(currentColor, $disabled_opacity);
> label { color: inherit; }
}
@@ -1018,7 +1018,7 @@ headerbar {
button.suggested-action, button.destructive-action {
&:disabled {
color: $insensitive_secondary_selected_fg_color;
color: gtkalpha(currentColor, $disabled_opacity);
> label { color: inherit; }
}
@@ -1031,34 +1031,35 @@ headerbar {
color: $selected_fg_color;
&:backdrop {
color: $secondary_selected_fg_color;
}
.subtitle:link { @extend *:link:selected; }
button:not(.suggested-action):not(.destructive-action) {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
$selected_fg_color 0%,
currentColor 0%,
transparent 0%)
0 0 0 / 0 0 0px;
// color: $secondary_selected_fg_color;
// color: gtkalpha(currentColor, $enabled_opacity);
&, &:hover, &:active, &:checked { color: $selected_fg_color; }
&, &:hover, &:active { color: currentColor; }
&:disabled {
color: $insensitive_selected_fg_color;
color: gtkalpha(currentColor, $disabled_opacity);
> label { color: inherit; }
}
&:checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px),
$selected_fg_color 100%,
currentColor 100%,
transparent 0%)
0 0 2 / 0 0 2px;
color: $selected_fg_color;
color: currentColor;
&:disabled {
color: $insensitive_selected_fg_color;
color: gtkalpha(currentColor, $disabled_opacity);
> label { color: inherit; }
}
gtk-3.0/gtk-dark.css
@@ -966,6 +966,9 @@ headerbar {
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
background-color: #37474F;
color: #FFFFFF; }
.titlebar:backdrop:not(headerbar),
headerbar:backdrop {
color: rgba(255, 255, 255, 0.75); }
.titlebar:not(headerbar) .title,
headerbar .title {
padding-left: 12px;
@@ -978,35 +981,34 @@ headerbar {
font-size: smaller; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
headerbar button:not(.suggested-action):not(.destructive-action) {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 0%, transparent 0%) 0 0 0/0 0 0px;
color: rgba(255, 255, 255, 0.75); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
color: alpha(currentColor, 0.75); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
headerbar button:not(.suggested-action):not(.destructive-action):hover,
headerbar button:not(.suggested-action):not(.destructive-action):active,
headerbar button:not(.suggested-action):not(.destructive-action):checked {
color: #FFFFFF; }
headerbar button:not(.suggested-action):not(.destructive-action):active {
color: currentColor; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
headerbar button:not(.suggested-action):not(.destructive-action):disabled {
color: rgba(255, 255, 255, 0.3); }
color: alpha(currentColor, 0.3); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
headerbar button:not(.suggested-action):not(.destructive-action):disabled > label {
color: inherit; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
headerbar button:not(.suggested-action):not(.destructive-action):checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 100%, transparent 0%) 0 0 2/0 0 2px;
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
background-color: transparent;
color: #FFFFFF; }
color: currentColor; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
background-color: transparent;
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
color: inherit; }
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
headerbar button.suggested-action:disabled,
headerbar button.destructive-action:disabled {
color: rgba(255, 255, 255, 0.3); }
color: alpha(currentColor, 0.4); }
.titlebar:not(headerbar) button.suggested-action:disabled > label, .titlebar:not(headerbar) button.destructive-action:disabled > label,
headerbar button.suggested-action:disabled > label,
headerbar button.destructive-action:disabled > label {
@@ -1015,28 +1017,30 @@ headerbar {
headerbar.selection-mode {
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
color: #FFFFFF; }
.selection-mode.titlebar:backdrop:not(headerbar),
headerbar.selection-mode:backdrop {
color: rgba(255, 255, 255, 0.75); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 0%, transparent 0%) 0 0 0/0 0 0px; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action),
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):hover,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
color: #FFFFFF; }
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active {
color: currentColor; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled > label {
color: inherit; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 100%, transparent 0%) 0 0 2/0 0 2px;
color: #FFFFFF; }
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
color: currentColor; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
color: inherit; }
gtk-3.0/gtk.css
@@ -966,6 +966,9 @@ headerbar {
box-shadow: inset 0 1px rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
background-color: #455A64;
color: #FFFFFF; }
.titlebar:backdrop:not(headerbar),
headerbar:backdrop {
color: rgba(255, 255, 255, 0.75); }
.titlebar:not(headerbar) .title,
headerbar .title {
padding-left: 12px;
@@ -978,35 +981,34 @@ headerbar {
font-size: smaller; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
headerbar button:not(.suggested-action):not(.destructive-action) {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 0%, transparent 0%) 0 0 0/0 0 0px;
color: rgba(255, 255, 255, 0.75); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px;
color: alpha(currentColor, 0.75); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
headerbar button:not(.suggested-action):not(.destructive-action):hover,
headerbar button:not(.suggested-action):not(.destructive-action):active,
headerbar button:not(.suggested-action):not(.destructive-action):checked {
color: #FFFFFF; }
headerbar button:not(.suggested-action):not(.destructive-action):active {
color: currentColor; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
headerbar button:not(.suggested-action):not(.destructive-action):disabled {
color: rgba(255, 255, 255, 0.3); }
color: alpha(currentColor, 0.3); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
headerbar button:not(.suggested-action):not(.destructive-action):disabled > label {
color: inherit; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
headerbar button:not(.suggested-action):not(.destructive-action):checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 100%, transparent 0%) 0 0 2/0 0 2px;
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
background-color: transparent;
color: #FFFFFF; }
color: currentColor; }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled {
background-color: transparent;
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
headerbar button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
color: inherit; }
.titlebar:not(headerbar) button.suggested-action:disabled, .titlebar:not(headerbar) button.destructive-action:disabled,
headerbar button.suggested-action:disabled,
headerbar button.destructive-action:disabled {
color: rgba(255, 255, 255, 0.3); }
color: alpha(currentColor, 0.4); }
.titlebar:not(headerbar) button.suggested-action:disabled > label, .titlebar:not(headerbar) button.destructive-action:disabled > label,
headerbar button.suggested-action:disabled > label,
headerbar button.destructive-action:disabled > label {
@@ -1015,28 +1017,30 @@ headerbar {
headerbar.selection-mode {
animation: header_ripple_effect 0.3s cubic-bezier(0, 0, 0.2, 1) forwards;
color: #FFFFFF; }
.selection-mode.titlebar:backdrop:not(headerbar),
headerbar.selection-mode:backdrop {
color: rgba(255, 255, 255, 0.75); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action),
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action) {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 0%, transparent 0%) 0 0 0/0 0 0px; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 0%, transparent 0%) 0 0 0/0 0 0px; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action), .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):hover, .selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):active,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action),
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):hover,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
color: #FFFFFF; }
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):active {
color: currentColor; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled {
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):disabled > label,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):disabled > label {
color: inherit; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked {
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), #FFFFFF 100%, transparent 0%) 0 0 2/0 0 2px;
color: #FFFFFF; }
border-image: radial-gradient(circle closest-corner at center calc(100% - 1px), currentColor 100%, transparent 0%) 0 0 2/0 0 2px;
color: currentColor; }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled {
color: rgba(255, 255, 255, 0.4); }
color: alpha(currentColor, 0.4); }
.selection-mode.titlebar:not(headerbar) button:not(.suggested-action):not(.destructive-action):checked:disabled > label,
headerbar.selection-mode button:not(.suggested-action):not(.destructive-action):checked:disabled > label {
color: inherit; }