|
|
(48 intermediate revisions by the same user not shown) |
Line 1: |
Line 1: |
| __NOTOC__ | | __NOTOC__ |
− | ==Typography== | + | ===Test Objects=== |
| + | * [[Testing]] |
| + | * [[Mainpage-Sandbox]] |
| | | |
− | {| width="100%" |
| + | <hr class="stylish2"> |
− | | width="50%" |
| |
− | <abbr>I18N</abbr> abbr<br>
| |
− | <strong>Bold</strong> bold<br>
| |
− | <cite>Citation</cite> cite<br>
| |
− | <code>Hello World!</code> code<br>
| |
− | <del>Deleted</del> del<br>
| |
− | <em>Emphasis</em> em<br>
| |
− | <i>Italic</i> i<br>
| |
− | <ins>Inserted</ins> ins<br>
| |
− | <kbd>Ctrl + S</kbd> kbd
| |
− | |
| |
− | <mark>Highlighted</mark> mark<br>
| |
− | <s>Strikethrough</s> s<br>
| |
− | <samp>Sample</samp> samp<br>
| |
− | Text <sub>Subscripted</sub> sub<br>
| |
− | Text <sup>Superscripted</sup> sup<br>
| |
− | <time>20:00</time> time<br>
| |
− | <u>Underline</u> u<br>
| |
− | <var>x = y + 2</var> var
| |
− | |}
| |
| | | |
− | ===Syntax Highlight=== | + | ===Elements=== |
| + | * [[Dashboard]] |
| + | * [[Web Element: Article]] |
| + | * [[Web Element: Blog Post List Item]] |
| + | * [[Web Element: Dashboard Box]] |
| + | * [[Web Element: Data]] |
| + | * [[Web Element: Download Box]] |
| + | * [[Web Element: Google Chart]] |
| + | * [[Web Element: Image]] |
| + | * [[Web Element: Margin Note]] |
| + | * [[Web Element: Math]] |
| + | * [[Web Element: People Info]] |
| + | * [[Web Element: Research Box]] |
| + | * [[Web Element: Section]] |
| + | * [[Web Element: Syntax Highlight]] |
| + | * [[Web element: Table]] |
| + | * [[Web Element: Timeline]] |
| + | * [[Web Element: Typography]] |
| + | * [[Web Element: Map]] |
| + | * [[Web Element: Vega Lite]] |
| + | * [[Web Element: D3.js]] |
| | | |
− | <syntaxhighlight lang="Python" line='line'> | + | <hr class="stylish2"> |
− | def quickSort(arr):
| |
− | less = []
| |
− | pivotList = []
| |
− | more = []
| |
− | if len(arr) <= 1:
| |
− | return arr
| |
− | else:
| |
− | pass
| |
− | </syntaxhighlight>
| |
| | | |
− | ===Download Box=== | + | ===The Color=== |
| | | |
− | <html>
| + | * .is-my-red {color: #bf360c;} <span class="is-my-red">SAMPLE</span> |
− | <div class="" style="background:#f9f9f9;padding:10px;border-left:2px #999 solid; margin-bottom:20px;">
| + | * .is-your-red {color: #870000;} <span class="is-your-red">SAMPLE</span> |
− | <a href="#"><div class="" style="float:right;"><i class="fa fa-download" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div></a>
| + | * For more: [https://material.io/tools/color/#!/?view.left=1&view.right=0&primary.color=BF360C Google Colors] |
− | <div class="" style="float:left;"><i class="fa fa-file-pdf-o" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div>
| |
− | <div class="" style="margin-left: 30px;"><span class="tk-futura-pt">spectre-docs.pdf</span></div>
| |
− | <div class="" style="margin-left: 30px;color:#999;font-size:80%;margin-top:-7px;"><span class="is-small tk-futura-pt">14MB•Public•1 Jan, 2017</span></div>
| |
− | </div>
| |
− | | |
− | <div class="" style="background:#f9f9f9;padding:10px;border-left:2px #999 solid; margin-bottom:20px;">
| |
− | <a href="#"><div class="" style="float:right;"><i class="fa fa-download" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div></a>
| |
− | <div class="" style="float:left;"><i class="fa fa-file-excel-o" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div>
| |
− | <div class="" style="margin-left: 30px;"><span class="tk-futura-pt">another-doc.xls</span></div>
| |
− | <div class="" style="margin-left: 30px;color:#999;font-size:80%;margin-top:-7px;"><span class="is-small tk-futura-pt">11MB•Private•1 Jan, 2019</span></div>
| |
− | </div>
| |
− | </html>
| |
− | | |
− | ===Steps===
| |
− | | |
− | <html>
| |
− | <div class="steps is-small">
| |
− | <div class="step-item">
| |
− | <div class="step-marker">1</div>
| |
− | <div class="step-details">
| |
− | <p class="step-title">Step 1</p>
| |
− | <p>This is the first step of the process.</p>
| |
− | </div>
| |
− | </div>
| |
− | <div class="step-item">
| |
− | <div class="step-marker">2</div>
| |
− | <div class="step-details">
| |
− | <p class="step-title">Step 2</p>
| |
− | <p>This is the second step. You get here once you have completed the first step.</p>
| |
− | </div>
| |
− | </div>
| |
− | <div class="step-item">
| |
− | <div class="step-marker">3</div>
| |
− | <div class="step-details">
| |
− | <p class="step-title">Step 3</p>
| |
− | <p>This is the third step. One more step before the end.</p>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </html>
| |
− | | |
− | ===People Info===
| |
− | | |
− | <html>
| |
− | <div class="" style="width:100%;background:#f9f9f9;padding:10px;border-left:2px #999 solid;">
| |
− | <a href="https://en.wikipedia.org/wiki/Charles_Darwin" target="_blank"><div class="" style="float:right;"><i class="fa fa-external-link" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div></a>
| |
− | <div class="" style="float:left;"><i class="fa fa-male" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div>
| |
− | <div class="" style="margin-left: 30px;"><span class="tk-futura-pt">Charles Darwin</span></div>
| |
− | <div class="" style="margin-left: 30px;color:#999;font-size:80%;margin-top:-7px;"><span class="is-small tk-futura-pt">Naturalist, Geologist, Biologist•1809-1882</span></div>
| |
− | </div>
| |
− | <br>
| |
− | <div class="" style="width:100%;background:#f9f9f9;padding:10px;border-left:2px #999 solid;">
| |
− | <a href="#"><div class="" style="float:right;"><i class="fa fa-external-link" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div></a>
| |
− | <div class="" style="float:left;"><i class="fa fa-female" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i></div>
| |
− | <div class="" style="margin-left: 30px;"><span class="tk-futura-pt">Jane Doe</span></div>
| |
− | <div class="" style="margin-left: 30px;color:#999;font-size:80%;margin-top:-7px;"><span class="is-small tk-futura-pt">Opportunist•1981-</span></div>
| |
− | </div>
| |
− | | |
− | </html>
| |
− | | |
− | ===Box List===
| |
− | | |
− | ====Box Template====
| |
− | | |
− | {{Template:Box}}
| |
− | | |
− | {{Template:Box|1512|ESOLANG|Weird Computer Programming Language Codex}}
| |
− | | |
− | <html>
| |
− | <div class="" style="width:100%;background:#f9f9f9;padding:10px;border-left:2px #999 solid;margin-bottom: 20px;">
| |
− | <a href="#" target="_blank">
| |
− | <div class="" style="float:right;">
| |
− | <i class="fa fa-archive" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i>
| |
− | </div>
| |
− | </a>
| |
− | <div class="" style="float:left; text-align: center;">
| |
− | <span class="has-text-weight-bold tk-futura-pt">1512</span>
| |
− | </div>
| |
− | <div class="" style="margin-left: 50px;">
| |
− | <span class="has-text-weight-bold tk-futura-pt">ESOLANG</span>
| |
− | </div>
| |
− | <div class="" style="margin-left: 50px;color:#999;font-size:80%;margin-top:-7px;">
| |
− | <span class="is-small tk-futura-pt">Weird Computer Programming Language Codex</span>
| |
− | </div>
| |
− | </div>
| |
− | <div class="" style="width:100%;background:#f9f9f9;padding:10px;border-left:2px #999 solid;margin-bottom: 20px;">
| |
− | <a href="#" target="_blank">
| |
− | <div class="" style="float:right;">
| |
− | <i class="fa fa-archive" aria-hidden="true" style="margin-top: 10px;margin-left: 0px;font-size: 150%;"></i>
| |
− | </div>
| |
− | </a>
| |
− | <div class="" style="float:left; text-align: center;">
| |
− | <span class="tk-futura-pt">1512</span>
| |
− | </div>
| |
− | <div class="" style="margin-left: 50px;">
| |
− | <span class="tk-futura-pt">ESOLANG</span>
| |
− | </div>
| |
− | <div class="" style="margin-left: 50px;color:#999;font-size:80%;margin-top:-7px;">
| |
− | <span class="is-small tk-futura-pt">Weird Computer Programming Language Codex</span>
| |
− | </div>
| |
− | </div>
| |
− | </html>
| |
− | | |
− | ===Blog Post List===
| |
− | <html>
| |
− | <div class="columns" style="max-height:151px;">
| |
− | <div class="column is-one-fifth"><span class="is-small tk-futura-pt" style="color:#999;font-size:80%;">August 18, 2019</span></div>
| |
− | <div class="column">
| |
− | <div class="category"><span class="tk-futura-pt" style="font-size:80%;">LOGBOOK</span></div>
| |
− | <h5 style="margin-top: 0px; font-weight: bold;">The Met Reviews Items It Received From a Dealer, Now a Looting Suspect</h5>
| |
− | <p style="margin-top: -10px;line-height:1.2;">The Metropolitan Museum of Art is studying the Indian artifacts it holds that track back to a man accused of running a major antiquities smuggling ring.</p></div>
| |
− | <div class="column is-one-quarter"><img src="https://static01.nyt.com/images/2019/08/19/arts/18metindia1/18metindia1-mediumThreeByTwo210.jpg?quality=100&auto=webp"/></div>
| |
− | </div>
| |
− | <hr>
| |
− | <div class="columns" style="max-height:151px;">
| |
− | <div class="column is-one-fifth"><span class="is-small tk-futura-pt" style="color:#999;font-size:80%;">August 18, 2019</span></div>
| |
− | <div class="column">
| |
− | <div class="category"><span class="tk-futura-pt" style="font-size:80%;">RESEARCH</span></div>
| |
− | <h5 style="margin-top: 0px; font-weight: bold;">The Met Reviews Items It Received From a Dealer, Now a Looting Suspect</h5>
| |
− | <p style="margin-top: -10px;line-height:1.2;">The Metropolitan Museum of Art is studying the Indian artifacts it holds that track back to a man accused of running a major antiquities smuggling ring.</p></div>
| |
− | <div class="column is-one-quarter"><img src="https://static01.nyt.com/images/2019/08/19/arts/18metindia1/18metindia1-mediumThreeByTwo210.jpg?quality=100&auto=webp"/></div>
| |
− | </div>
| |
− | <hr>
| |
− | </html>
| |
− | | |
− | | |
− | | |
− | <!-- ********************************** -->
| |
− | <nowiki>
| |
− | {{Top}}
| |
− | {{References}}
| |
− | [[Category:Logbook]]
| |
− | </nowiki>
| |