Dodanie grupy dla kanałow tematycznych. Porządki w theme.css
This commit is contained in:
dm
@@ -24,8 +24,10 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 24.99
|
||||
bezterminowo: 28.99
|
||||
|
||||
- id: canal_super_sport
|
||||
nazwa: CANAL+ Super Sport
|
||||
tid: 48
|
||||
typ: checkbox
|
||||
opis: Pakiet sportowy Canal+.
|
||||
cena:
|
||||
@@ -38,9 +40,10 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 64.99
|
||||
bezterminowo: 68.99
|
||||
tid: 48
|
||||
|
||||
- id: cinemax
|
||||
nazwa: Cinemax
|
||||
tid: 18
|
||||
typ: checkbox
|
||||
opis: Kanały Cinemax.
|
||||
cena:
|
||||
@@ -55,9 +58,9 @@ dodatki:
|
||||
- Optimum
|
||||
- Platinum
|
||||
bezterminowo: 14.9
|
||||
tid: 18
|
||||
- id: eleven
|
||||
nazwa: Eleven
|
||||
tid: 61
|
||||
typ: checkbox
|
||||
opis: Kanały Eleven Sports.
|
||||
cena:
|
||||
@@ -67,9 +70,10 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 15
|
||||
bezterminowo: 25
|
||||
tid: 61
|
||||
|
||||
- id: filmbox
|
||||
nazwa: FilmBox+
|
||||
tid: 19
|
||||
typ: checkbox
|
||||
opis: Kanały FilmBox.
|
||||
cena:
|
||||
@@ -79,10 +83,13 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 10
|
||||
bezterminowo: 15
|
||||
tid: 19
|
||||
|
||||
- id: hbo_max_podstawowy
|
||||
nazwa: HBO + Max Podstawowy
|
||||
tid: 20
|
||||
typ: checkbox
|
||||
group: hbo_max
|
||||
group_mode: single
|
||||
opis: |
|
||||
W ramach Pakietu Podstawowego HBO Max możesz oglądać filmy i seriale w jakości FullHD na dwóch urządzeniach jednocześnie.
|
||||
Pakiet Podstawowy HBO Max to również dostęp do bogatej Biblioteki TVN oraz możliwość śledzenia kanału live TVN.
|
||||
@@ -97,10 +104,13 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 27.99
|
||||
bezterminowo: 29.99
|
||||
tid: 20
|
||||
|
||||
- id: hbo_max_standardowy
|
||||
nazwa: HBO + Max Standardowy
|
||||
tid: 96
|
||||
typ: checkbox
|
||||
group: hbo_max
|
||||
group_mode: single
|
||||
opis: HBO + Max (wariant standardowy).
|
||||
cena:
|
||||
- pakiety:
|
||||
@@ -112,10 +122,13 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 36.99
|
||||
bezterminowo: 39.99
|
||||
tid: 96
|
||||
|
||||
- id: hbo_max_premium
|
||||
nazwa: HBO + Max Premium
|
||||
tid: 97
|
||||
typ: checkbox
|
||||
group: hbo_max
|
||||
group_mode: single
|
||||
opis: HBO + Max (wariant premium).
|
||||
cena:
|
||||
- pakiety:
|
||||
@@ -127,9 +140,10 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 44.99
|
||||
bezterminowo: 49.99
|
||||
tid: 97
|
||||
|
||||
- id: wiecej_sportu_plus
|
||||
nazwa: Więcej Sportu Plus
|
||||
tid: 79
|
||||
typ: checkbox
|
||||
opis: Dodatkowy pakiet sportowy.
|
||||
cena:
|
||||
@@ -139,9 +153,10 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 15
|
||||
bezterminowo: 25
|
||||
tid: 79
|
||||
|
||||
- id: wiecej_erotyki
|
||||
nazwa: Więcej Erotyki
|
||||
tid: 80
|
||||
typ: checkbox
|
||||
opis: Pakiet kanałów erotycznych.
|
||||
cena:
|
||||
@@ -151,10 +166,12 @@ dodatki:
|
||||
- Bogaty
|
||||
12m: 15
|
||||
bezterminowo: 25
|
||||
tid: 80
|
||||
- id: disney_standard
|
||||
|
||||
- id: _standard
|
||||
nazwa: Disney+ Standard
|
||||
typ: checkbox
|
||||
group: disney
|
||||
group_mode: single
|
||||
tid: 10001
|
||||
opis: |
|
||||
Historie na całe życie czekają. Odkryj hity filmowe, nowe seriale i produkcje oryginalne ze świata Disneya, Pixara, Gwiezdnych wojen, Marvela, a także produkcje Hulu, National Geographic i FX.
|
||||
@@ -178,9 +195,12 @@ dodatki:
|
||||
- Korzystny
|
||||
- Bogaty
|
||||
bezterminowo: 34.99
|
||||
|
||||
- id: disney_premium
|
||||
nazwa: Disney+ Premium
|
||||
typ: checkbox
|
||||
group: disney
|
||||
group_mode: single
|
||||
tid: 10002
|
||||
opis: |
|
||||
Historie na całe życie czekają. Odkryj hity filmowe, nowe seriale i produkcje oryginalne ze świata Disneya, Pixara, Gwiezdnych wojen, Marvela, a także produkcje Hulu, National Geographic i FX.
|
||||
|
||||
@@ -17,10 +17,8 @@ export default function InternetAddonsModal({
|
||||
isOpen,
|
||||
onClose,
|
||||
plan,
|
||||
|
||||
phoneCards = [],
|
||||
addons = [],
|
||||
|
||||
cenaOpis = "zł / mies.",
|
||||
}) {
|
||||
const phonePlans = useMemo(() => mapPhoneYamlToPlans(phoneCards), [phoneCards]);
|
||||
|
||||
@@ -8,7 +8,7 @@ function formatMoney(amount, currency = "PLN") {
|
||||
if (typeof amount !== "number" || Number.isNaN(amount)) return "";
|
||||
try {
|
||||
return new Intl.NumberFormat("pl-PL", {
|
||||
style: "currency",
|
||||
style: "",
|
||||
currency,
|
||||
maximumFractionDigits: 0,
|
||||
}).format(amount);
|
||||
|
||||
@@ -14,10 +14,26 @@ export default function TvAddonsSection({
|
||||
setTvTerm,
|
||||
tvAddonsPrice,
|
||||
}) {
|
||||
const toggleCheckboxAddon = (id) => {
|
||||
|
||||
const toggleCheckboxAddon = (addon) => {
|
||||
setSelectedQty((prev) => {
|
||||
const next = { ...prev };
|
||||
next[id] = (next[id] || 0) > 0 ? 0 : 1;
|
||||
|
||||
const isOn = (next[addon.id] || 0) > 0;
|
||||
const willTurnOn = !isOn;
|
||||
|
||||
// ✅ jeśli grupa "single" i włączamy -> wyłącz inne z tej grupy
|
||||
if (willTurnOn && addon.group && addon.group_mode === "single") {
|
||||
for (const a of tvAddonsVisible) {
|
||||
if (a.id !== addon.id && a.group === addon.group) {
|
||||
next[a.id] = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// toggle bieżącego
|
||||
next[addon.id] = willTurnOn ? 1 : 0;
|
||||
|
||||
return next;
|
||||
});
|
||||
};
|
||||
@@ -42,7 +58,7 @@ export default function TvAddonsSection({
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={qty > 0}
|
||||
onChange={() => toggleCheckboxAddon(a.id)}
|
||||
onChange={() => toggleCheckboxAddon(a)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -43,5 +43,7 @@ export function normalizeAddons(addons) {
|
||||
opis: a.opis ? String(a.opis) : "",
|
||||
cena: a.cena ?? 0,
|
||||
tid: a.tid != null ? String(a.tid) : "",
|
||||
group: a.group ? String(a.group) : null,
|
||||
group_mode: a.group_mode === "single" ? "single" : null,
|
||||
}));
|
||||
}
|
||||
|
||||
@@ -121,7 +121,7 @@
|
||||
}
|
||||
|
||||
.f-addon-more {
|
||||
@apply text-sm underline opacity-80;
|
||||
@apply text-sm opacity-80;
|
||||
}
|
||||
|
||||
.f-addon-price {
|
||||
|
||||
@@ -1,176 +1,185 @@
|
||||
* {
|
||||
--brand: #0af;
|
||||
--brand: hsla(200 100% 50% 1);
|
||||
--f-navbar-height: 84px;
|
||||
|
||||
--brand-hue: 200;
|
||||
--brand-saturation: 100%;
|
||||
--brand-lightness: 50%;
|
||||
|
||||
--brand-light: hsl(var(--brand-hue) var(--brand-saturation) var(--brand-lightness));
|
||||
--link-color-light: hsla(210, 100%, 40%, 1);
|
||||
--link-hover-light: hsla(165, 80%, 25%, 1);
|
||||
|
||||
--text1-light: hsla(200, 100%, 10%, 1);
|
||||
--text2-light: hsla(200, 30%, 30%, 1);
|
||||
--text3-light: hsla(200, 15%, 85%, 1);
|
||||
|
||||
--surface1-light: hsla(200, 25%, 90%, 1);
|
||||
--surface2-light: hsla(200, 20%, 99%, 1);
|
||||
--surface3-light: hsla(200, 20%, 92%, 1);
|
||||
--surface4-light: hsla(200, 20%, 85%, 1);
|
||||
--surface5-light: hsla(217, 70%, 26%, 1);
|
||||
--surface6-light: hsla(200, 5%, 75%, 1);
|
||||
|
||||
|
||||
--surface-shadow-light: var(--brand-hue) 10% 20%;
|
||||
--shadow-strength-light: .02;
|
||||
--border1-light: hsl(var(--brand-hue) 5% 80%);
|
||||
|
||||
|
||||
--brand-dark: hsl(var(--brand-hue) calc(var(--brand-saturation) / 0.2) calc(var(--brand-lightness) / 1.5));
|
||||
|
||||
--text1-dark: hsla(200, 15%, 85%, 1);
|
||||
--text2-dark: hsla(200, 5%, 65%, 1);
|
||||
--text3-dark: hsla(200, 5%, 100%, 1);
|
||||
|
||||
--surface1-dark: hsla(200, 10%, 10%, 1);
|
||||
--surface2-dark: hsla(200, 10%, 15%, 1);
|
||||
--surface3-dark: hsla(200, 5%, 20%, 1);
|
||||
--surface4-dark: hsla(200, 5%, 25%, 1);
|
||||
--surface5-dark: hsla(200, 35%, 25%, 1);
|
||||
--surface6-dark: hsla(205, 51%, 41%, 1);
|
||||
|
||||
|
||||
--card-ring: hsla(217 91% 60% / 0.45);
|
||||
--card-shadow-deep: hsla(221 47% 11% / 0.18);
|
||||
|
||||
--surface-shadow-dark: var(--brand-hue) 50% 3%;
|
||||
--shadow-strength-dark: .8;
|
||||
--border1-dark: hsl(var(--brand-hue) 40% 70%);
|
||||
|
||||
|
||||
--link-hover-dark: hsla(45, 80%, 70%, 1);
|
||||
--cookie-accept-dark: hsla(120, 60%, 45%, 1);
|
||||
--f-navbar-height: 84px;
|
||||
|
||||
/* Wyróznienie ceny */
|
||||
--f-addons-text: hsla(45, 100%, 92%, 1);
|
||||
--f-addons-background: hsla(165, 80%, 25%, 1);
|
||||
|
||||
--brand-dark: hsl(200 calc(100% / 0.2) calc(50% / 1.5));
|
||||
}
|
||||
|
||||
:root {
|
||||
--f-hero-text: var(--text3-dark);
|
||||
--f-hero-header: var(--text3-dark);
|
||||
--f-hero-text: #d1d6d9;
|
||||
--f-hero-header: #d1d6d9;
|
||||
|
||||
/* --- Background and Text --- */
|
||||
--f-background: var(--surface3-light);
|
||||
--f-text: var(--text2-light);
|
||||
--f-header: var(--text1-light);
|
||||
--f-header-items: (var(--text1-light));
|
||||
--f-background: #e0e6eb;
|
||||
--f-text: #36525e;
|
||||
--f-header: #001a33;
|
||||
--f-header-items: (#001a33);
|
||||
/*--- Navbar --- */
|
||||
--f-navbar-background: var(--surface6-light);
|
||||
--f-navbar-link: var(--link-color-light);
|
||||
--f-navbar-link-hover: var(--link-hover-light);
|
||||
--f-navbar-background: #b3b8ba;
|
||||
--f-navbar-link: #0066cc;
|
||||
--f-navbar-link-hover: #1a6655;
|
||||
/*--- Footer --- */
|
||||
--f-footer-background: var(--surface4-light);
|
||||
--f-footer-link-text: var(--link-color-light);
|
||||
--f-footer-background: #ccd6db;
|
||||
--f-footer-link-text: #0066cc;
|
||||
/* --- Linki --- */
|
||||
--f-link-text: var(--link-color-light);
|
||||
--f-link-text-hover: var(--link-hover-light);
|
||||
/* Buttons Input */
|
||||
/*
|
||||
--btn-background: var(--link-color-light);
|
||||
--btn-text: var(--surface4-light);
|
||||
--btn-background-hover: var(--surface4-light);
|
||||
--btn-text-hover: var(--link-color-light);
|
||||
*/
|
||||
--btn-background: var(--link-color-light);
|
||||
/* var(--surface4-light); */
|
||||
--btn-text: var(--surface4-light);
|
||||
/* var(--link-color-light); */
|
||||
--btn-background-hover: var(--surface4-light);
|
||||
/* var(--link-color-light); */
|
||||
--btn-text-hover: var(--link-color-light);
|
||||
/* var(--surface4-light); */
|
||||
--f-link-text: #0066cc;
|
||||
--f-link-text-hover: #1a6655;
|
||||
--btn-background: #0066cc;
|
||||
--btn-text: #ccd6db;
|
||||
--btn-background-hover: #ccd6db;
|
||||
--btn-text-hover: #0066cc;
|
||||
|
||||
--f-background-toast: var(--surface2-dark);
|
||||
--f-background-toast: #22262b;
|
||||
|
||||
--f-input-border: var(--surface4-light);
|
||||
--f-autocomplete-hover-bg: var(--surface3-dark);
|
||||
--f-autocomplete-hover-text: var(--text1-dark);
|
||||
--f-input-border: #ccd6db;
|
||||
--f-autocomplete-hover-bg: #2d3133;
|
||||
--f-autocomplete-hover-text: #d1d6d9;
|
||||
/* --- Switchery --- */
|
||||
--f-background-switch: var(--surface4-light);
|
||||
|
||||
--f-switcher-background: var(--link-color-light);
|
||||
--f-switcher-text: var(--surface4-light);
|
||||
--f-switcher-background-hover: var(--surface2-light);
|
||||
--f-background-switch: #ccd6db;
|
||||
--f-switcher-background: #0066cc;
|
||||
--f-switcher-text: #ccd6db;
|
||||
--f-switcher-background-hover: #fcfcfd;
|
||||
--f-switcher-text-hover: var(--f-link-text-hover);
|
||||
/* --- Cookie --- */
|
||||
--f-cookie-background: var(--surface2-light);
|
||||
--f-cookie-text: var(--text1-light);
|
||||
--f-cookie-accept-background: var(--link-color-light);
|
||||
--f-cookie-accept-text: var(--surface4-light);
|
||||
--f-cookie-reject-background: var(--surface4-light);
|
||||
--f-cookie-reject-text: var(--surface1-dark);
|
||||
--f-cookie-background: #fcfcfd;
|
||||
--f-cookie-text: #001a33;
|
||||
--f-cookie-accept-background: #0066cc;
|
||||
--f-cookie-accept-text: #ccd6db;
|
||||
--f-cookie-reject-background: #ccd6db;
|
||||
--f-cookie-reject-text: #171a1a;
|
||||
/* --- Offers --- */
|
||||
--f-offers-border: var(--surface4-light);
|
||||
--f-offers-price: var(--brand-light);
|
||||
--f-offers-popular: var(--brand-light);
|
||||
--f-offers-border: #ccd6db;
|
||||
--f-offers-price: #00aaff;
|
||||
--f-offers-popular: #00aaff;
|
||||
--f-offers-popular-bg: color-mix(in srgb, var(--f-offers-popular) 22%, transparent);
|
||||
--f-addons-text: #fffae6;
|
||||
--f-addons-background: #1a6655;
|
||||
|
||||
}
|
||||
|
||||
:root.dark {
|
||||
--f-hero-text: var(--text3-dark);
|
||||
--f-hero-header: var(--text3-dark);
|
||||
:root.dark3 {
|
||||
--header: #f4442e;
|
||||
--text: #adb5bd;
|
||||
--text-link: #f48c06;
|
||||
/* #ffd60a; */
|
||||
|
||||
--f-hero-header: var(--header);
|
||||
--f-hero-text: var(--text);
|
||||
|
||||
--f-background: #171a1a;
|
||||
--f-header: var(--header);
|
||||
--f-text: var(--text);
|
||||
|
||||
/* --- Background and Text --- */
|
||||
--f-background: var(--surface1-dark);
|
||||
--f-text: var(--text2-dark);
|
||||
--f-header: var(--text1-dark);
|
||||
--f-header-items: (var(--text1-dark));
|
||||
/*--- Navbar --- */
|
||||
--f-navbar-background: var(--surface2-dark);
|
||||
--f-navbar-link: var(--brand-dark);
|
||||
--f-navbar-link-hover: var(--link-hover-dark);
|
||||
--f-navbar-background: #343a40;
|
||||
--f-navbar-link: var(--text-link);
|
||||
--f-navbar-link-hover: #ff9f1c;
|
||||
|
||||
/*--- Footer --- */
|
||||
--f-footer-background: var(--surface2-dark);
|
||||
--f-footer-link-text: var(--brand-dark);
|
||||
/* --- Linki --- */
|
||||
--f-link-text: var(--brand-dark);
|
||||
--f-link-text-hover: var(--link-hover-dark);
|
||||
--f-footer-background: #343a40;
|
||||
--f-footer-link-text: var(--text-link);
|
||||
|
||||
--f-link-text: var(--text-link);
|
||||
--f-link-text-hover: #f2e6b3;
|
||||
|
||||
/* Buttons Input */
|
||||
--btn-background: var(--f-link-text);
|
||||
--btn-text: var(--surface1-dark);
|
||||
--btn-background-hover: var(--surface4-dark);
|
||||
--btn-text-hover: var(--f-link-text-hover);
|
||||
--btn-background: #343a40;
|
||||
--btn-text: var(--text-link);
|
||||
--btn-background-hover: var(--btn-text);
|
||||
--btn-text-hover: var(--btn-background);
|
||||
|
||||
--f-background-toast: var(--surface2-dark);
|
||||
--f-background-switch: #343a40;
|
||||
--f-switcher-background: var(--text-link);
|
||||
--f-switcher-text: #343a40;
|
||||
/* --f-switcher-background-hover: #3d3f40;
|
||||
--f-switcher-text-hover: var(--f-link-text-hover); */
|
||||
|
||||
--f-input-border: var(--surface4-dark);
|
||||
--f-autocomplete-hover-bg: var(--surface3-dark);
|
||||
--f-autocomplete-hover-text: var(--text1-dark);
|
||||
/* --- Offers --- */
|
||||
--f-offers-border: #3d3f40;
|
||||
--f-offers-price: #eae2b7;
|
||||
|
||||
/* --- Switchery --- */
|
||||
--f-background-switch: var(--surface3-dark);
|
||||
--f-background-toast: #22262b;
|
||||
|
||||
--f-switcher-background: var(--f-link-text);
|
||||
--f-switcher-text: var(--surface1-dark);
|
||||
--f-input-border: #3d3f40;
|
||||
--f-autocomplete-hover-bg: #2d3133;
|
||||
--f-autocomplete-hover-text: #d1d6d9;
|
||||
|
||||
--f-switcher-background-hover: var(--surface4-dark);
|
||||
--f-switcher-text-hover: var(--f-link-text-hover);
|
||||
|
||||
/* --- Cookie --- */
|
||||
--f-cookie-background: var(--surface4-dark);
|
||||
--f-cookie-text: var(--surface2-light);
|
||||
--f-cookie-background: #3d3f40;
|
||||
--f-cookie-text: #fcfcfd;
|
||||
--f-cookie-accept-background: var(--f-link-text);
|
||||
--f-cookie-accept-text: var(--surface1-dark);
|
||||
--f-cookie-reject-background: var(--surface3-dark);
|
||||
--f-cookie-accept-text: #171a1a;
|
||||
--f-cookie-reject-background: #2d3133;
|
||||
--f-cookie-reject-text: var(--f-link-text);
|
||||
|
||||
/* --- Offers --- */
|
||||
--f-offers-border: var(--surface4-dark);
|
||||
|
||||
--f-offers-popular: var(--brand-dark);
|
||||
--f-offers-popular-bg: color-mix(in srgb, var(--f-offers-popular) 22%, transparent);
|
||||
|
||||
--f-addons-text: #fffae6;
|
||||
--f-addons-background: #1a6655;
|
||||
|
||||
}
|
||||
|
||||
:root.dark {
|
||||
--f-hero-text: #d1d6d9;
|
||||
--f-hero-header: #d1d6d9;
|
||||
|
||||
/* --- Background and Text --- */
|
||||
--f-background: #171a1a;
|
||||
--f-text: #9fa5a8;
|
||||
--f-header: #d1d6d9;
|
||||
--f-header-items: (#d1d6d9);
|
||||
/*--- Navbar --- */
|
||||
--f-navbar-background: #22262b;
|
||||
--f-navbar-link: var(--brand-dark);
|
||||
--f-navbar-link-hover: #f2e6b3;
|
||||
/*--- Footer --- */
|
||||
--f-footer-background: #22262b;
|
||||
--f-footer-link-text: var(--brand-dark);
|
||||
/* --- Linki --- */
|
||||
--f-link-text: var(--brand-dark);
|
||||
--f-link-text-hover: #f2e6b3;
|
||||
/* Buttons Input */
|
||||
--btn-background: var(--f-link-text);
|
||||
--btn-text: #171a1a;
|
||||
--btn-background-hover: #3d3f40;
|
||||
--btn-text-hover: var(--f-link-text-hover);
|
||||
|
||||
--f-background-toast: #22262b;
|
||||
|
||||
--f-input-border: #3d3f40;
|
||||
--f-autocomplete-hover-bg: #2d3133;
|
||||
--f-autocomplete-hover-text: #d1d6d9;
|
||||
|
||||
/* --- Switchery --- */
|
||||
--f-background-switch: #2d3133;
|
||||
|
||||
--f-switcher-background: var(--f-link-text);
|
||||
--f-switcher-text: #171a1a;
|
||||
|
||||
--f-switcher-background-hover: #3d3f40;
|
||||
--f-switcher-text-hover: var(--f-link-text-hover);
|
||||
|
||||
/* --- Cookie --- */
|
||||
--f-cookie-background: #3d3f40;
|
||||
--f-cookie-text: #fcfcfd;
|
||||
--f-cookie-accept-background: var(--f-link-text);
|
||||
--f-cookie-accept-text: #171a1a;
|
||||
--f-cookie-reject-background: #2d3133;
|
||||
--f-cookie-reject-text: var(--f-link-text);
|
||||
|
||||
/* --- Offers --- */
|
||||
--f-offers-border: #3d3f40;
|
||||
--f-offers-price: var(--brand-dark);
|
||||
--f-offers-popular: var(--brand-dark);
|
||||
--f-offers-popular-bg: color-mix(in srgb, var(--f-offers-popular) 22%, transparent);
|
||||
|
||||
--f-addons-text: #fffae6;
|
||||
--f-addons-background: #1a6655;
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user