fccn / nau-themes

NAU Themes for OpenEdx
GNU General Public License v3.0
0 stars 4 forks source link

Improve footer logo display for 2024 FCCN brand image #47

Closed sandroscosta closed 2 months ago

sandroscosta commented 3 months ago

The following commit duplicates the current styling of Richie's footer, to allow parity between the footers. This implementation allow to place one of more lines of logos, following the convention:

"NAU_ENTITIES_FOOTER": {
        "itens": [
            [
                {
                    "alt": "",
                    "image": "",
                    "link": ""
                }
            ]
        ]
    }

For the flexbox and script to render correctly, you have to define a list of lists, even when only placing a line of logos.

Before: image

After: image

igobranco commented 3 months ago

@sandroscosta you need to support both ways of configure the same setting or alternatively replace the existing one with a new one. If not during deployment we can't have both configurations to coexist. And if one is ok, the other is crashing!! It is not a problem, if we don't have logos during a short time period, but we can't have it crashing the application.

I would prefer to replace the current setting to a new setting. eg: NAU_FOOTER_LOGOS.

"NAU_FOOTER_LOGOS": [
    [
        {
            "alt": "",
            "image": "",
            "link": ""
        }
    ]
]
sandroscosta commented 3 months ago

I would prefer to replace the current setting to a new setting. eg: NAU_FOOTER_LOGOS.

I tried to keep everything on the same setting, but had issues with flexbox. But I can do this. This makes sense.

igobranco commented 3 months ago

I tried to keep everything on the same setting, but had issues with flexbox. But I can do this. This makes sense.

@sandroscosta Go ahead please with this change. Remove the NAU_ENTITIES_FOOTER setting and replace it with NAU_FOOTER_LOGOS. The NAU_FOOTER_LOGOS should be as simple as a list of list of dict. The 1st level is each row of icons, the 2nd level presents a row of icons, then each dict represent a image with its alt, image and link.

sandroscosta commented 2 months ago

The previous variable still renders the logos, but now we have NAU_FOOTER_LOGOS that renders multiple lines without the need redefine the styles. This maintains compatibility.

When deployed, just copy the following settings to redo the menu. This new setting should only be set if you remove the previous NAU_ENTITIES_FOOTER.

"NAU_FOOTER_LOGOS": {
        "itens": [
            [
                {
                    "alt": "Compete 2020 Portugal 2020 UNIÃO EUROPEIA Fundo Europeu de Desenvolvimento Regional",
                    "image": "https://nau-stage-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/5c/3c/5c3c6778-529d-4a12-87fc-f41094ef8728/barra.png__9851x1422_subsampling-2.png",
                    "link": "https://www.fccn.pt/inovacao/projeto-nau-financiamento-sama/"
                },
                {
                    "alt": "Portugal INCoDe.2030",
                    "image": "https://nau-stage-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/58/85/5885b2dd-27c2-4d61-9e4b-9987b28bcee4/4logos-feder_fse_nau_v2.png__660x720_subsampling-2.png",
                    "link": "https://www.incode2030.gov.pt/"
                }
            ],
            [  
                {
                    "alt": "Republica Portuguesa",
                    "image": "https://nau-stage-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/b7/12/b712329f-22f6-44f9-a04b-fe5cc9867276/pt_preto_horizontal.svg__4563x1167.svg",
                    "link": "https://portugaldigital.gov.pt/"
                },
                {
                    "alt": "FCT FCCN",
                    "image": "https://nau-stage-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/76/46/76467e88-d6a4-4ede-9dea-f67602fc3f6f/2024_logo-fccn-fct-b-preto.svg__852x190.svg",
                    "link": "https://fccn.pt/"
                }
            ]
        ]
    },
igobranco commented 2 months ago

@sandroscosta you are complicating... just remove the old setting from the code! We deploy with the setting!

igobranco commented 2 months ago

The final configuration:

{
    "NAU_FOOTER_LOGOS": {
        "itens": [
            [
                { 
                    "alt": "PRR Plano de Recuperação e Resiliência, República Portuguesa, Financiado pela União Europeia NextGenerationEU",
                    "image": "https://nau-prod-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/2a/f5/2af51561-e2cd-4b12-8cbe-c62aca6e1727/barra.png__9851x1422_subsampling-2.png",
                    "link": "https://www.fccn.pt/inovacao/projeto-nau-financiamento-sama/"
                },
                {
                    "alt": "Compete2020, Portugal2020, União Europeia Fundo Europeu de Desenvolvimento Regional",
                    "image": "https://nau-prod-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/64/a7/64a7c11d-c3f8-4487-95c0-46b3f8bb5236/4logos-feder_fse_nau_v2.png__600x720_subsampling-2.png",
                    "link": "https://www.incode2030.gov.pt/"
                }
            ],
            [
                {
                    "alt": "República Portuguesa, Ministério da Educação, Ciência e Inovação.",
                    "image": "https://nau-prod-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/23/93/2393278b-fb7d-4f34-bfef-9bad17a2f71c/pt_preto_horizontal.svg__4563x1167.svg",
                    "link": "https://www.portugal.gov.pt/"
                },
                {
                    "alt": "FCCN - Serviços digitais FCT; FCT - Fundação para a Ciência e a Tecnologia",
                    "image": "https://nau-prod-richie-nau-media.rgw.nau.fccn.pt/media/filer_public_thumbnails/filer_public/2d/7d/2d7d35ff-5b9b-4d15-83e6-8911a8393dd6/2024_logo-fccn-fct-b-preto.svg__852x190.svg",
                    "link": "https://www.fccn.pt/"
                }
            ]
        ]
    }

}