mirror of
https://github.com/zen-browser/theme-store.git
synced 2025-07-15 12:43:54 +02:00
150 lines
4.1 KiB
CSS
150 lines
4.1 KiB
CSS
.tab-background {
|
|
transition: background-color 0.4s ease, box-shadow 0.4s ease, background 0.5s ease !important;
|
|
}
|
|
|
|
.tab-group-label-container {
|
|
transition: background-color 0.4s ease, box-shadow 0.4s ease, background 0.5s ease !important;
|
|
}
|
|
|
|
|
|
.toolbarbutton-1 {
|
|
|
|
&:hover > :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out; /* Smooth transition */
|
|
}
|
|
|
|
> :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out;
|
|
}
|
|
}
|
|
|
|
.identity-box-button {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 1.3s ease-in-out;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Apply transition to urlbar controls, this is what I found worked...*/
|
|
#reader-mode-button,
|
|
#star-button-box,
|
|
#zen-split-views-box,
|
|
#pageActionButton,
|
|
#urlbar-zoom-button,
|
|
#shopping-sidebar-button,
|
|
#translations-button,
|
|
#picture-in-picture-button,
|
|
#page-action-buttons,
|
|
#urlbar-go-button,
|
|
#urlbar-revert-button-container {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Animate the tab function icons */
|
|
.close-icon {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}
|
|
|
|
|
|
|
|
.tab-reset-button {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}/* Transition properties for tab background */
|
|
.tab-background {
|
|
transition: background-color 0.4s ease, box-shadow 0.4s ease, background 0.5s ease !important;
|
|
}
|
|
|
|
.tab-group-label-container {
|
|
/* Transition properties for tab background */
|
|
transition: background-color 0.4s ease, box-shadow 0.4s ease, background 0.5s ease !important;
|
|
}
|
|
|
|
|
|
/* For toolbarbutton-1 */
|
|
.toolbarbutton-1 {
|
|
|
|
&:hover > :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out; /* Smooth transition */
|
|
}
|
|
|
|
> :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out;
|
|
}
|
|
}
|
|
|
|
.identity-box-button {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 1.3s ease-in-out;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Apply transition to urlbar controls, this is what I found worked...*/
|
|
#reader-mode-button,
|
|
#star-button-box,
|
|
#zen-split-views-box,
|
|
#pageActionButton,
|
|
#urlbar-zoom-button,
|
|
#shopping-sidebar-button,
|
|
#translations-button,
|
|
#picture-in-picture-button,
|
|
#page-action-buttons,
|
|
#urlbar-go-button,
|
|
#urlbar-revert-button-container {
|
|
transition: background-color 0.3s ease-in-out,
|
|
outline-color 0.3s ease-in-out !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* Animate the tab function icons */
|
|
.close-icon {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}
|
|
|
|
|
|
|
|
.tab-reset-button {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}
|
|
|
|
/* This was not being applied properly by class for some reason */
|
|
#tabs-newtab-button {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}
|
|
|
|
|
|
/* Other things that needed to be animated/transitioned */
|
|
.subviewbutton {
|
|
transition: background-color 0.3s ease-in-out !important; /* Smooth transition for background-color */
|
|
}
|
|
|
|
.urlbarView-row-inner {
|
|
transition: background-color 0.3s ease-in-out !important; /* Smooth transition for background-color */
|
|
}
|
|
|
|
/* This was not being applied properly by class for some reason */
|
|
#tabs-newtab-button {
|
|
transition: background-color 0.3s ease-in-out; /* Smooth transition for background-color */
|
|
}
|
|
|
|
|
|
/* Other things that needed to be animated/transitioned */
|
|
.subviewbutton {
|
|
transition: background-color 0.3s ease-in-out !important; /* Smooth transition for background-color */
|
|
}
|
|
|
|
.urlbarView-row-inner {
|
|
transition: background-color 0.3s ease-in-out !important; /* Smooth transition for background-color */
|
|
}
|