# Beállítások

> A blokkstílus-beállítások ábécésorrendben: mit csinál mindegyik, és melyik blokkon találkozol vele.

A stílusbeállítások blokkonként kicsit eltérnek, de sok közülük közös. Az alábbi lista az összeset tartalmazza. A feliratok a felületen látható szöveggel egyeznek, ezért néhány angolul szerepel. Ha egy beállítást nem látsz, az adott blokk nem használja.

| Beállítás | Rövid leírás |
| --- | --- |
| Alignment (Igazítás) | az elem igazítása balra, középre vagy jobbra |
| Background Color (Háttérszín) | az elem háttérszíne |
| Border (Szegély) | szegély típusa, vastagsága és színe |
| Border Radius (Rádiusz) | a sarkok lekerekítése |
| Children Offset Left | az al-opciók behúzása a szűrőkben |
| Direction | az opciók iránya: egymás mellett vagy egymás alatt |
| Field Content Alignment | a tartalom igazítása a mezőn belül |
| Field Content Width | a többsoros szöveg szélessége |
| Field Element Position | a mező elhelyezése az oldalon |
| Filter Position | a szűrőopciók sorban vagy oszlopban |
| Horizontal Gap (Vízszintes hézag) | a Listing Grid elemei közti vízszintes hely |
| Icon Color | az ikon színe |
| Icon Gap | az ikon és a tartalom távolsága |
| Icon Orientation | az ikon helye a tartalomhoz képest: mellette vagy fölötte |
| Icon Position | az ikon a felirat előtt vagy után |
| Icon Size | az ikon mérete |
| Margin (Margó) | a blokk külső tere |
| Offset Left | az ikon és a felirat távolsága a jelölőnégyzetes és a rádiós szűrőkben |
| Padding | a blokk belső tere |
| Points Width/Height (Pontok szélessége/magassága) | a Range szűrő két pontjának mérete |
| Space Between | a szűrő opciói közti hely |
| Stroke (Vastagság) | a Range szűrő skálavonalának vastagsága |
| Text Color (Szöveg színe) | a szöveg színe |
| Typography (Tipográfia) | a betű beállításai |
| Vertical Gap (Függőleges távolság) | a Listing Grid elemei közti függőleges hely |

## Alignment

Kiválasztod, hogy az elem balra, középre vagy jobbra igazodjon az oldalon. A szűrők **Gomb** szakaszában négy igazítási gomb van (balra, középre, jobbra, sorkizárt).

## Background Color

Az elem háttérszínét adja meg. Kiválaszthatod a színpaletta egyik színét, vagy a színválasztó ablakban bármilyen színt megadhatsz (részletek: [Használat](https://hub.hellowp.io/hu/plugins/jet-style-manager/hasznalat/#színválasztó)). Ahol fülek vannak (például **Normál** és **Rámutatás**), a **Rámutatás** fülön az egér fölé vitelkor érvényes színt állíthatod be.

## Border

A szegélyt az elem szélén állíthatod be.

| Rész | Mit csinál |
| --- | --- |
| Szegély típusa | egyszerű (Solid), dupla (Double), szaggatott (Dashed), pontozott (Dotted) vagy vésett (Groove) vonal. A többi szegélybeállítás csak akkor jelenik meg, ha kiválasztasz egy típust |
| Szegély vastagsága | a szegély vastagsága. Ha oldalanként eltérő kell, szüntesd meg az oldalak összekapcsolását a lánc ikonnal |
| Szegély színe | a szegély színe |

## Border Radius

A szegély sarkait kerekíti: minél nagyobb az érték, annál lágyabb az elem. Alapból az összes sarok egyszerre változik. Ha sarkonként más értéket szeretnél, kattints a lánc ikonra (az oldalak szétkapcsolása), ahogy a [Használat](https://hub.hellowp.io/hu/plugins/jet-style-manager/hasznalat/#térközök-padding-és-margó) fejezetben a paddingnél.

## Children Offset Left

Azokban a szűrőkben használható, amelyekben szülő és gyerek opciók is vannak. A gyerek opciók balról mért behúzását adja meg: húzd a csúszkát, vagy írd be a pixelértéket.

## Direction

Azt adja meg, hogyan jelenjen meg a mezőben a lehetőségek listája. A **Horizontal** minden opciót egy sorba tesz, a **Vertical** egymás alá, egy oszlopba.

## Field Content Alignment

A tartalom igazítása a mező dobozán belül: balra, középre vagy jobbra.

## Field Content Width

Többsoros szövegnél azt állítja, hogyan töltse ki a szöveg a blokk dobozát. **Auto** esetén a szöveg a szokásos módon tördelődik, **Fullwidth** esetén úgy, hogy kitöltse a teljes dobozt, és ne maradjon rés a szélnél.

## Field Element Position

A mező elhelyezése az oldalon: jobbra, középre vagy balra.

## Filter Position

Két gomb közül választva a szűrőopciók egy sorba vagy egy oszlopba kerülnek.

## Horizontal Gap

A Listing Grid sorai közti hely szélességét adja meg csúszkával vagy beírt értékkel. A Listing Grid blokkon a felirata **VÍZSZINTES HÉZAG** (az **Oszlopok** szakaszban).

## Icon Color

Az ikon színe, hogy illeszkedjen a tartalom többi részéhez. Az alapszínek közül választhatsz, vagy a színválasztó ablakban megadhatsz egyéni színt.

## Icon Gap

Az ikon és a tartalom többi része közti hely, pixelben. Húzd a csúszkát, vagy írd be a számot.

## Icon Orientation

Az ikon helyzetét adja meg: **Horizontal** esetén a többi tartalommal egy sorban, **Vertical** esetén a tartalom fölött áll.

## Icon Position

Az ikon helyzete a mező szövegéhez képest: **Before Label** esetén a szöveg előtt, **After Label** esetén a sor végén, a szöveg után.

## Icon Size

Az ikon mérete pixelben, csúszkával vagy beírt számmal.

## Margin

A blokk széle és a környező rész széle közti hely. Nagyobb értéknél több üres hely lesz a blokk körül. Alapból az összes oldal össze van kapcsolva; az oldalankénti beállításhoz szüntesd meg az összekapcsolást (lásd: [Használat](https://hub.hellowp.io/hu/plugins/jet-style-manager/hasznalat/#térközök-padding-és-margó)). A felületen a felirata **MARGÓ**.

## Offset Left

A jelölőnégyzetes (Checkboxes) és a rádiógombos (Radio) szűrőkben az interaktív ikon és a felirata közti hely. Csúszkával vagy pixelértékkel állítható.

## Padding

A tartalom és a blokk széle közti hely. Ha a háttérszín látszik, a nagyobb padding nagyobbra is teszi az elemet. A **Visszaállít** gombbal az alapértékre térhetsz vissza. Az oldalankénti beállítás menete a [Használat](https://hub.hellowp.io/hu/plugins/jet-style-manager/hasznalat/#térközök-padding-és-margó) fejezetben van.

## Points Width/Height

A Range szűrőnek két pontja van, a skála két végén. A beállítással a pontok szélessége (**PONTOK SZÉLESSÉGE**) és magassága (**PONTOK MAGASSÁGA**) adható meg pixelben. A pontoknak háttérszínt (**HÁTTÉRSZÍN**), szegélyt és rádiuszt is adhatsz.

## Space Between

A szűrő opciói közti hely szélessége. A Range szűrő **Beviteli mezők** szakaszában a felirata **TÉRKÖZ AZ ELEMEK KÖZÖTT**.

## Stroke

A Range szűrő skálavonalának vastagsága, csúszkával vagy pixelértékkel. A felirata **VASTAGSÁG** (a **Diavetítés** szakaszban). Ugyanitt a **Tartomány** fülön a kijelölt tartomány színét is állíthatod.

## Text Color

A blokkban megjelenő szöveg színe. Az alapszínek közül választhatsz, vagy a színválasztó ablakban megadhatsz egyéni színt (részletek: [Használat](https://hub.hellowp.io/hu/plugins/jet-style-manager/hasznalat/#színválasztó)).

## Tipográfia

A **TYPOGRAPHY** melletti gombra kattintva nyíló ablakban a szöveg minden tulajdonsága megadható.

| Mező | Mit csinál |
| --- | --- |
| FONT FAMILY | a betűtípus. A lista tetején a **Default**, alatta a telepített betűk. Az ablakban a hivatkozásra kattintva kezelheted a telepített betűtípusokat |
| FONT SIZE | a betűméret. Alapból pixel (**px**); átválthatsz **em**, **%** vagy **rem** mértékegységre. Az **em** a szülő elem méretéhez, a **rem** a HTML-ben megadott alapmérethez viszonyít, ezért a reszponzív oldalakhoz jók |
| LINE HEIGHT | a sormagasság, vagyis a sorok közti hely. Mértékegysége **px**, **em**, **%** vagy **rem** |
| FONT WEIGHT | a betű vastagsága: **Default**, **Thin 100**, **Extra Light 200**, **Light 300**, **Regular 400**, **Medium 500**, **Semi Bold 600**, **Bold 700**, **Extra Bold 800**, **Black 900** |
| FONT STYLE | a betű stílusa: **Default**, **Normal**, **Italic** vagy **Oblique** |
| BETŰNAGYSÁG | a kis- és nagybetűk kezelése: nincs módosítás, csupa nagybetű, csupa kisbetű, vagy minden szó nagy kezdőbetűvel |
| DÍSZÍTÉS | a szöveg vonalazása: nincs, aláhúzott vagy áthúzott |
| LETTER SPACING | a betűk közti hely. Mértékegysége **px**, **em**, **%** vagy **rem** |

## Vertical Gap

A Listing Grid oszlopai közti hely szélessége csúszkával vagy beírt értékkel. A Listing Grid blokkon a felirata **FÜGGŐLEGES TÁVOLSÁG**.

## Blokkonkénti szakaszok

A stílusfül szakaszai blokkonként más-más beállításokat tartalmaznak. Néhány példa:

| Blokk | Szakasz | Mit állíthatsz benne |
| --- | --- | --- |
| Range (szűrő) | Diavetítés | a skála vastagsága, színe, szegélye, rádiusza, a pontok mérete és háttere (**Alapértelmezett** és **Tartomány** fül) |
| Range (szűrő) | Értékek | az értékek tipográfiája, színe, margója, igazítása |
| Range (szűrő) | Beviteli mezők | a konténer szélessége, a mezők közti hely, a beviteli mező és az előtag/utótag tipográfiája, színe, háttere, szegélye, paddingje |
| Range (szűrő) | Gomb | betűtípus, szöveg- és háttérszín (**Normál** és **Rámutatás**), szegély, rádiusz, padding, margó, igazítás |
| Listing Grid | Oszlopok | **VÍZSZINTES HÉZAG**, **FÜGGŐLEGES TÁVOLSÁG** |
| Listing Grid | Betöltésjelző | a betöltésjelző színe és mérete, a szöveg színe és tipográfiája |
| Listing Grid | Nincs találati üzenet | az üzenet tipográfiája és színe |
| Űrlap szövegmező | Text Input | tipográfia, padding, szegély, rádiusz, szöveg- és háttérszín |
| Űrlap szövegmező | Content, Label | a mező burkolójának és feliratának margója, igazítása, szegélye, háttere, tipográfiája |

Más blokkokon további, speciális beállításokat is találhatsz; ezek a fenti vezérlőkből épülnek fel, ezért használatuk ugyanígy megy.