Skip to content

Commit

Permalink
Make focus mode extension more generic
Browse files Browse the repository at this point in the history
Use a generic selector that will hide all the content outside an
<article>.
  • Loading branch information
sebastianbenz committed Nov 7, 2023
1 parent 9aaa5ca commit 3390430
Showing 1 changed file with 17 additions and 8 deletions.
25 changes: 17 additions & 8 deletions functional-samples/tutorial.focus-mode/focus-mode.css
Original file line number Diff line number Diff line change
Expand Up @@ -14,14 +14,23 @@ See the License for the specific language governing permissions and
limitations under the License.
*/

body > .scaffold > :is(top-nav, navigation-rail, side-nav, footer),
main > :not(:last-child),
main > :last-child > navigation-tree,
main .toc-container {
display: none;
* {
display: none!important
}

main > :last-child {
margin-top: min(10vmax, 10rem);
margin-bottom: min(10vmax, 10rem);
html,
body,
*:has(article),
article,
article * {
display: revert!important;
}

[role=navigation] {
display: none!important
}

article {
margin: auto;
max-width: 700px;
}

0 comments on commit 3390430

Please sign in to comment.