Skip to content

Commit

Permalink
deploy: f36ac4c
Browse files Browse the repository at this point in the history
  • Loading branch information
@captainbrosset
captainbrosset committed May 4, 2023
1 parent 4878e1b commit 8db5de3
Show file tree
Hide file tree
Showing 24 changed files with 60 additions and 37 deletions.
Binary file added _pagefind/fragment/en_7f4a8ce.pf_fragment
View file
Binary file not shown.
Binary file removed _pagefind/fragment/en_91da712.pf_fragment
View file
Binary file not shown.
Binary file removed _pagefind/index/en_1a9c8a8.pf_index
View file
Binary file not shown.
Binary file removed _pagefind/index/en_2e096d5.pf_index
View file
Binary file not shown.
Binary file added _pagefind/index/en_b0134ec.pf_index
View file
Binary file not shown.
Binary file added _pagefind/index/en_e294848.pf_index
View file
Binary file not shown.
2 changes: 1 addition & 1 deletion _pagefind/pagefind-entry.json
View file
Original file line number Diff line number Diff line change
@@ -1 +1 @@
{"version":"0.12.0","languages":{"en":{"hash":"en_bfd727d290","wasm":"en","page_count":137}}}
{"version":"0.12.0","languages":{"en":{"hash":"en_2149e87329","wasm":"en","page_count":137}}}
Binary file added _pagefind/pagefind.en_2149e87329.pf_meta
View file
Binary file not shown.
Binary file removed _pagefind/pagefind.en_bfd727d290.pf_meta
View file
Binary file not shown.
Binary file added assets/img/debug-print-css-styles-polypane.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion browser/chrome/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ <h2>114 <span class="browser-name">Chrome</span> DevTools Tips </h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
2 changes: 1 addition & 1 deletion browser/edge/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ <h2>117 <span class="browser-name">Edge</span> DevTools Tips </h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
2 changes: 1 addition & 1 deletion browser/firefox/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ <h2>86 <span class="browser-name">Firefox</span> DevTools Tips </h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
17 changes: 16 additions & 1 deletion browser/polypane/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ <h1><a href="/">Polypane DevTools Tips</a></h1>
<p>Help us make DevTools Tips better! <a href="https://forms.gle/1rhvKkwfAjs3ATqJ8">Fill out this survey</a> to tell us more about your DevTools habits and frustrations.</p>
</div>
<div class="page-toolbar">
<h2>44 <span class="browser-name">Polypane</span> DevTools Tips </h2>
<h2>45 <span class="browser-name">Polypane</span> DevTools Tips </h2>
<div id="search" class="search"></div>
<script src="/_pagefind/pagefind-ui.js" async onload="new PagefindUI({ element: '#search', showImages: false });"></script>

Expand All @@ -52,6 +52,21 @@ <h2>44 <span class="browser-name">Polypane</span> DevTools Tips </h2>
</label>
<script async src="/assets/unique-browser-features.js"></script>
<ul class="tips">
<li class="hover-box tip ">
<a href="/tips/en/debug-print-css-styles/" class="tip-title">Debug your print CSS styles by simulating print media</a>
<a href="/tips/en/debug-print-css-styles/" class="tip-image"><img src="../../assets/img/debug-print-css-styles-firefox.png" alt="Firefox, with DevTools open, showing the Inspector tool, with the print media button" loading="lazy"></img></a>
<div class="tip-excerpt">
If you work on a webpage that's supposed to be printed, you probably want to test your print CSS sty...
<a href="/tips/en/debug-print-css-styles/">Read more</a>
</div>
<div class="tip-info">
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

<li class="hover-box tip unique-browser-feature">
<a href="/tips/en/find-broken-links/" class="tip-title">Find broken links</a>
<a href="/tips/en/find-broken-links/" class="tip-image"><img src="../../assets/img/find-broken-links-polypane.png" alt="Polypane, with the outline panel open. Two of the links show a 404 error code" loading="lazy"></img></a>
Expand Down
9 changes: 9 additions & 0 deletions feed.xml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,15 @@
&lt;/ol&gt;
&lt;p&gt;&lt;img src=&quot;https://devtoolstips.org/tips/assets/img/debug-print-css-styles-chrome.png&quot; alt=&quot;Chrome, with DevTools open, showing the Rendering tool in the drawer, with the media emulation drop-down showing the Print option&quot; /&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;In Polypane:&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;Open the &lt;strong&gt;Emulation options&lt;/strong&gt;.&lt;/li&gt;
&lt;li&gt;Toggle &lt;strong&gt;Media type&lt;/strong&gt; to &amp;quot;print&amp;quot;.&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;&lt;em&gt;Tip: open two panes side-by-side and set one to print media to compare the print and screen versions of your page.&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://devtoolstips.org/tips/assets/img/debug-print-css-styles-polypane.png&quot; alt=&quot;Polypane with the Emulation options open, showing the media type option set to &amp;quot;print&amp;quot;&quot; /&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
</content>
</entry>
Expand Down
2 changes: 1 addition & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ <h2>139 DevTools Tips</h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
2 changes: 1 addition & 1 deletion tag/all/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ <h2>139 all DevTools Tips</h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
2 changes: 1 addition & 1 deletion tag/css/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ <h2>38 css DevTools Tips</h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
2 changes: 1 addition & 1 deletion tag/testing/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ <h2>21 testing DevTools Tips</h2>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/" title="See all tips about css">css</a></li><li class="tag"><a href="/tag/testing/" title="See all tips about testing">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/" title="See all tips supported on edge">edge</a></li><li class="browser"><a href="/browser/chrome/" title="See all tips supported on chrome">chrome</a></li><li class="browser"><a href="/browser/firefox/" title="See all tips supported on firefox">firefox</a></li><li class="browser"><a href="/browser/polypane/" title="See all tips supported on polypane">polypane</a></li></ul>
</div>
</li>

Expand Down
29 changes: 19 additions & 10 deletions tips/en/debug-print-css-styles/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ <h1><a href="/">Debug your print CSS styles by simulating print media</a></h1>
Categories:
<ul class="tags"><li class="tag"><a href="/tag/css/">css</a></li><li class="tag"><a href="/tag/testing/">testing</a></li></ul>
Supported by:
<ul class="browsers"><li class="browser"><a href="/browser/edge/">edge</a></li><li class="browser"><a href="/browser/chrome/">chrome</a></li><li class="browser"><a href="/browser/firefox/">firefox</a></li></ul>
<ul class="browsers"><li class="browser"><a href="/browser/edge/">edge</a></li><li class="browser"><a href="/browser/chrome/">chrome</a></li><li class="browser"><a href="/browser/firefox/">firefox</a></li><li class="browser"><a href="/browser/polypane/">polypane</a></li></ul>
</div>
<h2 class="tip-title">Debug your print CSS styles by simulating print media</h2>
<div class="tip-content" data-pagefind-body>
Expand All @@ -69,6 +69,15 @@ <h2 class="tip-title">Debug your print CSS styles by simulating print media</h2>
</ol>
<p><img src="/assets/img/debug-print-css-styles-chrome.png" alt="Chrome, with DevTools open, showing the Rendering tool in the drawer, with the media emulation drop-down showing the Print option"></p>
</li>
<li>
<p>In Polypane:</p>
<ol>
<li>Open the <strong>Emulation options</strong>.</li>
<li>Toggle <strong>Media type</strong> to &quot;print&quot;.</li>
</ol>
<p><em>Tip: open two panes side-by-side and set one to print media to compare the print and screen versions of your page.</em></p>
<p><img src="/assets/img/debug-print-css-styles-polypane.png" alt="Polypane with the Emulation options open, showing the media type option set to &quot;print&quot;"></p>
</li>
</ul>

</div><div class="see-also">
Expand All @@ -79,22 +88,22 @@ <h3>See also</h3>
<img loading="lazy" src="/assets/img/list-console-functions.png" alt="Chrome, with the Console panel opened on the side in DevTools, showing the `console.log(console)` command result, which is an object containing a list of functions such as assert, clear, debug.">
</a>
</li><li>
<a href="/tips/en/replay-xhr">Replay a XHR request</a>
<a href="/tips/en/replay-xhr" class="other-tip-image">
<img loading="lazy" src="/assets/img/replay-xhr.png" alt="Chrome&#39;s Network tool, with the Replay XHR contextual menu item">
<a href="/tips/en/past-several-css-declarations">Paste multiple CSS declarations at once</a>
<a href="/tips/en/past-several-css-declarations" class="other-tip-image">
<img loading="lazy" src="/assets/img/paste-several-css-declarations.gif" alt="Animation showing how pasting several declarations in a CSS rule in DevTools creates them all.">
</a>
</li><li>
<a href="/tips/en/style-console-messages">Apply CSS styles to console messages</a>
<a href="/tips/en/style-console-messages" class="other-tip-image">
<img loading="lazy" src="/assets/img/style-console-messages.png" alt="A styled console message in Edge.">
</a>
</li><li>
<a href="/tips/en/zoom-devtools-content">Zoom the DevTools UI to your liking</a>
<a href="/tips/en/zoom-devtools-content" class="other-tip-image">
<img loading="lazy" src="/assets/img/zoom-devtools-content.gif" alt="Animation showing the UI of Chrome DevTools being zoomed in and out.">
</a>
</li><li>
<a href="/tips/en/debugger-statement">Use the debugger statement to pause script execution</a>
<a href="/tips/en/debugger-statement" class="other-tip-image">
<img loading="lazy" src="/assets/img/debugger-statement.png" alt="The Sources panel in Edge, paused at a debugger statement.">
</a>
</li></ul>
</div><div class="tip-footer"><div class="authors">Authors: <span><a href="https://patrickbrosset.com">Patrick Brosset</a></span></div>
</div><div class="tip-footer"><div class="authors">Authors: <span><a href="https://patrickbrosset.com">Patrick Brosset</a>, <a href="https://kilianvalkhof.com">Kilian Valkhof</a></span></div>
<p class="last-edit">Last edit: <time datetime="2023-05-02T00:00:00.000Z">5/2/2023</time> - <a href="https://github.com/captainbrosset/devtools-tips/edit/main/./src/tips/en/debug-print-css-styles.md">Edit page</a></p></div>
<script async src="/assets/dialog-lightbox.js"></script>

Expand Down
6 changes: 3 additions & 3 deletions tips/en/emulate-color-schemes/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -107,9 +107,9 @@ <h3>See also</h3>
<img loading="lazy" src="/assets/img/replay-xhr.png" alt="Chrome&#39;s Network tool, with the Replay XHR contextual menu item">
</a>
</li><li>
<a href="/tips/en/debug-print-css-styles">Debug your print CSS styles by simulating print media</a>
<a href="/tips/en/debug-print-css-styles" class="other-tip-image">
<img loading="lazy" src="/assets/img/debug-print-css-styles-firefox.png" alt="Firefox, with DevTools open, showing the Inspector tool, with the print media button">
<a href="/tips/en/detect-low-color-contrast">Detect low color contrast issues</a>
<a href="/tips/en/detect-low-color-contrast" class="other-tip-image">
<img loading="lazy" src="/assets/img/detect-low-color-contrast-css-overview.png" alt="The CSS Overview panel in Chrome, showing the color contrast issues section.">
</a>
</li></ul>
</div><div class="tip-footer"><div class="authors">Authors: <span><a href="https://patrickbrosset.com">Patrick Brosset</a></span></div>
Expand Down
10 changes: 5 additions & 5 deletions tips/en/find-expensive-selectors/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,11 +73,6 @@ <h3>See also</h3>
<a href="/tips/en/debug-css-cascade-layers" class="other-tip-image">
<img loading="lazy" src="/assets/img/debug-css-cascade-layers-firefox.png" alt="Firefox showing a demo page that uses layers and devtools opened, showing the Rules panel with 2 @layer rules.">
</a>
</li><li>
<a href="/tips/en/debug-print-css-styles">Debug your print CSS styles by simulating print media</a>
<a href="/tips/en/debug-print-css-styles" class="other-tip-image">
<img loading="lazy" src="/assets/img/debug-print-css-styles-firefox.png" alt="Firefox, with DevTools open, showing the Inspector tool, with the print media button">
</a>
</li><li>
<a href="/tips/en/highlight-matching-elements">Highlight all the elements that a CSS rule matches</a>
<a href="/tips/en/highlight-matching-elements" class="other-tip-image">
Expand All @@ -88,6 +83,11 @@ <h3>See also</h3>
<a href="/tips/en/inspect-css-animations" class="other-tip-image">
<img loading="lazy" src="/assets/img/inspect-css-animation.gif" alt="Animation of Chrome devtools showing how to inspect and modify CSS animations using the Animation inspector.">
</a>
</li><li>
<a href="/tips/en/jump-to-css-variable">Jump from a CSS variable usage to where it is defined</a>
<a href="/tips/en/jump-to-css-variable" class="other-tip-image">
<img loading="lazy" src="/assets/img/jump-to-css-variable.gif" alt="Animation of clicking on a custom property link in the Styles panel in Edge.">
</a>
</li></ul>
</div><div class="tip-footer"><div class="authors">Authors: <span><a href="https://patrickbrosset.com">Patrick Brosset</a></span></div>
<p class="last-edit">Last edit: <time datetime="2022-12-14T00:00:00.000Z">12/14/2022</time> - <a href="https://github.com/captainbrosset/devtools-tips/edit/main/./src/tips/en/find-expensive-selectors.md">Edit page</a></p></div>
Expand Down
5 changes: 0 additions & 5 deletions tips/en/format-console-messages/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,11 +64,6 @@ <h2 class="tip-title">Format console messages</h2>
</div><div class="see-also">
<h3>See also</h3>
<ul><li>
<a href="/tips/en/debug-print-css-styles">Debug your print CSS styles by simulating print media</a>
<a href="/tips/en/debug-print-css-styles" class="other-tip-image">
<img loading="lazy" src="/assets/img/debug-print-css-styles-firefox.png" alt="Firefox, with DevTools open, showing the Inspector tool, with the print media button">
</a>
</li><li>
<a href="/tips/en/copy-element-styles">Copy an elements styles</a>
<a href="/tips/en/copy-element-styles" class="other-tip-image">
<img loading="lazy" src="/assets/img/copy-element-styles.png" alt="The Edge DevTools Elements panel, showing the context menu on an element and the Copy styles menu item. The screenshot also shows what the result of copying styles is: a flat list of CSS properties and values.">
Expand Down
Loading

0 comments on commit 8db5de3

Please sign in to comment.