PDA

Zobacz pełną wersję : Gantry5 Helium - formatowanie strony



qrdziel
16-11-2016, 17:30
Mam pytanie do użytkowników frameworka Gantry5
Do layout'u chciałbym dodać na samej górze wąski pasek w którym będą ikony socjalnych medii i wybór języka. Pasek maxymalnie na 22px.
1. Jak utworzyć nowy pasek?
2. Jak zmieniać wysokość pasków?
Mam też problem z Header. Oryginalnie jest tam moduł CARUSEL, jeśli wyrzucę go do kosza to jest problem z kolorami w nawigacji.
Jeśli daję tło ciemne, a tekst biały - to tło robi się białe i tekst biały i nic nie widać??
3. Jak zmienić kolor tła nawigacji?

grzesiek_w
16-11-2016, 20:30
1. Po prawej przy każdej sekcji masz ikonkę "+" plusa - nią dodajesz nowe poziomy w sekcji - potem przeciągasz tam particles / cząstki lub tworzysz pozycje modułów
2. Jeśli chcesz osiągnąć najmniejszą możliwą wysokość musisz na początek zmniejszyć "margin" i "padding" wszystkich modułów i/lub particles które są umieszczone w tym poziomie sekcji - przy każdej klikasz ikonkę zębatki - ale nie sekcji , tylko modułu lub cząski. Teraz w popupie który wyskoczy masz zakładkę block i tam pole Variations. Tu są zdefiniowane style które są w ramach szablonu - odnajdujesz "no margi" i "no padding". Teraz jeśli umieścisz w tym poziomie np particle/cząstkę "social" ikonki będę bez maginesów - wysokość jeśli Ci nie odpowiada definiujesz w "custom.scss"


3. Kolor sekcji Header i Navigation zmieniasz w zakładce styles lub z poziomu pliku custom.scss

Jeśli chcesz żeby ikony social były nad menu to przenieś menu do Header a ikony umieść w navigation - łatwiej będzie Ci kontrolować sekcje.
Jeśli zrobisz ikony i menu w jednej sekcji -ale w 2 poziomach / Rows - w np Navigation będziesz musiał dodawać style do particles lub pozycji modułów

Jest wiele rozwiązań

qrdziel
16-11-2016, 23:07
1. OK
2. OK
3. Nie działają zmiany w zakładce styles.

Gdy logo i navigation przeniosłem do Header - to znikło i nie wyświetla się ??

qrdziel
17-11-2016, 08:43
zauważyłem jeszcze coś ciekawego.
Przez przypadek zobaczyłem moją stronę na tablecie - wszystkie zmiany były widoczne - kolory tła i tekstu zmienione.
Ale tylko gdy tablet był ułożony pionowo, gdy przechyliłem poziomo - zmiany zniknęły. Kolory spowrotem stały się szare i zniknęło menu i logo.

grzesiek_w
17-11-2016, 17:29
Chłopaki z RT dodają czasem style które wprowadzają zamęt w czasie edycji szablonu - szczególnie przy przenoszeniu niektórych cząstek między sekcjami. Tworzą style tylko dla demo szablonu.
Jeśli przeniosłeś logo do innej sekcji np z Navigation do Header mogą niektóre style kolidować ze sobą

Kliknij na ikonkę zębatki cząstki Logo i usuń style z zakładki BLOCK
To samo z menu jeśli przeniosłeś je do Header

W zakładce szablonu "Page Sestting" masz sekcję "Body Attributes" - usuń style z "Body Classes"

Na wszelki wypadek zduplikuj wcześniej Layout szablonu który edytujesz za pomocą panelu "Outlines"

qrdziel
19-11-2016, 16:31
Rzeczywiście - namieszane jest, ze nie da się dostosować do własnych ustawień

Wszedłem na outlines i wykasowałem wszystkie, które dało się skasować.
Teraz Base Outline skopiowałem i nadałem nową nazwę: home-pl
w layout ustawiłem:
navigation - social i languageswitcher
header - menu
a w intro chciałem dać jakiś tekst na tle jpg

jak w intro - ustawić background jakiś jpg?

grzesiek_w
19-11-2016, 22:31
Akurat w sekcji Intro nie ma możliwości wstawienia tła z poziomu zakładki "styles" szablonu

Ale można to zrobić dodając np coś takiego do custom.scss - to ta sama ścieżka i ustawienia jakie ma tło w sekcji #g-header - tyle że bez maski która jest na innej warstwie

#g-intro {
background: rgba(0, 0, 0, 0) url("../../images/header/img01.jpg") no-repeat scroll center center / cover ;
}

qrdziel
28-11-2016, 21:40
To chyba zostanę przy Helix 3 framework. A może zaproponujecie jakiś ciekawszy framework. Sprawdzony i wciąż rozwijany. Może już coś na bootstrap 4?

Sent from my SM-N9005 using Tapatalk

dawidryba11
28-11-2016, 21:56
Bootstrap 4 jest jeszcze w wersji alpha, wiec raczej nikt na nim nic nie buduje.

Co do frameworkow to Warp Framework.
Co prawda nie jest na bootstrapie, ale na UIKIT.

Wysłane z mojego E2105 przy użyciu Tapatalka