Commit e9dab85e18b72f6f4dda8413108e3053401dc2a4
2020-02-18T22:17:05
Website: Added Coy bug to the known failures page. (#2170)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70
diff --git a/img/failures/coy-overlap.png b/img/failures/coy-overlap.png
new file mode 100644
index 0000000..ac3c79e
Binary files /dev/null and b/img/failures/coy-overlap.png differ
diff --git a/index.html b/index.html
index fd19c18..e8048d6 100644
--- a/index.html
+++ b/index.html
@@ -100,7 +100,7 @@
<li>Very easy to extend without modifying the code, due to Prism’s <a href="#plugins">plugin architecture</a>. Multiple hooks are scattered throughout the source.</li>
<li>Very easy to <a href="extending.html#language-definitions">define new languages</a>. Only thing you need is a good understanding of regular expressions</li>
<li>All styling is done through CSS, with <a href="faq.html#how-do-i-know-which-tokens-i-can-style-for">sensible class names</a> rather than ugly namespaced abbreviated nonsense.</li>
- <li>Wide browser support: IE9+, Firefox, Chrome, Safari, <a href="faq.html#this-page-doesnt-work-in-opera">Opera</a>, most Mobile browsers</li>
+ <li>Wide browser support: IE11, Firefox, Chrome, Safari, <a href="faq.html#this-page-doesnt-work-in-opera">Opera</a>, most Mobile browsers</li>
<li>Highlights embedded languages (e.g. CSS inside HTML, JavaScript inside HTML)</li>
<li>Highlights inline code as well, not just code blocks</li>
<li>Highlights nested languages (CSS in HTML, JavaScript in HTML)</li>
@@ -116,7 +116,8 @@
<ul>
<li>Any pre-existing HTML in the code will be stripped off. <a href="faq.html#if-pre-existing-html-is-stripped-off-how-can-i-highlight">There are ways around it though</a>.</li>
<li>Regex-based so it *will* fail on certain edge cases, which are documented in the <a href="known-failures.html">known failues page</a>.</li>
- <li>No IE 6-8 support. If someone can read code, they are probably in the 85% of the population with a modern browser.</li>
+ <li>Some of our themes have problems with certain layouts. Known cases are documented <a href="known-failures.html#themes">here</a>.</li>
+ <li>No IE 6-10 support. If someone can read code, they are probably in the 85% of the population with a modern browser.</li>
</ul>
</section>
diff --git a/known-failures.html b/known-failures.html
index e59e368..b03f034 100644
--- a/known-failures.html
+++ b/known-failures.html
@@ -24,7 +24,7 @@
<script>var _gaq = [['_setAccount', 'UA-33746269-1'], ['_trackPageview']];</script>
<script src="https://www.google-analytics.com/ga.js" async></script>
</head>
-<body>
+<body class="language-none">
<header>
<div class="intro" data-src="templates/header-main.html" data-type="text/html"></div>
@@ -335,6 +335,29 @@ not supported */</code></pre>
</section>
+<section>
+
+<h1 id="themes">Themes</h1>
+
+<p>Some of our themes are not compatible with certain layouts.</p>
+
+<h2>Coy</h2>
+
+<p>Coy's shadows and background might not wrap around the code correctly if combined with float of flexbox layouts.</p>
+
+<img src="img/failures/coy-overlap.png"/>
+
+<h3>Workarounds</h3>
+
+<p>There are 2 possible workarounds:</p>
+
+<p>The first workaround is setting <code>display: flex-root;</code> for the <code>pre</code> element. This will fix the issue but <code>flex-root</code> has <a href="https://caniuse.com/#feat=flow-root">limited browser support</a>.</p>
+
+<p>The second is adding <code>clear: both;</code> to the style of the <code>pre</code> element. This will fix the issue but it will change the way code blocks behave when overlapping with other elements.</p>
+
+</section>
+
+
<footer data-src="templates/footer.html" data-type="text/html"></footer>
<script src="scripts/utopia.js"></script>