MediaWiki: Tweeki.css: Difference between revisions
From LINKS Community Center
Eschmidt (talk | contribs) No edit summary |
Eschmidt (talk | contribs) No edit summary |
||
(75 intermediate revisions by 2 users not shown) | |||
Line 7: | Line 7: | ||
--links-grey: #415262; | --links-grey: #415262; | ||
--links-orange: #ee7802; | --links-orange: #ee7802; | ||
--ccl-color: #B89F21; | |||
} | } | ||
Line 71: | Line 72: | ||
display: grid; | display: grid; | ||
grid-template: | grid-template: | ||
"links" | "links links" | ||
"nav | "nav legal" | ||
"eu-logo eu-logo" | |||
"eu-logo" | "eu-text eu-text"; | ||
"eu-text"; | |||
gap: 1em 1em; | gap: 1em 1em; | ||
font-size: 1.2em; | font-size: 1.2em; | ||
Line 224: | Line 224: | ||
opacity: 0; | opacity: 0; | ||
transition: all 500ms ease-in-out; | transition: all 500ms ease-in-out; | ||
word-break: break-word; | |||
} | } | ||
Line 232: | Line 233: | ||
/* TODO: Generalize link formatting later (remove #dct-profile) */ | /* TODO: Generalize link formatting later (remove #dct-profile) */ | ||
.skin-tweeki | .skin-tweeki #dct-profile a.external { | ||
background: initial; | background: initial; | ||
padding: 0; | padding: 0; | ||
Line 248: | Line 249: | ||
font-family: 'Raleway'; | font-family: 'Raleway'; | ||
font-weight: 300; | font-weight: 300; | ||
} | |||
#dct-profile.uc-profile h1, | |||
#dct-profile.uc-profile h2, | |||
#dct-profile.uc-profile h3, | |||
#dct-profile.uc-profile h4, | |||
#dct-profile.uc-profile h5, | |||
#dct-profile.uc-profile h6 { | |||
color: var(--links-cyan); | |||
} | |||
#dct-profile.gl-profile h1, | |||
#dct-profile.gl-profile h2, | |||
#dct-profile.gl-profile h3, | |||
#dct-profile.gl-profile h4, | |||
#dct-profile.gl-profile h5, | |||
#dct-profile.gl-profile h6 { | |||
color: var(--links-orange); | |||
} | |||
#dct-profile.cc-profile h1, | |||
#dct-profile.cc-profile h2, | |||
#dct-profile.cc-profile h3, | |||
#dct-profile.cc-profile h4, | |||
#dct-profile.cc-profile h5, | |||
#dct-profile.cc-profile h6 { | |||
color: var(--ccl-color); | |||
} | } | ||
#dct-profile h1 { | #dct-profile h1 { | ||
font-weight: 700; | font-weight: 700; | ||
max-width: 80%; | |||
} | } | ||
#dct-profile h2 { | #dct-profile h2 { | ||
font-weight: 500; | font-weight: 500; | ||
} | |||
#dct-profile .disclaimer { | |||
font-size: smaller; | |||
margin-top: 2rem; | |||
opacity: .5; | |||
} | } | ||
#dct-back-link { | #dct-back-link { | ||
margin-bottom: 2em; | margin-bottom: 2em; | ||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
} | } | ||
Line 267: | Line 305: | ||
font-variant: small-caps; | font-variant: small-caps; | ||
text-decoration: none !important; | text-decoration: none !important; | ||
color: var(--links-blue); | |||
border-bottom: 1px solid var(--links-blue); | border-bottom: 1px solid var(--links-blue); | ||
} | } | ||
Line 276: | Line 315: | ||
margin-right: 1em; | margin-right: 1em; | ||
vertical-align: -1.5em; | vertical-align: -1.5em; | ||
} | |||
#dct-back-link .gl-icon { | |||
filter: invert(56%) sepia(69%) saturate(3911%) hue-rotate(7deg) brightness(98%) contrast(105%); | |||
height: 4em; | |||
width: 4em; | |||
margin-right: 1em; | |||
vertical-align: -1.5em; | |||
} | |||
#dct-back-link .uc-icon { | |||
filter: invert(62%) sepia(54%) saturate(526%) hue-rotate(131deg) brightness(91%) contrast(85%); | |||
height: 4em; | |||
width: 4em; | |||
margin-right: 1em; | |||
vertical-align: -1.5em; | |||
} | |||
#dct-back-link .cc-icon { | |||
filter: invert(72%) sepia(44%) saturate(758%) hue-rotate(7deg) brightness(81%) contrast(88%); | |||
height: 4em; | |||
width: 4em; | |||
margin-right: 1em; | |||
vertical-align: -1.5em; | |||
} | |||
#dct-profile .ext-link-button a.external { | |||
background-color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
} | |||
.dct-page-info { | |||
font-size: smaller; | |||
opacity: .75; | |||
} | } | ||
#dct-profile .dct-logo { | #dct-profile .dct-logo { | ||
height: | max-height: 8em; | ||
width: auto; | width: auto; | ||
} | } | ||
Line 320: | Line 393: | ||
#dct-profile .dct-func h3 { | #dct-profile .dct-func h3 { | ||
font-size: 1. | font-size: 1.2em; | ||
} | } | ||
Line 339: | Line 412: | ||
#dct-profile .dct-func li { | #dct-profile .dct-func li { | ||
list-style-type: none; | list-style-type: none; | ||
margin-left: | margin-left: 4.6em; | ||
text-indent: -1.6em; | text-indent: -1.6em; | ||
position: relative; | position: relative; | ||
display: inline-block; | |||
} | } | ||
Line 359: | Line 433: | ||
opacity: .5; | opacity: .5; | ||
margin-right: .8em; | margin-right: .8em; | ||
} | } | ||
Line 411: | Line 454: | ||
transform: scaleX(0); | transform: scaleX(0); | ||
} | } | ||
.gl-profile .anim-border::after { background-color: var(--links-orange); } | |||
.uc-profile .anim-border::after { background-color: var(--links-cyan); } | |||
.cc-profile .anim-border::after { background-color: var(--ccl-color); } | |||
.anim-border::before { | .anim-border::before { | ||
Line 423: | Line 469: | ||
transform: scaleY(0); | transform: scaleY(0); | ||
} | } | ||
.gl-profile .anim-border::before { background-color: var(--links-orange); } | |||
.uc-profile .anim-border::before { background-color: var(--links-cyan); } | |||
.cc-profile .anim-border::before { background-color: var(--ccl-color); } | |||
body.loaded .anim-border::before { | body.loaded .anim-border::before { | ||
Line 490: | Line 539: | ||
/* =========================== END GUIDELINE LIST (TEMPORARY) =========================== */ | /* =========================== END GUIDELINE LIST (TEMPORARY) =========================== */ | ||
/* =========================== GUIDELINE PROFILE | /* =========================== GUIDELINE PROFILE =========================== */ | ||
/* #region */ | /* #region */ | ||
.guideline-profile+p { | #dct-profile.gl-profile .ext-link-button a.external { | ||
background-color: var(--links-orange); | |||
border: 1px solid var(--links-orange); | |||
} | |||
#dct-back-link.gl-back-link a { | |||
color: var(--links-orange); | |||
border-bottom: 1px solid var(--links-orange); | |||
} | |||
/* .guideline-profile+p { | |||
margin: 4em 0; | margin: 4em 0; | ||
font-size: larger; | font-size: larger; | ||
Line 511: | Line 570: | ||
.guideline-profile .smwtable-clean tbody>tr:nth-child(even) { | .guideline-profile .smwtable-clean tbody>tr:nth-child(even) { | ||
background-color: unset; | background-color: unset; | ||
} | } */ | ||
/* #endregion */ | /* #endregion */ | ||
/* =========================== END GUIDELINE PROFILE | /* =========================== END GUIDELINE PROFILE =========================== */ | ||
/* =========================== RESOURCES =========================== */ | /* =========================== RESOURCES =========================== */ | ||
Line 606: | Line 665: | ||
/* =========================== END NETWORKS =========================== */ | /* =========================== END NETWORKS =========================== */ | ||
. | /* =========================== BRIDGING PAGES =========================== */ | ||
/* #region */ | |||
.bridging-page .bp-section { | |||
margin-bottom: 2em; | |||
} | |||
.bridging-page .ich-section { | |||
background-color: #f2f2f2; | |||
padding: 1em; | |||
border-radius: 15px; | |||
} | } | ||
.bridging-page .ich-section img { | |||
border-radius: 10px; | |||
} | } | ||
.bridging-page h1, | |||
.bridging-page h2, | |||
.bridging-page h3, | |||
.bridging-page h4, | |||
.bridging-page h5, | |||
.bridging-page h6 { | |||
font-family: 'Raleway'; | font-family: 'Raleway'; | ||
font-weight: 300; | font-weight: 300; | ||
} | } | ||
# | /* #endregion */ | ||
font- | /* =========================== END BRIDGING PAGES =========================== */ | ||
.badge.lcc-badge-red { | |||
font-weight: 350; | |||
color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
filter: hue-rotate(130deg); | |||
} | |||
.badge.lcc-badge-green { | |||
font-weight: 350; | |||
color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
filter: hue-rotate(260deg); | |||
} | |||
.badge.lcc-badge-purple { | |||
font-weight: 350; | |||
color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
filter: hue-rotate(70deg); | |||
} | |||
.badge.lcc-badge-grey { | |||
font-weight: 350; | |||
color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
filter: grayscale(1); | |||
} | } | ||
.smwtable-clean tr>th { | |||
min-width: 10em; | |||
text-align: left; | |||
} | } | ||
.plus.icon { | |||
color: currentColor; | |||
display: inline-block; | |||
position: relative; | |||
top: -.4em; | |||
width: 1.2em; | |||
} | } | ||
.plus.icon::before { | |||
content: ''; | |||
position: absolute; | |||
width: .85em; | |||
height: 1px; | |||
background-color: currentColor; | |||
} | } | ||
.plus.icon::after { | |||
content: ''; | |||
position: absolute; | |||
width: .85em; | |||
height: 1px; | |||
background-color: currentColor; | |||
transform: rotate(90deg); | |||
transition: all 0.4s ease; | |||
} | } | ||
.ext-link-button a.external { | |||
display: inline-block; | |||
font-size: 120%; | |||
padding: .5em 1em !important; | |||
color: rgba(255, 255, 255, .9); | |||
transition: all 400ms; | |||
} | } | ||
.ext-link-button a.external:hover { | |||
filter: invert(100%); | |||
} | } | ||
.ext-link-button a.external::after { | |||
content: '→'; | |||
display: inline-block; | |||
margin-left: .2rem; | |||
transform: rotate(-45deg); | |||
} | } | ||
# | #dct-back-link.uc-back-link a { | ||
color: var(--links-cyan); | color: var(--links-cyan); | ||
border-bottom: 1px solid var(--links-cyan); | |||
} | |||
#dct-back-link.cc-back-link a { | |||
color: var(--ccl-color); | |||
border-bottom: 1px solid var(--ccl-color); | |||
} | |||
/* Display checkboxes and radiobuttons in Page Forms vertically */ | |||
table.formtable .checkboxesSpan, table.formtable .radioButtonSpan { | |||
display: flex; | |||
flex-flow: column wrap; | |||
} | } | ||
/* Hide Edit button on form tabs */ | |||
#pfForm #edittab { display: none; } | |||
/* Hide icon inside the upload button */ | |||
#pfForm .simpleUploadInterface .oo-ui-icon-upload { display: none; } | |||
/* Fix broken "Sort by" dropdown in Google Site Search */ | |||
#mw-googlesitesearch .gsc-orderby .gsc-option-menu-container { white-space: nowrap; } | |||
/* Fix SimpleUpload preview bleeding out of the form */ | |||
.formtable img.simpleupload_prv { max-width: 100%; } |
Latest revision as of 17:26, 12 December 2023
/* CSS placed here will affect users of the Tweeki skin */ /* =========================== GENERAL =========================== */ :root { --links-blue: #1980c3; --links-cyan: #34b8b8; --links-grey: #415262; --links-orange: #ee7802; --ccl-color: #B89F21; } /* TODO: Add static fallback fonts */ @supports (font-variation-settings: normal) { @font-face { font-family: 'Open Sans'; src: url('/resources/assets/fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf') format("truetype supports variations"), url('/resources/assets/fonts/Open_Sans/OpenSans-VariableFont_wdth,wght.ttf') format("truetype-variations"); font-weight: 300 800; font-stretch: 75% 100%; } @font-face { font-family: 'Raleway'; src: url('/resources/assets/fonts/Raleway/Raleway-VariableFont_wght.ttf') format("truetype supports variations"), url('/resources/assets/fonts/Raleway/Raleway-VariableFont_wght.ttf') format("truetype-variations"); font-weight: 100 900; } } .firstHeading, .tweekiFirstHeading { font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } .firstHeading .namespace { font-weight: 150; } #bodyContent { font-family: 'Open Sans'; } .platform-profile img, .platform-profile svg { max-width: 100px; max-height: 100px; } /* LCC FOOTER START */ /* #region */ /* This is MediaWiki's own footer */ footer#footer.footer { padding: 0; } #lcc-footer { width: 100%; padding: 1em; font-size: .8rem; font-family: 'Open Sans'; font-weight: 300; background-color: var(--links-grey); color: rgba(255, 255, 255, .6); background: linear-gradient(to top, #1A2026, var(--links-grey)); } #lcc-footer-content { margin: auto; display: grid; grid-template: "links links" "nav legal" "eu-logo eu-logo" "eu-text eu-text"; gap: 1em 1em; font-size: 1.2em; } #lcc-footer-content a { display: inline-block; margin-bottom: .7em; color: rgba(255, 255, 255, .7); transition: all 200ms; } #lcc-footer-content a:hover { display: inline-block; margin-bottom: .7em; color: rgba(255, 255, 255, .9); font-weight: 600; } #lcc-footer-content .footer-links { grid-area: links; display: flex; flex-flow: column wrap; } #lcc-footer-content .footer-nav { grid-area: nav; display: flex; flex-flow: column wrap; } #lcc-footer-content .footer-legal { grid-area: legal; display: flex; flex-flow: column wrap; } #lcc-footer-content .footer-eu-logo { grid-area: eu-logo; } #lcc-footer-content .footer-eu-logo img { height: 2.5em; opacity: .8; } #lcc-footer-content .footer-eu-text { grid-area: eu-text; display: flex; } #lcc-footer-content .footer-eu-text p { font-size: .8em; } #lcc-footer-content .project-link { font-variant: small-caps; font-size: 180%; margin-top: -0.4em; } @media screen and (min-width: 992px) { #lcc-footer { padding: 5em; font-size: 1rem; } #lcc-footer-content { width: 83.3333333333%; grid-template: "links nav legal" "eu-logo eu-text eu-text" /1fr 1fr 1fr; gap: 5em 1em; font-size: 1.2em; } #lcc-footer-content .footer-legal { grid-area: legal; text-align: right; } #lcc-footer-content .footer-eu-text { justify-content: flex-end; } #lcc-footer-content .footer-eu-text p { text-align: right; max-width: 75%; } } /* #endregion */ /* LCC FOOTER END */ /* DCT PROFILE START */ /* #region */ @keyframes showRight { from { transform-origin: left; transform: scaleX(0); } to { transform-origin: left; transform: scaleX(1); } } @keyframes showDown { from { transform-origin: top; transform: scaleY(0); } to { transform-origin: top; transform: scaleY(1); } } @keyframes hideDown { from { transform-origin: bottom; transform: scaleY(1); } to { transform-origin: bottom; transform: scaleY(0); } } #dct-profile { display: grid; grid-template: "meta" "desc" "info" "func" "more"; font-family: 'Open Sans'; font-weight: 400; font-stretch: 100%; color: var(--links-grey); margin-bottom: 3em; clip-path: inset(0 0 100% 0); opacity: 0; transition: all 500ms ease-in-out; word-break: break-word; } body.loaded #dct-profile { clip-path: inset(0 0 0 0); opacity: 1; } /* TODO: Generalize link formatting later (remove #dct-profile) */ .skin-tweeki #dct-profile a.external { background: initial; padding: 0; text-decoration: none; border-bottom: 1px solid var(--links-blue); } #dct-profile h1, #dct-profile h2, #dct-profile h3, #dct-profile h4, #dct-profile h5, #dct-profile h6 { color: var(--links-blue); font-family: 'Raleway'; font-weight: 300; } #dct-profile.uc-profile h1, #dct-profile.uc-profile h2, #dct-profile.uc-profile h3, #dct-profile.uc-profile h4, #dct-profile.uc-profile h5, #dct-profile.uc-profile h6 { color: var(--links-cyan); } #dct-profile.gl-profile h1, #dct-profile.gl-profile h2, #dct-profile.gl-profile h3, #dct-profile.gl-profile h4, #dct-profile.gl-profile h5, #dct-profile.gl-profile h6 { color: var(--links-orange); } #dct-profile.cc-profile h1, #dct-profile.cc-profile h2, #dct-profile.cc-profile h3, #dct-profile.cc-profile h4, #dct-profile.cc-profile h5, #dct-profile.cc-profile h6 { color: var(--ccl-color); } #dct-profile h1 { font-weight: 700; max-width: 80%; } #dct-profile h2 { font-weight: 500; } #dct-profile .disclaimer { font-size: smaller; margin-top: 2rem; opacity: .5; } #dct-back-link { margin-bottom: 2em; display: flex; justify-content: space-between; align-items: center; } #dct-back-link a { font-family: 'Open Sans'; font-size: 1.5em; font-variant: small-caps; text-decoration: none !important; color: var(--links-blue); border-bottom: 1px solid var(--links-blue); } #dct-back-link .dct-icon { filter: invert(53%) sepia(16%) saturate(3227%) hue-rotate(169deg) brightness(77%) contrast(96%); height: 4em; width: 4em; margin-right: 1em; vertical-align: -1.5em; } #dct-back-link .gl-icon { filter: invert(56%) sepia(69%) saturate(3911%) hue-rotate(7deg) brightness(98%) contrast(105%); height: 4em; width: 4em; margin-right: 1em; vertical-align: -1.5em; } #dct-back-link .uc-icon { filter: invert(62%) sepia(54%) saturate(526%) hue-rotate(131deg) brightness(91%) contrast(85%); height: 4em; width: 4em; margin-right: 1em; vertical-align: -1.5em; } #dct-back-link .cc-icon { filter: invert(72%) sepia(44%) saturate(758%) hue-rotate(7deg) brightness(81%) contrast(88%); height: 4em; width: 4em; margin-right: 1em; vertical-align: -1.5em; } #dct-profile .ext-link-button a.external { background-color: var(--links-blue); border: 1px solid var(--links-blue); } .dct-page-info { font-size: smaller; opacity: .75; } #dct-profile .dct-logo { max-height: 8em; width: auto; } #dct-profile>.section { box-sizing: border-box; padding: 2em 0 2em 2em; transition: all 500ms ease-in-out; transition-delay: 1000ms; } body.loaded #dct-profile>.section { padding-left: 0; } #dct-profile .dct-meta { grid-area: meta; } #dct-profile .dct-desc { grid-area: desc; } #dct-profile .dct-info { grid-area: info; display: grid; grid-template-columns: repeat(auto-fit, minmax(10em, 1fr)); gap: 1em 1em; } #dct-profile .dct-info .country-flag { height: 1.8em; width: auto; } #dct-profile .dct-func { grid-area: func; } #dct-profile .dct-func h3 { font-size: 1.2em; } #dct-profile .dct-func .func-icon { filter: invert(53%) sepia(16%) saturate(3227%) hue-rotate(169deg) brightness(77%) contrast(96%); height: 2em; width: 2em; vertical-align: -.6em; margin-right: .6em; } #dct-profile .dct-func-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(14em, 1fr)); gap: 2em 2em; } #dct-profile .dct-func li { list-style-type: none; margin-left: 4.6em; text-indent: -1.6em; position: relative; display: inline-block; } #dct-profile .dct-func li.available::before { content: "✓"; color: var(--links-blue); margin-right: .8em; } #dct-profile .dct-func li.unavailable { color: #bbb; } #dct-profile .dct-func li.unavailable::before { content: "✗"; color: #666; opacity: .5; margin-right: .8em; } #dct-profile .dct-more { grid-area: more; } .anim-border { position: relative; } .anim-border::after { content: ""; display: block; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; background-color: var(--links-blue); transform: scaleX(0); } .gl-profile .anim-border::after { background-color: var(--links-orange); } .uc-profile .anim-border::after { background-color: var(--links-cyan); } .cc-profile .anim-border::after { background-color: var(--ccl-color); } .anim-border::before { content: ""; display: block; position: absolute; left: 0; top: 0; width: 1px; height: 100%; background-color: var(--links-blue); transform: scaleY(0); } .gl-profile .anim-border::before { background-color: var(--links-orange); } .uc-profile .anim-border::before { background-color: var(--links-cyan); } .cc-profile .anim-border::before { background-color: var(--ccl-color); } body.loaded .anim-border::before { animation: showDown 500ms ease-in-out 500ms 1 normal forwards, hideDown 500ms ease-in-out 1000ms 1 normal forwards; } body.loaded .anim-border::after { animation: showRight 500ms ease-in-out 1000ms 1 normal forwards; } @media only screen and (orientation: landscape) { #dct-profile { grid-template: "meta meta" "desc info" "func info" "more info" / 3fr 1fr; } #dct-profile>.section { box-sizing: border-box; padding: 2em; } #dct-profile .dct-info { display: block; padding-left: 2em !important; padding-right: 0; } #dct-profile .dct-info>div { margin-bottom: 2.5em; } #dct-profile .dct-info::before { animation: showDown 500ms ease-in-out 1500ms 1 normal forwards; } #dct-profile .dct-info::after { animation: none 0; } } /* #endregion */ /* DCT PROFILE END */ /* =========================== GUIDELINE LIST (TEMPORARY) =========================== */ /* #region */ #guidelines h1, #guidelines h2 { color: var(--links-orange); font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } #guidelines h1 img { height: 2.5em; width: 2.5em; filter: invert(60%) sepia(40%) saturate(6791%) hue-rotate(6deg) brightness(100%) contrast(98%); margin-right: .5em; } /* #endregion */ /* =========================== END GUIDELINE LIST (TEMPORARY) =========================== */ /* =========================== GUIDELINE PROFILE =========================== */ /* #region */ #dct-profile.gl-profile .ext-link-button a.external { background-color: var(--links-orange); border: 1px solid var(--links-orange); } #dct-back-link.gl-back-link a { color: var(--links-orange); border-bottom: 1px solid var(--links-orange); } /* .guideline-profile+p { margin: 4em 0; font-size: larger; } .guideline-profile .smwtable-clean { width: 100%; table-layout: fixed; margin: 4em 0; } .guideline-profile .smwtable-clean tr>th { text-align: left; font-weight: 320; width: 14em; } .guideline-profile .smwtable-clean tbody>tr:nth-child(even) { background-color: unset; } */ /* #endregion */ /* =========================== END GUIDELINE PROFILE =========================== */ /* =========================== RESOURCES =========================== */ /* #region */ #resources h1 { color: var(--links-grey); font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } #resources h1 img { height: 2.5em; width: 2.5em; filter: invert(32%) sepia(13%) saturate(865%) hue-rotate(168deg) brightness(91%) contrast(93%); margin-right: .5em; } #resources-wrapper { margin-top: 2em; } #resources-wrapper h2, #resources-wrapper h3, #resources-wrapper h4, #resources-wrapper h5, #resources-wrapper h6 { font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } #resources-wrapper h2 { margin-top: 2em; } #resources-wrapper h3 { font-size: 1.5em; margin-top: 1em; } #resources-wrapper dl { margin-left: 2em; } #resources-wrapper dl dt { margin-bottom: 1em; } #resources-wrapper dl dd { margin-top: -1em; margin-bottom: 1em; } /* #endregion */ /* =========================== END RESOURCES =========================== */ /* =========================== NETWORKS =========================== */ /* #region */ #networks h1 { color: var(--links-grey); font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } #networks h1 img { height: 2.5em; width: 2.5em; filter: invert(32%) sepia(13%) saturate(865%) hue-rotate(168deg) brightness(91%) contrast(93%); margin-right: .5em; } #networks-wrapper { margin-top: 2em; margin-bottom: 2em; } #networks-wrapper h2, #networks-wrapper h3 { font-family: 'Raleway'; font-weight: 300; letter-spacing: .06em; } #networks-wrapper h2 { margin-top: 1.5em; } /* #endregion */ /* =========================== END NETWORKS =========================== */ /* =========================== BRIDGING PAGES =========================== */ /* #region */ .bridging-page .bp-section { margin-bottom: 2em; } .bridging-page .ich-section { background-color: #f2f2f2; padding: 1em; border-radius: 15px; } .bridging-page .ich-section img { border-radius: 10px; } .bridging-page h1, .bridging-page h2, .bridging-page h3, .bridging-page h4, .bridging-page h5, .bridging-page h6 { font-family: 'Raleway'; font-weight: 300; } /* #endregion */ /* =========================== END BRIDGING PAGES =========================== */ .badge.lcc-badge-red { font-weight: 350; color: var(--links-blue); border: 1px solid var(--links-blue); filter: hue-rotate(130deg); } .badge.lcc-badge-green { font-weight: 350; color: var(--links-blue); border: 1px solid var(--links-blue); filter: hue-rotate(260deg); } .badge.lcc-badge-purple { font-weight: 350; color: var(--links-blue); border: 1px solid var(--links-blue); filter: hue-rotate(70deg); } .badge.lcc-badge-grey { font-weight: 350; color: var(--links-blue); border: 1px solid var(--links-blue); filter: grayscale(1); } .smwtable-clean tr>th { min-width: 10em; text-align: left; } .plus.icon { color: currentColor; display: inline-block; position: relative; top: -.4em; width: 1.2em; } .plus.icon::before { content: ''; position: absolute; width: .85em; height: 1px; background-color: currentColor; } .plus.icon::after { content: ''; position: absolute; width: .85em; height: 1px; background-color: currentColor; transform: rotate(90deg); transition: all 0.4s ease; } .ext-link-button a.external { display: inline-block; font-size: 120%; padding: .5em 1em !important; color: rgba(255, 255, 255, .9); transition: all 400ms; } .ext-link-button a.external:hover { filter: invert(100%); } .ext-link-button a.external::after { content: '→'; display: inline-block; margin-left: .2rem; transform: rotate(-45deg); } #dct-back-link.uc-back-link a { color: var(--links-cyan); border-bottom: 1px solid var(--links-cyan); } #dct-back-link.cc-back-link a { color: var(--ccl-color); border-bottom: 1px solid var(--ccl-color); } /* Display checkboxes and radiobuttons in Page Forms vertically */ table.formtable .checkboxesSpan, table.formtable .radioButtonSpan { display: flex; flex-flow: column wrap; } /* Hide Edit button on form tabs */ #pfForm #edittab { display: none; } /* Hide icon inside the upload button */ #pfForm .simpleUploadInterface .oo-ui-icon-upload { display: none; } /* Fix broken "Sort by" dropdown in Google Site Search */ #mw-googlesitesearch .gsc-orderby .gsc-option-menu-container { white-space: nowrap; } /* Fix SimpleUpload preview bleeding out of the form */ .formtable img.simpleupload_prv { max-width: 100%; }