diff --git a/app/components/DocumentPreview/DocumentPreview.js b/app/components/DocumentPreview/DocumentPreview.js
index 917c3b42..00ae796c 100644
--- a/app/components/DocumentPreview/DocumentPreview.js
+++ b/app/components/DocumentPreview/DocumentPreview.js
@@ -82,6 +82,7 @@ const Heading = styled.h3`
margin-bottom: 0.25em;
overflow: hidden;
white-space: nowrap;
+ color: ${props => props.theme.text};
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
`;
diff --git a/app/components/Editor.js b/app/components/Editor.js
index de042ebe..4495d54b 100644
--- a/app/components/Editor.js
+++ b/app/components/Editor.js
@@ -88,10 +88,16 @@ const StyledEditor = styled(RichMarkdownEditor)`
transition: ${props => props.theme.backgroundTransition};
}
+ .notice-block.tip,
+ .notice-block.warning {
+ font-weight: 500;
+ }
+
p {
a {
color: ${props => props.theme.link};
border-bottom: 1px solid ${props => lighten(0.5, props.theme.link)};
+ text-decoration: none !important;
font-weight: 500;
&:hover {
diff --git a/app/scenes/KeyboardShortcuts.js b/app/scenes/KeyboardShortcuts.js
index ca853ec8..86e008c4 100644
--- a/app/scenes/KeyboardShortcuts.js
+++ b/app/scenes/KeyboardShortcuts.js
@@ -139,6 +139,10 @@ function KeyboardShortcuts() {
{"```"}
+
+ {":::"}
+
+
_italic_
diff --git a/package.json b/package.json
index 55e727d1..0ddc2dc6 100644
--- a/package.json
+++ b/package.json
@@ -121,7 +121,7 @@
"mobx-react": "^5.4.2",
"natural-sort": "^1.0.0",
"nodemailer": "^4.4.0",
- "outline-icons": "^1.18.0",
+ "outline-icons": "^1.19.0",
"oy-vey": "^0.10.0",
"pg": "^6.1.5",
"pg-hstore": "2.3.2",
@@ -141,7 +141,7 @@
"react-portal": "^4.0.0",
"react-router-dom": "^5.1.2",
"react-waypoint": "^9.0.2",
- "rich-markdown-editor": "^10.4.0-1",
+ "rich-markdown-editor": "^10.4.0",
"semver": "^7.3.2",
"sequelize": "^5.21.1",
"sequelize-cli": "^5.5.0",
@@ -191,4 +191,4 @@
"js-yaml": "^3.13.1"
},
"version": "0.45.0"
-}
+}
\ No newline at end of file
diff --git a/server/onboarding/π Our Editor.md b/server/onboarding/π Our Editor.md
index 7fe98ff6..f397b9a1 100644
--- a/server/onboarding/π Our Editor.md
+++ b/server/onboarding/π Our Editor.md
@@ -6,7 +6,10 @@ If youβre comfortable writing markdown then all of the shortcuts you are used
![The formatting toolbar](/images/screenshots/formatting-toolbar.png)
-*Tip:* You can also paste markdown or html from elsewhere directly into a document.
+:::info
+You can also paste markdown or html from elsewhere directly into a document.
+:::
+
## Rich documents
diff --git a/server/onboarding/π Integrations & API.md b/server/onboarding/π Integrations & API.md
index 7855d133..142fcf13 100644
--- a/server/onboarding/π Integrations & API.md
+++ b/server/onboarding/π Integrations & API.md
@@ -4,7 +4,10 @@ Outline supports many of the most popular tools on the market without any additi
Our integration code is also [open-source](https://github.com/outline/outline) and we encourage third party developers and the community to build support for additional tools!
-*Tip:* Most integrations work by simply pasting a link from a supported service into a document.
+:::info
+Most integrations work by simply pasting a link from a supported service into a document.
+:::
+
## Slack
diff --git a/shared/styles/globals.js b/shared/styles/globals.js
index 70cbd8e5..fd43cfa7 100644
--- a/shared/styles/globals.js
+++ b/shared/styles/globals.js
@@ -53,7 +53,6 @@ export default createGlobalStyle`
line-height: 1.25;
margin-top: 1em;
margin-bottom: 0.5em;
- color: ${props => props.theme.text};
}
h1 { font-size: 2.25em; }
h2 { font-size: 1.5em; }
diff --git a/shared/styles/theme.js b/shared/styles/theme.js
index 305a0053..a253e080 100644
--- a/shared/styles/theme.js
+++ b/shared/styles/theme.js
@@ -26,10 +26,19 @@ const colors = {
yellow: "#FBCA04",
warmGrey: "#EDF2F7",
- danger: "#D0021B",
+ danger: "#ff476f",
warning: "#f08a24",
success: "#2f3336",
info: "#a0d3e8",
+
+ brand: {
+ red: "#FF5C80",
+ pink: "#FF4DFA",
+ purple: "#9E5CF7",
+ blue: "#3633FF",
+ marine: "#2BC2FF",
+ green: "#42DED1",
+ },
};
const spacing = {
@@ -81,6 +90,11 @@ export const base = {
blockToolbarHoverBackground: colors.slateLight,
blockToolbarDivider: colors.slateLight,
+ noticeTipBackground: colors.brand.purple,
+ noticeTipText: colors.white,
+ noticeWarningBackground: colors.danger,
+ noticeWarningText: colors.white,
+
breakpoints: {
mobile: 0, // targeting all devices
tablet: 737, // targeting devices that are larger than the iPhone 6 Plus (which is 736px in landscape mode)
@@ -137,6 +151,9 @@ export const light = {
codeBorder: colors.smokeDark,
embedBorder: "#DDD #DDD #CCC",
horizontalRule: colors.smokeDark,
+
+ noticeInfoBackground: colors.warmGrey,
+ noticeInfoText: colors.almostBlack,
};
export const dark = {
@@ -189,6 +206,9 @@ export const dark = {
codeString: "#3d8fd1",
embedBorder: colors.black50,
horizontalRule: darken(0.2, colors.slate),
+
+ noticeInfoBackground: colors.white10,
+ noticeInfoText: colors.almostWhite,
};
export default light;
diff --git a/yarn.lock b/yarn.lock
index 7373bfae..4323beb4 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6432,6 +6432,11 @@ map-visit@^1.0.0:
dependencies:
object-visit "^1.0.0"
+markdown-it-container@^3.0.0:
+ version "3.0.0"
+ resolved "https://registry.yarnpkg.com/markdown-it-container/-/markdown-it-container-3.0.0.tgz#1d19b06040a020f9a827577bb7dbf67aa5de9a5b"
+ integrity sha512-y6oKTq4BB9OQuY/KLfk/O3ysFhB3IMYoIWhGJEidXt1NQFocFK2sA2t0NYZAMyMShAGL6x5OPIbrmXPIqaN9rw==
+
markdown-it-mark@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/markdown-it-mark/-/markdown-it-mark-3.0.0.tgz#27c3e39ef3cc310b2dde5375082c9fa912983cda"
@@ -7166,10 +7171,10 @@ osenv@^0.1.4:
os-homedir "^1.0.0"
os-tmpdir "^1.0.0"
-outline-icons@^1.15.0, outline-icons@^1.18.0:
- version "1.18.0"
- resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.18.0.tgz#2f128d668b0874725b5c0656a04fd73a7f8fe418"
- integrity sha512-odEYBLN+zFcTDhfs4af2RHUGneQBYbVgaBuI/I30BLaJQsKT2jBw2Shjie/HR8MYpZtgMwixP51XPPlGBSIqgw==
+outline-icons@^1.19.0, outline-icons@^1.19.1:
+ version "1.19.1"
+ resolved "https://registry.yarnpkg.com/outline-icons/-/outline-icons-1.19.1.tgz#5251b966ae9987b18f060b58ce469d248c2313aa"
+ integrity sha512-YeGLDG7KgBvrDy+WOQUqN8rD3qO5u524E0Wj6ejaWNQ8/1ou6kkUrx65mk8LtESfKLMWZHuQG/u6onurY9rKIw==
oy-vey@^0.10.0:
version "0.10.0"
@@ -8599,15 +8604,16 @@ retry-as-promised@^3.2.0:
dependencies:
any-promise "^1.3.0"
-rich-markdown-editor@^10.4.0-1:
- version "10.4.0-1"
- resolved "https://registry.yarnpkg.com/rich-markdown-editor/-/rich-markdown-editor-10.4.0-1.tgz#1f5dc63262b0bcae4d94e83ec9076dd229a8e199"
- integrity sha512-donV4yFbS9fCdWhWYI70xo+hbkxdBbYGJKEg3NcnhkdZ7NbE6Cn4R3JmSdg7BpBgIM/7H+UMWqUV5M9vJHaLHQ==
+rich-markdown-editor@^10.4.0:
+ version "10.4.0"
+ resolved "https://registry.yarnpkg.com/rich-markdown-editor/-/rich-markdown-editor-10.4.0.tgz#0a31401cf3f3356c0f365607fba0fd28a8b05da4"
+ integrity sha512-vLghzLnat13TE7xbY2vOENoH3iifO8Z+J8FQ0W2SP4wcL6pqwgMvDSsmVKuEEbh5E9zRwAcsqFybH985Zqg1tQ==
dependencies:
copy-to-clipboard "^3.0.8"
lodash "^4.17.11"
+ markdown-it-container "^3.0.0"
markdown-it-mark "^3.0.0"
- outline-icons "^1.15.0"
+ outline-icons "^1.19.1"
prismjs "^1.19.0"
prosemirror-commands "^1.1.4"
prosemirror-dropcursor "^1.3.2"