/* Stampa:Community hubs: the bar of the community hubs, under the title row of the header of each
hub (Kuvendi, Pyetje e Përgjigje, Zyra e Ankesave, Administrata, Ofiçina, Forumi i Grisjes): an
icon and a name for each. The same bar on every hub, in the same order; the hub you are on is
marked. At the end, the introduction cards of the hubs. */
.hubnav {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 6px;
margin: 0 auto 1.5rem;
padding: 0 0.5rem;
}
.hubnav a {
text-decoration: none;
}
/* the links stretch to the tallest tile, and the tiles with them */
.hubnav > a {
display: flex;
}
.hubnav-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
flex: 1 1 auto;
box-sizing: border-box;
width: 9rem;
padding: 10px 8px 8px;
border: 1px solid transparent;
border-radius: 8px;
color: var(--color-base, #202122);
font-size: 0.88em;
font-weight: 600;
line-height: 1.25;
text-align: center;
transition: background-color 0.15s ease, border-color 0.15s ease;
}
.hubnav-item::before {
content: '';
flex-shrink: 0;
width: 36px;
height: 36px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.hubnav a:hover .hubnav-item,
.hubnav a:focus .hubnav-item {
border: 1px solid var(--border-color-subtle, #c8ccd1);
background-color: var(--background-color-base, #fff);
}
/* The hub you are on */
.hubnav .hubnav-current,
.hubnav a:hover .hubnav-current {
border: 1px solid var(--color-progressive, #36c);
background-color: var(--background-color-progressive-subtle, #eaf3ff);
color: var(--color-progressive, #36c);
}
.hubnav-kuvendi::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/8/83/Wikiclassics_Logo_proposal_5.svg'); }
.hubnav-pep::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/9/9a/Text-questionmark.svg'); }
.hubnav-za::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/e/e0/Accessories-text-editor.svg'); }
.hubnav-adm::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/a/a8/System-users.svg'); }
.hubnav-bot::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/3/30/Applications-system.svg'); }
.hubnav-fg::before { background-image: url('https://upload.wikimedia.org/wikipedia/commons/b/bd/User-trash-full.svg'); }
/* Phones: the six hubs in three columns, with smaller icons */
@media screen and (max-width: 720px) {
.hubnav {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 4px;
padding: 0;
}
.hubnav-item {
width: auto;
padding: 8px 4px 6px;
font-size: 0.8em;
}
.hubnav-item::before {
width: 28px;
height: 28px;
}
}
/* The introduction of a hub, under the bar: a lead and titled cards (how to use the hub, where
else to go, a note for those who answer), like the cards of Ambasadat. The pages without the
bar load these styles with a of their own (Buletini Teknik, Artikulli i javës). */
.hub-intro {
max-width: 1100px;
margin: 0 auto 1.5rem;
padding: 0 2rem;
text-align: left;
}
.hub-lead {
margin-bottom: 1rem;
font-size: 1.05em;
line-height: 1.65;
}
.hub-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
gap: 1rem;
}
.hub-card {
padding: 0.75rem 1.25rem;
border: 1px solid var(--border-color-subtle, #c8ccd1);
border-left: 3px solid var(--color-progressive, #36c);
border-radius: 4px;
background-color: var(--background-color-base, #fff);
color: var(--color-base, #202122);
line-height: 1.6;
}
.hub-card p {
margin: 0.4rem 0 0;
}
.hub-card-title {
margin-bottom: 0.3rem;
font-weight: bold;
}
/* A note for those who answer or look after the page: grey */
.hub-card-note {
border-left: 3px solid var(--border-color-base, #a2a9b1);
background-color: var(--background-color-neutral-subtle, #f8f9fa);
}
@media screen and (max-width: 720px) {
.hub-intro {
padding: 0 1rem;
}
}
/* The archives of a hub ({{Hub archives}}), in the right column of its header, quietly, without a
box: a small title, the archive pages (their numbers, the newest in bold, or their names), a
compact search in them and, where a robot archives the page, after how long */
.hub-archives {
box-sizing: border-box;
max-width: 17rem;
margin: 0 auto;
color: var(--color-subtle, #54595d);
font-size: 13px;
text-align: center;
}
.hub-archives-title {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
margin-bottom: 4px;
font-size: 12px;
font-weight: bold;
letter-spacing: 0.1em;
text-transform: uppercase;
}
.hub-archives-title a {
color: inherit;
}
.hub-archives-title img {
opacity: 0.7;
}
.hub-archives-list {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 0 7px;
margin-bottom: 7px;
line-height: 1.6;
}
/* The numbers of the archives, a little smaller than the rest */
.hub-archives-list-auto {
gap: 0 6px;
font-size: 12px;
}
.hub-archives-list-auto a:last-child {
font-weight: bold;
}
/* Named archives ({{Hub archives|list=…}}, Administrata): a line of names with « · » between them, as
«Kandidaturat · Rivlerësimet» on the AM/AP hubs. The names are links in the colour of links, as the
numbers of the archives of the other hubs; on one line on wide screens */
.hub-archives-named {
max-width: none;
}
.hub-archives-named .hub-archives-list {
display: block;
color: var(--color-subtle, #54595d);
}
.hub-archives-named .hub-archives-search,
.hub-archives-named .hub-archives-note {
max-width: 17rem;
margin-left: auto;
margin-right: auto;
}
@media screen and (min-width: 721px) {
.hub-archives-named .hub-archives-list {
white-space: nowrap;
}
}
.hub-archives-search form {
display: flex;
justify-content: center;
}
.hub-archives-search .cdx-text-input {
flex: 1 1 auto;
min-width: 0;
}
.hub-archives-search .cdx-text-input__input {
width: 100%;
min-height: 28px;
padding-top: 2px;
padding-bottom: 2px;
border-radius: 2px 0 0 2px;
font-size: 13px;
}
.hub-archives-search .cdx-button {
min-height: 28px;
margin-left: -1px;
padding: 0 10px;
border-radius: 0 2px 2px 0;
font-size: 13px;
font-weight: normal;
}
.hub-archives-note {
margin-top: 5px;
font-size: 12px;
line-height: 1.45;
}
/* The shortcut of a hub ({{Shortcut}}, at the foot of its header), as a quiet line «Shteg WP:…»
without its box, as on the pages of Artikuj të mirë/përkryer */
.header .module-shortcutanchordiv {
position: absolute;
}
.header .module-shortcutboxplain {
float: none;
clear: both;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
align-items: baseline;
gap: 2px 6px;
width: auto;
margin: 0;
padding: 0 1.25rem 0.75rem;
border: 0;
background: none;
font-size: 12px;
line-height: 1.4;
}
.header .module-shortcutlist {
display: inline;
margin: 0;
border: 0;
}
.header .module-shortcutlist a {
color: var(--color-subtle, #54595d);
}
.header .module-shortcutboxplain ul {
display: flex;
flex-wrap: wrap;
gap: 0 8px;
}
.header .module-shortcutboxplain li {
margin: 0;
}
