diff --git a/css/pages/_member.css b/css/pages/_member.css index 42cc44a9..824ce453 100644 --- a/css/pages/_member.css +++ b/css/pages/_member.css @@ -76,13 +76,30 @@ .mm-num-label { display: block; margin-top: 8px; font-size: 15px; color: rgba(255,255,255,0.85); } .mm-numbers-section .mm-note { color: rgba(255,255,255,0.6); margin-top: 24px; } -/* ---- ways ---- */ -.mm-ways { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; } -.mm-way { border: 1px solid #EAECF0; border-radius: 16px; padding: 24px; background: #FFFFFF; transition: border-color 0.18s ease, box-shadow 0.18s ease; } -.mm-way:hover { border-color: #F6C9A8; box-shadow: 0 10px 22px rgba(242,118,46,0.10); } -.mm-way-ico { font-size: 22px; color: var(--mm-teal); margin-bottom: 12px; } -.mm-way h3 { font-size: 17px; margin: 0 0 6px; } -.mm-way p { font-size: 14px; line-height: 22px; color: #667085; margin: 0; } +/* ---- ways (hub-style auto-scrolling slider) ---- */ +/* Mechanics (.hub-carousel/.hub-uses/.hub-track/.hub-group) and the marquee + animation are reused from _hub.css; the JS clone step (setupHubCarousel) runs + on every page and picks up the .hub-track here. These rules only restyle the + card body for icon-based cards (no photo). */ +.mm-ways-carousel { margin-top: 4px; } +.mm-use { + display: flex; flex-direction: column; justify-content: space-between; + gap: 18px; padding: 24px 22px; + width: clamp(240px, 24vw, 300px); + aspect-ratio: 5 / 6; +} +/* No photo here, so drop the hub image-legibility overlay. */ +.mm-use::after { display: none; } +.mm-use-ico { + display: inline-flex; align-items: center; justify-content: center; + width: 54px; height: 54px; border-radius: 14px; + background: rgba(255, 255, 255, 0.18); + color: #fff; font-size: 23px; flex: 0 0 auto; +} +/* Body is absolute-positioned for photo cards in _hub.css; here it flows normally. */ +.mm-use .hub-use-body { position: static; padding: 0; gap: 6px; } +.mm-use .hub-use-body h3 { font-size: 19px; line-height: 1.25; } +.mm-use .hub-use-body p { font-size: 14px; line-height: 21px; } /* ---- membership in real life ---- */ .mm-reals { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px; margin-top: 40px; } diff --git a/en/become-a-member/index.html b/en/become-a-member/index.html index ddac7d42..e3c15eab 100644 --- a/en/become-a-member/index.html +++ b/en/become-a-member/index.html @@ -261,31 +261,37 @@

There is more than one way to be part of MSOS

You do not need to organise events or lead to belong. Join in the way that fits you.

-
-
-
-

Stay connected

Receive updates and know what is happening.

-
-
-
-

Join the community

Come to events, meet people and take part when it suits you.

-
-
-
-

Volunteer sometimes

Help with selected activities without a long-term commitment.

-
-
-
-

Join projects

Contribute to specific initiatives, campaigns, guides or collaborations.

-
-
-
-

Organise events

Help plan, coordinate, promote and deliver activities.

-
-
-
-

Take responsibility

Explore leadership, governance, representation or local team roles.

-
+
diff --git a/mk/become-a-member/index.html b/mk/become-a-member/index.html index 2a7c4e0f..8a7d26fa 100644 --- a/mk/become-a-member/index.html +++ b/mk/become-a-member/index.html @@ -260,31 +260,37 @@

Има повеќе начини да бидеш дел од МСОС

Не мора да организираш настани или да водиш за да припаѓаш. Приклучи се на начин што ти одговара.

-
-
-
-

Остани поврзан

Примај новости и знај што се случува.

-
-
-
-

Приклучи се на заедницата

Доаѓај на настани, запознавај луѓе и учествувај кога ти одговара.

-
-
-
-

Волонтирај повремено

Помагај на избрани активности без долгорочна обврска.

-
-
-
-

Приклучи се на проекти

Придонеси на конкретни иницијативи, кампањи, водичи или соработки.

-
-
-
-

Организирај настани

Помагај да се планираат, координираат, промовираат и реализираат активности.

-
-
-
-

Преземи одговорност

Истражи лидерство, управување, застапување или улоги во локален тим.

-
+
diff --git a/si/become-a-member/index.html b/si/become-a-member/index.html index 25a5ce2f..635cfba1 100644 --- a/si/become-a-member/index.html +++ b/si/become-a-member/index.html @@ -261,31 +261,37 @@

Obstaja več načinov, da si del MSOS

Ni ti treba organizirati dogodkov ali voditi, da pripadaš. Pridruži se na način, ki ti ustreza.

-
-
-
-

Ostani povezan

Prejemaj novice in vedi, kaj se dogaja.

-
-
-
-

Pridruži se skupnosti

Obišči dogodke, spoznaj ljudi in sodeluj, ko ti ustreza.

-
-
-
-

Občasno prostovoljči

Pomagaj pri izbranih dejavnostih brez dolgoročne zaveze.

-
-
-
-

Pridruži se projektom

Prispevaj k pobudam, kampanjam, vodnikom ali sodelovanjem.

-
-
-
-

Organiziraj dogodke

Pomagaj načrtovati, usklajevati, promovirati in izvesti dejavnosti.

-
-
-
-

Prevzemi odgovornost

Razišči vodenje, upravljanje, zastopanje ali vloge v lokalni ekipi.

-
+