mirror of
https://github.com/zen-browser/desktop.git
synced 2025-10-19 16:21:59 +00:00
Refactor CSS styles for improved layout and transitions; adjust sidebar and tab margins for better visual consistency
This commit is contained in:
@@ -100,12 +100,11 @@
|
||||
}
|
||||
|
||||
#navigator-toolbox:not([animate='true']) #titlebar {
|
||||
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.1);
|
||||
box-shadow: 0 0 9.73px 0px rgba(0, 0, 0, 0.25);
|
||||
border-radius: calc(var(--zen-border-radius) - 2px);
|
||||
padding: var(--zen-toolbox-padding) !important;
|
||||
position: relative;
|
||||
background: var(--zen-dialog-background);
|
||||
outline: 1px solid light-dark(rgba(0, 0, 0, 0.1), rgba(255, 255, 255, 0.1));
|
||||
|
||||
:root[zen-single-toolbar='true'] {
|
||||
padding-top: 0 !important;
|
||||
@@ -133,106 +132,106 @@
|
||||
&:not([animate='true']) {
|
||||
--zen-compact-mode-func: linear(
|
||||
0 0%,
|
||||
0.002958 1%,
|
||||
0.01137 2%,
|
||||
0.024581 3%,
|
||||
0.041981 4%,
|
||||
0.063001 5%,
|
||||
0.087118 6%,
|
||||
0.113846 7.000000000000001%,
|
||||
0.14274 8%,
|
||||
0.173391 9%,
|
||||
0.205425 10%,
|
||||
0.238504 11%,
|
||||
0.272318 12%,
|
||||
0.30659 13%,
|
||||
0.341071 14.000000000000002%,
|
||||
0.375535 15%,
|
||||
0.409787 16%,
|
||||
0.44365 17%,
|
||||
0.476971 18%,
|
||||
0.509618 19%,
|
||||
0.541476 20%,
|
||||
0.572448 21%,
|
||||
0.602453 22%,
|
||||
0.631425 23%,
|
||||
0.65931 24%,
|
||||
0.686067 25%,
|
||||
0.711668 26%,
|
||||
0.736092 27%,
|
||||
0.759328 28.000000000000004%,
|
||||
0.781375 28.999999999999996%,
|
||||
0.802235 30%,
|
||||
0.821921 31%,
|
||||
0.840449 32%,
|
||||
0.857841 33%,
|
||||
0.874121 34%,
|
||||
0.88932 35%,
|
||||
0.903469 36%,
|
||||
0.916603 37%,
|
||||
0.928759 38%,
|
||||
0.939975 39%,
|
||||
0.950291 40%,
|
||||
0.959747 41%,
|
||||
0.968385 42%,
|
||||
0.976244 43%,
|
||||
0.983366 44%,
|
||||
0.989792 45%,
|
||||
0.995562 46%,
|
||||
1.000716 47%,
|
||||
1.005292 48%,
|
||||
1.009328 49%,
|
||||
1.01286 50%,
|
||||
1.015925 51%,
|
||||
1.018556 52%,
|
||||
1.020787 53%,
|
||||
1.022648 54%,
|
||||
1.024172 55.00000000000001%,
|
||||
1.025385 56.00000000000001%,
|
||||
1.026316 56.99999999999999%,
|
||||
1.026991 57.99999999999999%,
|
||||
1.027434 59%,
|
||||
1.027669 60%,
|
||||
1.027717 61%,
|
||||
1.027599 62%,
|
||||
1.027334 63%,
|
||||
1.02694 64%,
|
||||
1.026433 65%,
|
||||
1.025829 66%,
|
||||
1.025143 67%,
|
||||
1.024388 68%,
|
||||
1.023575 69%,
|
||||
1.022715 70%,
|
||||
1.02182 71%,
|
||||
1.020898 72%,
|
||||
1.019957 73%,
|
||||
1.019005 74%,
|
||||
1.018048 75%,
|
||||
1.017094 76%,
|
||||
1.016146 77%,
|
||||
1.015211 78%,
|
||||
1.014291 79%,
|
||||
1.013391 80%,
|
||||
1.012513 81%,
|
||||
1.01166 82%,
|
||||
1.010835 83%,
|
||||
1.010039 84%,
|
||||
1.009273 85%,
|
||||
1.008538 86%,
|
||||
1.007836 87%,
|
||||
1.007166 88%,
|
||||
1.00653 89%,
|
||||
1.005926 90%,
|
||||
1.005355 91%,
|
||||
1.004817 92%,
|
||||
1.00431 93%,
|
||||
1.003835 94%,
|
||||
1.003391 95%,
|
||||
1.002976 96%,
|
||||
1.002591 97%,
|
||||
1.002233 98%,
|
||||
1.001902 99%,
|
||||
1.001597 100%
|
||||
0.002748 1%,
|
||||
0.010544 2%,
|
||||
0.022757 3%,
|
||||
0.038804 4%,
|
||||
0.058151 5%,
|
||||
0.080308 6%,
|
||||
0.104828 7.000000000000001%,
|
||||
0.131301 8%,
|
||||
0.159358 9%,
|
||||
0.188662 10%,
|
||||
0.21891 11%,
|
||||
0.249828 12%,
|
||||
0.281172 13%,
|
||||
0.312724 14.000000000000002%,
|
||||
0.344288 15%,
|
||||
0.375693 16%,
|
||||
0.40679 17%,
|
||||
0.437447 18%,
|
||||
0.467549 19%,
|
||||
0.497 20%,
|
||||
0.525718 21%,
|
||||
0.553633 22%,
|
||||
0.580688 23%,
|
||||
0.60684 24%,
|
||||
0.632052 25%,
|
||||
0.656298 26%,
|
||||
0.679562 27%,
|
||||
0.701831 28.000000000000004%,
|
||||
0.723104 28.999999999999996%,
|
||||
0.743381 30%,
|
||||
0.76267 31%,
|
||||
0.780983 32%,
|
||||
0.798335 33%,
|
||||
0.814744 34%,
|
||||
0.830233 35%,
|
||||
0.844826 36%,
|
||||
0.858549 37%,
|
||||
0.87143 38%,
|
||||
0.883498 39%,
|
||||
0.894782 40%,
|
||||
0.905314 41%,
|
||||
0.915125 42%,
|
||||
0.924247 43%,
|
||||
0.93271 44%,
|
||||
0.940547 45%,
|
||||
0.947787 46%,
|
||||
0.954463 47%,
|
||||
0.960603 48%,
|
||||
0.966239 49%,
|
||||
0.971397 50%,
|
||||
0.976106 51%,
|
||||
0.980394 52%,
|
||||
0.984286 53%,
|
||||
0.987808 54%,
|
||||
0.990984 55.00000000000001%,
|
||||
0.993837 56.00000000000001%,
|
||||
0.99639 56.99999999999999%,
|
||||
0.998664 57.99999999999999%,
|
||||
1.000679 59%,
|
||||
1.002456 60%,
|
||||
1.004011 61%,
|
||||
1.005363 62%,
|
||||
1.006528 63%,
|
||||
1.007522 64%,
|
||||
1.008359 65%,
|
||||
1.009054 66%,
|
||||
1.009618 67%,
|
||||
1.010065 68%,
|
||||
1.010405 69%,
|
||||
1.010649 70%,
|
||||
1.010808 71%,
|
||||
1.01089 72%,
|
||||
1.010904 73%,
|
||||
1.010857 74%,
|
||||
1.010757 75%,
|
||||
1.010611 76%,
|
||||
1.010425 77%,
|
||||
1.010205 78%,
|
||||
1.009955 79%,
|
||||
1.009681 80%,
|
||||
1.009387 81%,
|
||||
1.009077 82%,
|
||||
1.008754 83%,
|
||||
1.008422 84%,
|
||||
1.008083 85%,
|
||||
1.00774 86%,
|
||||
1.007396 87%,
|
||||
1.007052 88%,
|
||||
1.00671 89%,
|
||||
1.006372 90%,
|
||||
1.00604 91%,
|
||||
1.005713 92%,
|
||||
1.005394 93%,
|
||||
1.005083 94%,
|
||||
1.004782 95%,
|
||||
1.004489 96%,
|
||||
1.004207 97%,
|
||||
1.003935 98%,
|
||||
1.003674 99%,
|
||||
1.003423 100%
|
||||
);
|
||||
transition:
|
||||
left 0.3125s var(--zen-compact-mode-func),
|
||||
|
@@ -9,7 +9,7 @@
|
||||
#tabbrowser-tabpanels[zen-split-view='true'] {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-top: calc(var(--zen-split-column-gap) / -2);
|
||||
margin-top: calc(var(--zen-split-column-gap) * -1);
|
||||
}
|
||||
|
||||
#tabbrowser-tabpanels[zen-split-view='true'] > *:not([zen-split='true']) {
|
||||
@@ -67,15 +67,9 @@
|
||||
#zen-splitview-overlay {
|
||||
@media (-moz-bool-pref: 'zen.view.compact') {
|
||||
:root:not([customizing]) & {
|
||||
@media (-moz-bool-pref: 'zen.view.compact.hide-tabbar') {
|
||||
& {
|
||||
margin-left: 1px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (-moz-bool-pref: 'zen.view.compact.hide-toolbar') {
|
||||
& {
|
||||
margin-top: calc(var(--zen-split-column-gap) / -2);
|
||||
margin-top: calc(var(--zen-split-column-gap) * -1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -101,7 +101,8 @@
|
||||
}
|
||||
|
||||
.zen-sidebar-web-panel-splitter,
|
||||
.zen-split-view-splitter[orient='vertical'] {
|
||||
.zen-split-view-splitter[orient='vertical'],
|
||||
#zen-sidebar-splitter {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@@ -119,9 +120,9 @@
|
||||
}
|
||||
|
||||
&::before {
|
||||
height: 30px;
|
||||
width: 3px;
|
||||
background: var(--zen-colors-border);
|
||||
height: 50px;
|
||||
width: 4px;
|
||||
background: var(--zen-colors-primary);
|
||||
border-radius: 2px;
|
||||
content: '';
|
||||
position: absolute;
|
||||
|
@@ -696,10 +696,6 @@
|
||||
transition: opacity 0.2s ease-in-out;
|
||||
background: var(--zen-colors-border);
|
||||
appearance: none;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Mark: Move sidebar to the right */
|
||||
|
Reference in New Issue
Block a user