UserCSS:プレゼンテーションモード
プレゼンテーションモード
code:css
.presentation {
}
プレゼンテーションモードページ区切り用のclass
code:css
.section-title{
}
.presentation .line.section-title {
}
code:stylexx.css
.presentation .line.section-title {
color: #39ac86; /* green */
}
/villagepump/presentation mode用CSS
code:stylexx.css
htmldata-display-style*="presentation" body {
background-color: var(--page-bg, #fefefe);
}
.app.presentation .navbar,
.app.presentation .quick-launch,
.app.presentation .related-page-list,
.app.presentation .telomere,
.app.presentation .status-bar {
display: none;
}
.app.presentation .page {
box-shadow: none;
opacity: 0.8;
transition: opacity 0.5s;
}
.app.presentation .line {
font-size: 3vw;
line-height: 1.2em;
word-break: auto-phrase;
}
.app.presentation .editor .line-title .text {
font-size: 6vw;
margin-bottom: 0.5em;
text-align: center;
}
.app.presentation .line .text:not(.section-title):not(.code-block) {
margin-bottom: 10px;
}
.app.presentation .line img {
zoom: 150%;
}
.app.presentation .line .code-block {
line-height: 1em;
background-color: var(--code-bg, rgba(0, 0, 0, 0.04));
}
.app.presentation .line .code-block code {
font-size: 0.6em;
}
.app.presentation .line .code-block code.code-body {
margin-left: -0.9em;
}
.app.presentation .line .dot {
width: 0.5vw;
height: 0.5vw;
top: calc(0.6em - 0.25vw);
right: 1vw;
}
.app.presentation .line.section-title {
font-size: 6vw;
margin-bottom: 0.5em;
text-align: center;
}
.app.presentation .line.section-title:not(:first-child) {
page-break-before: always;
}
@media print {
.app.presentation .line {
display: block !important;
}
}
.app.presentation .shared-cursors .cursor {
font-size: 5vw;
line-height: 1.5em;
background-color: var(--accent-color);
}
.app.presentation .col-page {
min-width: 80vw;
max-width: 130vh;
}
.app.presentation .col-page-side {
opacity: 0;
transition: opacity 0.5s;
}
.app.presentation .col-page-side:hover {
opacity: 1;
}
htmldata-os*="android" .app.presentation .line,
.app.presentationdata-os*="android" .line {
display: block;
}
htmldata-os*="android" .app.presentation .section-title:not(:first-child),
.app.presentationdata-os*="android" .section-title:not(:first-child) {
margin-top: 50vh;
}
htmldata-os*="ios" .app.presentation .line,
.app.presentationdata-os*="ios" .line {
display: block;
}
htmldata-os*="ios" .app.presentation .section-title:not(:first-child),
.app.presentationdata-os*="ios" .section-title:not(:first-child) {
margin-top: 50vh;
}
/* ... */
htmldata-display-style*="presentation" .text-input {
font-size: 3vw;
}
htmldata-display-style*="presentation" .text-input.line-title {
font-size: 6vw;
}
code:stylexx.css
htmldata-display-style*="presentation" body {
background-color: pink ;
}
code:style.css
.app.presentation .page {
box-shadow: none;
opacity: 0.7;
transition: opacity 0.1s;
}
code:stylexx.css
htmldata-display-style*="presentation" body {
background-color: var(--page-bg, #fefefe);
@media only screen and (min-width: 960px) {
content: "";
/* background-image: url('/api/pages/suto3scratchpad/クオリアさん/icon'); */
/* background-image: url('/api/pages/suto3scratchpad/Qualia-san/icon'); /* */
background-image: url('/api/pages/qualia-san/Qualia-san/icon');
background-size: 255px 255px; /* */
display: block;
width: 255px;
height: 255px;
position: fixed;
right: 0px;
bottom: 0px;
}
}
Scrapbox:モード
Scrapbox:プレゼンテーションモード - Scrapbox:presentation mode
Scrapbox:セクション - Scrapbox:section
Scrapbox:section-title
Scrapbox:presentation
https://img.shields.io/badge/UserCSS-プレゼンテーションモード-1572B6.svg?logo=css3&style=for-the-badge
UserCSS.icon