Smink méretezés

zedclans képe

Üdv!

A napokban a sminkelésbe ástam el magam ismét, és a régiók méretezéséhez kéne nekem valami fajta dokumentáció.

Pontosabban ami érdekel, az a következő:

Azt szeretném kivitelezni, hogy jelenleg 3 "oszlopra" van vágva az oldal, Bal oldalsáv, Content, Jobb oldalsáv, ez így szép és jó, fix szélességű témát szögelek, tehát nem szeretném ha 1000px nél szélesebb legyen a "body", szeretném viszont kivitelezni, hogy amennyiben esetleg nincs használatban a Bal vagy a Jobb oldalsáv, akkor a Content szélessége ehhez mérten igazodjon, tehát a maximális megendetett szélesség mindig kilegyen töltve, azon függően, hogy hány oldalsáv van vagy nincs.

Drupal verzió: 
Fórum: 
Robert Petras képe

1. Flexbox Layout használata a CSS-ben
Javascript vagy Twig logika használata nélkül ez ma már könnyedén megoldható a CSS Flexbox használatával. Az összes modern böngésző támogatja már ezt a font-end fejlesztők által manapság közkedvelt módszert. Magyarországon pedig 98%-os támogatással használható (IE9 és azalatt felejtős).

Van aki szerint komplett weboldal elrendezésre nem ajánlott, de én nem látok ebben semmilyen kivetni valót. A táblázatos és floatingolt elrendezések helyett ezt ténylegesen a CSS layout kialakításra szánták.

Tapasztalat az elmúlt 3 évből? Nos, nemcsak hagyományos szgépen, de mobilon is remekül működik. Egy időben rendszeresen látogattam a helyi Telekom képviseletet, hogy megnézzem a közép és alsó katagóriás Android telókon is hogy miképp működik.

Néhány hasznos útmutató/referencia a számodra:

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Támogatottság globális és hazai szinten:

http://caniuse.com/#feat=flexbox

2. Twig if/else használata a Drupal témában

1
0
segi képe

ha jol megnezegeted a class-kat akkor ott lesz hogy van-e bal vagy jobb oldalsav. En a bodyban van a content class korul keresnem.

1
0

Drupal developer at Cheppers

Robert Petras képe

Ha a Drupal által kínált alapértelmezett Bartik témát használod ez így is van. Ha letöltesz egy contrib témát vagy vásárolsz egyet akkor ennek utána kell nézni.

Esetleg ha saját magad tervezel egy új témát, akkor erről az CSS osztályról nekünk kell gondoskodnunk a Twig fájlban, ha jól tudom.

A minta fájl Bartik ezestében ez: /core/themes/bartik/templates/page.html.twig

  1. <div id="main-wrapper" class="layout-main-wrapper layout-container clearfix">
  2. <div id="main" class="layout-main clearfix">
  3. {{ page.breadcrumb }}
  4. <main id="content" class="column main-content" role="main">
  5. <section class="section">
  6. <a id="main-content" tabindex="-1"></a>
  7. {{ page.content }}
  8. </section>
  9. </main>
  10. {% if page.sidebar_first %}
  11. <div id="sidebar-first" class="column sidebar">
  12. <aside class="section" role="complementary">
  13. {{ page.sidebar_first }}
  14. </aside>
  15. </div>
  16. {% endif %}
  17. {% if page.sidebar_second %}
  18. <div id="sidebar-second" class="column sidebar">
  19. <aside class="section" role="complementary">
  20. {{ page.sidebar_second }}
  21. </aside>
  22. </div>
  23. {% endif %}
  24. </div>
  25. </div>
0
0