Template talk:Ukraine's Cultural Diplomacy Month 2022/Infobox
Add topicAppearance
Latest comment: 2 years ago by Nux in topic Layout in template styles
Layout in template styles
[edit]I think moving styles to a styles.css would work better. You could just remove all/most those inline styles from navigation and put them in the CSS. After that fixing styles would be a simple change in one place. And also currently translations are not updated when you update main template.
I also think this work better for thinner screen.
.event-navigation {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 18px;
padding: 10px 15px;
flex-wrap: wrap;
gap: 1em;
}
.event-navigation > div {
display: flex;
justify-content: space-between;
align-items: center;
flex-flow: row;
width: min-content;
text-align: center;
background: #aa5a0a;
padding: 1em;
gap: 1em;
color: white;
}
You could tweak font and image size to fit more navigation items in a row. With above only 3 items would fit in Vector 2022. Which is still better then one per row in current layout on Ukraine's_Cultural_Diplomacy_Month_2022/de. Nux (talk) 03:21, 24 February 2022 (UTC)
- Oh, and if you want to tweak colours I think it would be good to for WCAG AA compatibility at least. This contrast checker tool is good for things like that. Nux (talk) 03:25, 24 February 2022 (UTC)