mirror of
https://github.com/zen-browser/theme-store.git
synced 2025-07-07 08:55:31 +02:00
AIE: Add new mode, audio wave
Adds new mode of audio indicator, audio wave, which show some placeholder animation indicating audio playing. Also show muted tab by flat wave
This commit is contained in:
Kaedriz
parent
6c78fae0d3
commit
3afe0b007c
6 changed files with 735 additions and 40 deletions
333
themes/2317fd93-c3ed-4f37-b55a-304c1816819e/AudioWave1.svg
Normal file
333
themes/2317fd93-c3ed-4f37-b55a-304c1816819e/AudioWave1.svg
Normal file
|
|
@ -0,0 +1,333 @@
|
|||
<?xml version='1.0' encoding='utf-8'?>
|
||||
<svg width='1000' height='120' viewBox='0 0 1000 120' preserveAspectRatio="none" fill='none' xmlns='http://www.w3.org/2000/svg'>
|
||||
<rect width='1000' height='120' />
|
||||
<g class="g" transform="translate(20 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.95;1 0.8;1 0.52;1 0.78;1 0.95;1 1.04;1 1.04;1 1.17;1 0.94;1 0.8;1 0.73;1 0.7;1 0.9;1 0.95"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(45 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.1;1 1.05;1 1.2;1 0.82;1 1.13;1 1.3;1 1.31;1 1.14;1 1.07;1 1.1;1 1.1" dur="7.5s"
|
||||
repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(70 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.12;1 1.33;1 1.22;1 1.07;1 1.07;1 1.00;1 1.37;1 1.32;1 1.37;1 1.27;1 1.19;1 1.28;1 1.18;1 1.16;1 1.04;1 1.13;1 1.31;1 1.06;1 1.12"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(95 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.38;1 1.23;1 1.11;1 1.40;1 1.21;1 1.45;1 1.36;1 1.30;1 1.35;1 1.24;1 1.38;1 1.16;1 1.41;1 1.43;1 1.14;1 1.15;1 1.20;1 1.42;1 1.38"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(120 130) rotate(180)">
|
||||
<rect class="test fill1" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.86;1 1.09;1 1.07;1 0.86;1 1.00;1 0.89;1 0.95;1 0.91;1 1.18;1 1.06;1 1.14;1 1.08;1 0.82;1 1.10;1 0.96;1 0.87;1 1.04;1 1.15;1 0.86"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(145 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.04;1 0.83;1 1.18;1 1.19;1 1.09;1 1.12;1 1.10;1 1.01;1 0.83;1 0.83;1 1.15;1 0.82;1 1.05;1 0.90;1 1.10;1 1.20;1 0.92;1 0.96;1 1.04"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(170 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.88;1 1.07;1 0.91;1 1.12;1 1.07;1 1.15;1 1.13;1 1.14;1 0.99;1 1.14;1 0.99;1 1.15;1 0.89;1 0.97;1 1.18;1 1.10;1 0.81;1 1.10;1 0.88"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(195 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.92;1 1.09;1 1.07;1 1.07;1 0.84;1 1.16;1 1.04;1 1.06;1 0.99;1 1.19;1 1.04;1 0.93;1 0.96;1 0.84;1 1.01;1 1.08;1 1.11;1 0.83;1 0.92"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(220 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.92;1 1.11;1 0.98;1 1.10;1 1.03;1 0.92;1 1.18;1 0.85;1 1.06;1 0.89;1 1.06;1 0.98;1 0.86;1 1.17;1 0.87;1 1.11;1 0.97;1 1.14;1 0.92"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(245 130) rotate(180)">
|
||||
<rect class="test fill2" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.80;1 1.01;1 1.01;1 0.95;1 0.96;1 0.73;1 0.95;1 0.88;1 0.81;1 0.79;1 0.99;1 1.04;1 0.84;1 0.94;1 0.92;1 1.03;1 0.90;1 1.07;1 0.8"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(270 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.87;1 0.81;1 0.92;1 0.78;1 1.08;1 0.79;1 1.00;1 0.93;1 0.98;1 1.04;1 0.88;1 1.05;1 1.09;1 1.03;1 1.00;1 0.99;1 1.08;1 1.09;1 0.87"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(295 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.93;1 0.80;1 0.73;1 0.90;1 0.99;1 0.77;1 0.79;1 0.62;1 0.69;1 0.78;1 0.70;1 0.68;1 0.70;1 0.83;1 0.82;1 0.78;1 0.88;1 0.66;1 0.93"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(320 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.78;1 0.82;1 0.65;1 0.65;1 0.87;1 0.88;1 0.64;1 0.97;1 0.94;1 0.91;1 0.77;1 0.99;1 0.71;1 0.88;1 0.87;1 0.77;1 0.91;1 0.82;1 0.78"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(345 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.93;1 0.99;1 0.62;1 0.75;1 0.62;1 0.70;1 0.99;1 0.91;1 0.99;1 0.74;1 1.00;1 0.81;1 0.82;1 0.62;1 0.97;1 0.95;1 0.93;1 0.80;1 0.93"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(370 130) rotate(180)">
|
||||
<rect class="test fill3" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.83;1 0.68;1 0.66;1 0.80;1 0.84;1 0.83;1 0.74;1 0.85;1 0.71;1 0.75;1 0.84;1 0.69;1 0.99;1 0.97;1 0.93;1 0.68;1 0.80;1 0.81;1 0.83"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(395 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.72;1 0.69;1 0.74;1 0.80;1 0.72;1 0.66;1 0.99;1 0.66;1 0.86;1 0.69;1 0.70;1 0.95;1 0.71;1 0.64;1 0.65;1 0.87;1 0.70;1 0.93;1 0.72"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(420 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.57;1 0.84;1 0.67;1 0.83;1 0.60;1 0.70;1 0.81;1 0.65;1 0.65;1 0.90;1 0.71;1 0.70;1 0.54;1 0.57;1 0.73;1 0.67;1 0.73;1 0.66;1 0.57"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(445 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.98;1 0.86;1 0.94;1 1.18;1 1.06;1 0.95;1 1.10;1 1.00;1 0.85;1 1.15;1 0.97;1 0.81;1 0.84;1 1.13;1 0.94;1 1.01;1 1.12;1 0.93;1 0.98"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(470 130) rotate(180)">
|
||||
<rect class="test fill" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.92;1 1.20;1 1.02;1 1.08;1 0.93;1 0.92;1 1.25;1 1.27;1 1.17;1 1.19;1 0.94;1 1.24;1 0.92;1 1.15;1 1.26;1 1.20;1 0.98;1 1.23;1 0.92"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(495 130) rotate(180)">
|
||||
<rect class="test fill4" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.33;1 1.23;1 1.11;1 1.31;1 1.48;1 1.31;1 1.12;1 1.40;1 1.30;1 1.30;1 1.18;1 1.20;1 1.41;1 1.45;1 1.35;1 1.12;1 1.17;1 1.20;1 1.33"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(520 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.17;1 0.96;1 1.19;1 0.82;1 1.08;1 1.05;1 0.93;1 0.95;1 1.15;1 0.95;1 0.85;1 0.85;1 1.16;1 1.15;1 0.94;1 1.04;1 1.02;1 0.99;1 1.17"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(545 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 1.12;1 0.89;1 1.14;1 0.95;1 1.08;1 1.07;1 1.00;1 1.04;1 0.81;1 1.12;1 0.92;1 0.89;1 0.98;1 0.81;1 0.97;1 0.96;1 1.02;1 0.87;1 1.12"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(570 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.99;1 0.82;1 1.01;1 1.11;1 0.96;1 1.06;1 1.07;1 0.84;1 0.91;1 0.85;1 1.01;1 0.99;1 1.03;1 0.81;1 1.19;1 0.94;1 0.83;1 1.01;1 0.99"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(595 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.98;1 0.84;1 0.81;1 0.82;1 1.04;1 0.74;1 0.81;1 0.79;1 1.04;1 0.85;1 0.73;1 1.05;1 0.91;1 0.80;1 0.77;1 0.98;1 0.82;1 0.98;1 0.98"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(620 130) rotate(180)">
|
||||
<rect class="test fill5" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.77;1 0.83;1 1.03;1 0.76;1 0.71;1 0.95;1 0.80;1 1.00;1 0.81;1 0.75;1 0.96;1 0.96;1 0.84;1 1.02;1 1.09;1 0.71;1 1.06;1 0.85;1 0.77"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(645 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.78;1 0.91;1 0.75;1 0.79;1 0.80;1 0.66;1 0.81;1 0.72;1 0.83;1 0.63;1 0.63;1 0.71;1 0.86;1 0.86;1 0.79;1 0.86;1 0.67;1 0.93;1 0.78"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(670 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.90;1 0.84;1 0.54;1 0.82;1 0.76;1 0.76;1 0.80;1 0.69;1 0.57;1 0.57;1 0.61;1 0.76;1 0.84;1 0.72;1 0.85;1 0.82;1 0.70;1 0.74;1 0.9"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(695 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.8;1 0.74;1 0.85;1 0.86;1 0.73;1 0.64;1 0.81;1 0.57;1 0.50;1 0.85;1 0.88;1 0.88;1 0.69;1 0.89;1 0.67;1 0.60;1 0.75;1 0.84;1 0.8"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(720 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.51;1 0.87;1 0.68;1 0.81;1 0.81;1 0.58;1 0.54;1 0.75;1 0.81;1 0.56;1 0.76;1 0.78;1 0.71;1 0.72;1 0.54;1 0.88;1 0.68;1 0.87;1 0.51"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(745 130) rotate(180)">
|
||||
<rect class="test fill6" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.31;1 0.50;1 0.47;1 0.67;1 0.42;1 0.40;1 0.47;1 0.53;1 0.36;1 0.66;1 0.50;1 0.54;1 0.49;1 0.47;1 0.30;1 0.40;1 0.49;1 0.50;1 0.31"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(770 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.5;1 0.43;1 0.39;1 0.54;1 0.65;1 0.56;1 0.32;1 0.48;1 0.36;1 0.45;1 0.32;1 0.59;1 0.59;1 0.38;1 0.59;1 0.31;1 0.51;1 0.40;1 0.5"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(795 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.55;1 0.69;1 0.46;1 0.62;1 0.54;1 0.57;1 0.48;1 0.44;1 0.57;1 0.45;1 0.44;1 0.33;1 0.56;1 0.31;1 0.54;1 0.39;1 0.55;1 0.61;1 0.55"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(820 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.38;1 0.67;1 0.66;1 0.41;1 0.52;1 0.55;1 0.43;1 0.49;1 0.55;1 0.59;1 0.41;1 0.64;1 0.58;1 0.59;1 0.62;1 0.35;1 0.67;1 0.38;1 0.38"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(845 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.49;1 0.57;1 0.70;1 0.56;1 0.52;1 0.43;1 0.55;1 0.71;1 0.55;1 0.77;1 0.58;1 0.51;1 0.43;1 0.61;1 0.40;1 0.64;1 0.53;1 0.50;1 0.49"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(870 130) rotate(180)">
|
||||
<rect class="test fill7" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.62;1 0.58;1 0.40;1 0.64;1 0.44;1 0.45;1 0.66;1 0.76;1 0.76;1 0.69;1 0.74;1 0.47;1 0.54;1 0.55;1 0.66;1 0.60;1 0.58;1 0.55;1 0.62"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(895 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.75;1 0.44;1 0.74;1 0.78;1 0.71;1 0.48;1 0.75;1 0.47;1 0.78;1 0.73;1 0.70;1 0.79;1 0.65;1 0.55;1 0.41;1 0.48;1 0.41;1 0.68;1 0.75"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(920 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.58;1 0.79;1 0.61;1 0.60;1 0.63;1 0.42;1 0.71;1 0.51;1 0.44;1 0.63;1 0.76;1 0.76;1 0.58;1 0.74;1 0.42;1 0.45;1 0.51;1 0.46;1 0.58"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(945 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.64;1 0.82;1 0.75;1 0.83;1 0.89;1 0.61;1 0.60;1 0.84;1 0.62;1 0.54;1 0.72;1 0.52;1 0.60;1 0.65;1 0.52;1 0.87;1 0.75;1 0.66;1 0.64"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(970 130) rotate(180)">
|
||||
<rect class="test" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.71;1 0.57;1 0.80;1 0.76;1 0.71;1 0.62;1 0.51;1 0.52;1 0.67;1 0.62;1 0.73;1 0.69;1 0.67;1 0.81;1 0.55;1 0.70;1 0.55;1 0.88;1 0.71"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(995 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale"
|
||||
values="1 0.57;1 0.71;1 0.67;1 0.77;1 0.76;1 0.69;1 0.88;1 0.55;1 0.83;1 0.63;1 0.59;1 0.73;1 0.63;1 0.53;1 0.81;1 0.82;1 0.53;1 0.67;1 0.57"
|
||||
dur="7.5s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<style>
|
||||
.test {
|
||||
fill: context-fill;
|
||||
/* animation: fillAnimation 5s infinite; */
|
||||
|
||||
}
|
||||
|
||||
@keyframes fillAnimation {
|
||||
0% {
|
||||
fill: yellow;
|
||||
}
|
||||
|
||||
100% {
|
||||
fill: red;
|
||||
}
|
||||
}
|
||||
|
||||
/* .fill1 {
|
||||
fill: yellow;
|
||||
}
|
||||
|
||||
.fill2 {
|
||||
fill: aqua;
|
||||
}
|
||||
|
||||
.fill3 {
|
||||
fill: chartreuse;
|
||||
}
|
||||
|
||||
.fill4 {
|
||||
fill: coral;
|
||||
}
|
||||
|
||||
.fill5 {
|
||||
fill: darkviolet;
|
||||
}
|
||||
|
||||
.fill6 {
|
||||
fill: red;
|
||||
}
|
||||
|
||||
.fill7 {
|
||||
fill: seagreen;
|
||||
}
|
||||
|
||||
.fill8 {
|
||||
fill: lightpink;
|
||||
} */
|
||||
</style>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 16 KiB |
209
themes/2317fd93-c3ed-4f37-b55a-304c1816819e/AudioWave_Muted.svg
Normal file
209
themes/2317fd93-c3ed-4f37-b55a-304c1816819e/AudioWave_Muted.svg
Normal file
|
|
@ -0,0 +1,209 @@
|
|||
<?xml version='1.0' encoding='utf-8'?>
|
||||
<svg width='1000' height='120' viewBox='0 0 1000 120' fill='none' xmlns='http://www.w3.org/2000/svg'>
|
||||
<rect width='1000' height='120' />
|
||||
<g class="g" transform="translate(20 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(45 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(70 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(95 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(120 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(145 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(170 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(195 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(220 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(245 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(270 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(295 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(320 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(345 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(370 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(395 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(420 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(445 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(470 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(495 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(520 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(545 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(570 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(595 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(620 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(645 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(670 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(695 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(720 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(745 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(770 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(795 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(820 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(845 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(870 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(895 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(920 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(945 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(970 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<g class="g" transform="translate(995 130) rotate(180)">
|
||||
<rect class="test fill8" width="20" height="60" rx="5">
|
||||
<animateTransform attributeName="transform" type="scale" values="1 0.85" dur="1s" repeatCount="indefinite" />
|
||||
</rect>
|
||||
</g>
|
||||
<style>
|
||||
.test {
|
||||
fill: context-fill;
|
||||
}
|
||||
</style>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 10 KiB |
|
|
@ -1,43 +1,196 @@
|
|||
#tabbrowser-tabs[orient="vertical"]
|
||||
.tabbrowser-tab
|
||||
.tab-icon-overlay:not([crashed]) {
|
||||
&:is([soundplaying], [muted], [activemedia-blocked]) {
|
||||
background-color: #161717 !important;
|
||||
border: 1px solid #ffffff29 !important;
|
||||
transition:
|
||||
transform 100ms ease-in-out,
|
||||
background-color 100ms ease-in-out;
|
||||
@media not (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.audioWave.enabled') {
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab
|
||||
.tab-icon-overlay:not([crashed]) {
|
||||
&:is([soundplaying], [muted], [activemedia-blocked]) {
|
||||
background-color: #161717 !important;
|
||||
border: 1px solid #ffffff29 !important;
|
||||
transition: transform 100ms ease-in-out,
|
||||
background-color 100ms ease-in-out;
|
||||
|
||||
&:hover {
|
||||
transition:
|
||||
transform 100ms ease-in-out,
|
||||
background-color 100ms ease-in-out !important;
|
||||
transform: scale(1.3) translate(-8%, 14%);
|
||||
transform-origin: center !important;
|
||||
}
|
||||
}
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.hoverScaleAnimationEnabled') {
|
||||
&:hover {
|
||||
transition: transform 100ms ease-in-out,
|
||||
background-color 100ms ease-in-out !important;
|
||||
transform: scale(1.3) translate(-8%, 14%);
|
||||
transform-origin: center !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&[muted] {
|
||||
/* Different background color when muted */
|
||||
background-color: rgb(122, 31, 31) !important;
|
||||
&[muted] {
|
||||
/* Different background color when muted */
|
||||
background-color: rgb(122, 31, 31) !important;
|
||||
|
||||
/* Revert old icon */
|
||||
background-image: url("chrome://browser/skin/tabbrowser/tab-audio-muted-small.svg") !important;
|
||||
}
|
||||
/* Revert old icon */
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.returnOldIcons') {
|
||||
background-image: url('chrome://browser/skin/tabbrowser/tab-audio-muted-small.svg') !important;
|
||||
}
|
||||
}
|
||||
|
||||
&[soundplaying] {
|
||||
/* Revert old icon */
|
||||
background-image: url("chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg") !important;
|
||||
}
|
||||
&[soundplaying] {
|
||||
/* Revert old icon */
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.returnOldIcons') {
|
||||
background-image: url('chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg') !important;
|
||||
}
|
||||
}
|
||||
|
||||
&[activemedia-blocked] {
|
||||
/* Revert old icon */
|
||||
background-image: url("chrome://browser/skin/tabbrowser/tab-audio-blocked-small.svg") !important;
|
||||
}
|
||||
&[activemedia-blocked] {
|
||||
/* Revert old icon */
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.returnOldIcons') {
|
||||
background-image: url('chrome://browser/skin/tabbrowser/tab-audio-blocked-small.svg') !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Revert new, zen's audio indicator */
|
||||
&[muted],
|
||||
&[soundplaying] {
|
||||
list-style-image: none !important;
|
||||
}
|
||||
/* Revert new, zen's audio indicator */
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.returnOldIcons') {
|
||||
&[muted],
|
||||
&[soundplaying],
|
||||
&[activemedia-blocked] {
|
||||
list-style-image: none !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Standardize tab icon size, to prevent size flexing */
|
||||
#navigator-toolbox[zen-sidebar-expanded='true']
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab
|
||||
.tab-icon-stack {
|
||||
height: 16px;
|
||||
width: 28.5px;
|
||||
}
|
||||
|
||||
/** Audio Wave version */
|
||||
@media (-moz-bool-pref: 'zen.mods.AudioIndicatorEnhanced.audioWave.enabled') {
|
||||
#navigator-toolbox[zen-sidebar-expanded='true'] .tab-icon-stack {
|
||||
--audio-button-top: -4px;
|
||||
--audio-button-left: -4px;
|
||||
--audio-wave-top: 31px;
|
||||
}
|
||||
|
||||
/* Some styling formute/unmute audio button */
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab
|
||||
.tab-icon-overlay:not([crashed]) {
|
||||
top: var(--audio-button-top, 0px) !important;
|
||||
left: var(--audio-button-left, 0px) !important;
|
||||
width: 24px !important;
|
||||
height: 24px !important;
|
||||
|
||||
padding: 4px !important;
|
||||
border-radius: 6px !important;
|
||||
display: initial !important;
|
||||
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#navigator-toolbox:not([zen-sidebar-expanded='true'])
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab
|
||||
.tab-icon-image {
|
||||
justify-self: center;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
/* Tab Icon to mute playing audio */
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab[soundplaying]:hover
|
||||
.tab-icon-overlay:not([crashed]) {
|
||||
list-style-image: url('chrome://browser/skin/tabbrowser/tab-audio-muted-small.svg') !important;
|
||||
}
|
||||
|
||||
/* Tab Icon to unmute muted audio */
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab[muted]:hover
|
||||
.tab-icon-overlay:not([crashed]) {
|
||||
list-style-image: url('chrome://browser/skin/tabbrowser/tab-audio-playing-small.svg') !important;
|
||||
}
|
||||
|
||||
/* Show button to mute/unmute audio, on hover, in place of tab icon */
|
||||
#tabbrowser-tabs[orient='vertical']
|
||||
.tabbrowser-tab:has([soundplaying], [muted]):hover {
|
||||
& .tab-icon-overlay:not([crashed]) {
|
||||
display: flex !important;
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
|
||||
background-color: transparent !important;
|
||||
|
||||
&:hover {
|
||||
background-color: color-mix(
|
||||
in srgb,
|
||||
currentColor 10%,
|
||||
transparent
|
||||
) !important;
|
||||
}
|
||||
}
|
||||
|
||||
& .tab-icon-image {
|
||||
opacity: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code for audio wave */
|
||||
.tabbrowser-tab .tab-icon-stack::before {
|
||||
/* --transformOffset: calc(var(--zen-sidebar-width) / 18);
|
||||
transform: translate(-6px, var(--transformOffset)) scaleY(0.4) !important; */
|
||||
|
||||
content: '' !important;
|
||||
position: absolute !important;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: calc(var(--zen-sidebar-width) - 9px) !important;
|
||||
width: 492px !important;
|
||||
height: auto !important;
|
||||
aspect-ratio: 1000 / 120;
|
||||
position: absolute !important;
|
||||
z-index: -1 !important;
|
||||
transform: translate(-6px, var(--audio-wave-top, 27px)) scaleY(0.3) !important;
|
||||
border-radius: 15px !important;
|
||||
opacity: 0;
|
||||
|
||||
-moz-context-properties: fill, fill-opacity;
|
||||
background-size: 100% 100% !important;
|
||||
background-image: url('AudioWave1.svg') !important;
|
||||
|
||||
/* Clip audio wave to tab size */
|
||||
clip-path: xywh(0% 0% calc(var(--zen-sidebar-width) - 9px) 100% round 20px);
|
||||
|
||||
transition: fill 1000ms ease-in-out, opacity 1000ms ease-in-out;
|
||||
}
|
||||
|
||||
/* Compability patch for hidden tab bar */
|
||||
#zen-main-app-wrapper[zen-compact-mode='true']
|
||||
.tabbrowser-tab
|
||||
.tab-icon-stack::before {
|
||||
clip-path: xywh(0% 0% calc(var(--zen-sidebar-width) - 29px) 100% round 20px);
|
||||
}
|
||||
|
||||
/* Support for collapsed Tab Bar */
|
||||
.tabbrowser-tab .tab-icon-stack::before {
|
||||
/* color: red; */
|
||||
}
|
||||
|
||||
/* TODO: Attempt at different animation for subset of tabs, will need manual re-timing of each svg animation sadly */
|
||||
/* .tabbrowser-tab[soundplaying]:nth-of-type(1n) .tab-icon-stack::before {
|
||||
background-image: url('AudioWave1.svg') !important;
|
||||
}
|
||||
|
||||
.tabbrowser-tab[soundplaying]:nth-of-type(2n) .tab-icon-stack::before {
|
||||
background-image: url('AudioWave2.svg') !important;
|
||||
} */
|
||||
|
||||
.tabbrowser-tab[soundplaying] .tab-icon-stack::before {
|
||||
fill: -moz-dialogtext;
|
||||
opacity: 0.2;
|
||||
}
|
||||
|
||||
.tabbrowser-tab[muted] .tab-icon-stack::before {
|
||||
fill: color-mix(in srgb, -moz-dialogtext 50%, rgb(129, 0, 0) 50%);
|
||||
opacity: 0.2;
|
||||
background-image: url('AudioWave_Muted.svg') !important;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 3.7 MiB After Width: | Height: | Size: 3.7 MiB |
|
|
@ -1,6 +1,6 @@
|
|||
Enhanced audio indicator on tabs, visible when playing videos.
|
||||
Enhanced audio indicator on tabs, visible when playing videos & audios.
|
||||
|
||||
Currently, mod is tailored to dark theme.
|
||||
For now, mostly just styles it differently, later some customization and matching to color theme is planned.
|
||||
|
||||
Works as of `1.0.1-a.22`
|
||||
Works as of `1.7.4b`
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
{
|
||||
"id": "2317fd93-c3ed-4f37-b55a-304c1816819e",
|
||||
"name": "Audio Indicator Enhanced",
|
||||
"description": "Enhanced audio indicator, with more polished style",
|
||||
"description": "Enhanced audio indicator, with more polished style (New Visualizer Mode)",
|
||||
"homepage": "https://github.com/Kaedriz/ZenMods/tree/main/AudioIndicatorEnhanced",
|
||||
"style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/2317fd93-c3ed-4f37-b55a-304c1816819e/chrome.css",
|
||||
"readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/2317fd93-c3ed-4f37-b55a-304c1816819e/readme.md",
|
||||
"image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/2317fd93-c3ed-4f37-b55a-304c1816819e/image.png",
|
||||
"author": "Kaedriz",
|
||||
"version": "1.0.0",
|
||||
"version": "1.1.0",
|
||||
"tags": [],
|
||||
"createdAt": "2024-12-06",
|
||||
"updatedAt": "2025-01-26"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue