docs: add social banner in support of Ukraine (#3496)

Summary:
Our mission at [Meta Open Source](https://opensource.facebook.com/) is to empower communities through open source, and we believe that it means building a welcoming and safe environment for all. As a part of this work, we are adding this banner in support for Ukraine during this crisis.

![image](https://user-images.githubusercontent.com/12485205/156651121-b1479b59-a4e7-4a5c-b8d5-4265aa0aea7a.png)

Pull Request resolved: https://github.com/facebook/flipper/pull/3496

Test Plan:
Imported from GitHub, without a `Test Plan:` line.

**Static Docs Preview: staticdocs**
|[Full Site](https://our.intern.facebook.com/intern/staticdocs/eph/D34622802/V3/staticdocs/)|

|**Modified Pages**|

**Static Docs Preview: flipper**
|[Full Site](https://our.intern.facebook.com/intern/staticdocs/eph/D34622802/V3/flipper/)|

|**Modified Pages**|

Reviewed By: mweststrate

Differential Revision: D34622802

Pulled By: passy

fbshipit-source-id: a18c0de24a6a6c2311aef9a046fe65d917ce6f9d
This commit is contained in:
dmitryvinn
2022-03-04 09:20:27 -08:00
committed by Facebook GitHub Bot
parent 8416372c8f
commit 70eab186aa
2 changed files with 41 additions and 3 deletions

View File

@@ -31,9 +31,10 @@ const siteConfig = {
announcementBar: {
id: 'support_ukraine',
content:
'Support Ukraine 🇺🇦 <a target="_blank" rel="noopener noreferrer" href="https://opensource.facebook.com/support-ukraine"> Help Provide Humanitarian Aid to Ukraine</a>.',
backgroundColor: '#fff',
textColor: 'rgb(28, 30, 33)',
'Support Ukraine 🇺🇦 <a target="_blank" rel="noopener noreferrer" href="https://opensource.fb.com/support-ukraine"> Help Provide Humanitarian Aid to Ukraine</a>.',
backgroundColor: '#20232a',
textColor: '#fff',
isCloseable: false,
},
navbar: {
title: fbContent({

View File

@@ -534,3 +534,40 @@ border: 1px solid black;
.ios-support-matrix td {
border: 1px solid black;
}
/* Announcement banner */
:root {
--docusaurus-announcement-bar-height: auto !important;
}
div[class^="announcementBarContent"] {
line-height: 40px;
font-size: 20px;
font-weight: bold;
padding: 8px 30px;
}
div[class^="announcementBarContent"] a {
text-decoration: underline;
display: inline-block;
color: var(--ifm-color-primary-lightest) !important;
}
div[class^="announcementBarContent"] a:hover {
color: var(--brand) !important;
}
@media only screen and (max-width: 768px) {
.announcement {
font-size: 18px;
}
}
@media only screen and (max-width: 500px) {
.announcement {
font-size: 15px;
line-height: 22px;
padding: 6px 30px;
}
}