mirror of https://github.com/IoTcat/sakura2.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
93 lines
4.3 KiB
93 lines
4.3 KiB
<!DOCTYPE html> |
|
<html> |
|
|
|
<head> |
|
<title>Sakura v2</title> |
|
<link rel="stylesheet" href="./dist/bundle.css"> |
|
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons"> |
|
</head> |
|
|
|
<body> |
|
<div id="root"> |
|
<!--page main content (async container)--> |
|
<div class="header-container"> |
|
<header id="nav-header" class="mdc-top-app-bar mdc-top-app-bar--dense"> |
|
<!--nav mune--> |
|
<div class="mdc-top-app-bar__row"> |
|
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start"> |
|
<button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button">menu</button> |
|
<span class="mdc-top-app-bar__title">Sakura</span> |
|
</section> |
|
<section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar"> |
|
<button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" |
|
aria-label="Download">file_download</button> |
|
<button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" |
|
aria-label="Print this page">print</button> |
|
<button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" |
|
aria-label="Bookmark this page">bookmark</button> |
|
</section> |
|
</div> |
|
</header> |
|
</div> |
|
|
|
<div class="header-top"> |
|
<!--index cover image--> |
|
<figure data="mark" id="cover-img-container"> |
|
<div data="layer" id="img-view" data-depth="0.5"> |
|
<img data="cover" id="cover-img" src="https://api.2heng.xin/cover/"> |
|
</div> |
|
</figure> |
|
<div class="cover-video-container"></div> |
|
</div> |
|
|
|
<div id="header-top-after"></div> |
|
|
|
<div class="page-content"> |
|
<aside class="side-bar-left">left</aside> |
|
<section class="main-center"> |
|
<div class="post-list"> |
|
<div class="mdc-card demo-card demo-basic-with-text-over-media"> |
|
<div class="mdc-card__primary-action demo-card__primary-action" tabindex="0"> |
|
<div class="mdc-card__media mdc-card__media--16-9 demo-card__media" |
|
style="background-image: url("https://material-components.github.io/material-components-web-catalog/static/media/photos/3x2/2.jpg");"> |
|
<div class="mdc-card__media-content demo-card__media-content"> |
|
<div class="demo-card__primary"> |
|
<h2 class="demo-card__title mdc-typography mdc-typography--headline6">Our Changing Planet</h2> |
|
<h3 class="demo-card__subtitle mdc-typography mdc-typography--subtitle2">by Kurt Wagner</h3> |
|
</div> |
|
</div> |
|
</div> |
|
<div class="demo-card__secondary mdc-typography mdc-typography--body2">Visit ten places on our planet that |
|
are undergoing the biggest changes today.</div> |
|
</div> |
|
<div class="mdc-card__actions"> |
|
<div class="mdc-card__action-buttons"> |
|
<button class="mdc-button mdc-card__action mdc-card__action--button">Read</button> |
|
<button class="mdc-button mdc-card__action mdc-card__action--button">Bookmark</button> |
|
</div> |
|
<div class="mdc-card__action-icons"> |
|
<button class="mdc-icon-button mdc-card__action mdc-card__action--icon--unbounded" aria-pressed="false" |
|
aria-label="Add to favorites" title="Add to favorites"> |
|
<i class="material-icons mdc-icon-button__icon mdc-icon-button__icon--on">favorite</i> |
|
<i class="material-icons mdc-icon-button__icon">favorite_border</i> |
|
</button> |
|
<button class="mdc-icon-button material-icons mdc-card__action mdc-card__action--icon--unbounded" |
|
title="Share" data-mdc-ripple-is-unbounded="true">share</button> |
|
<button class="mdc-icon-button material-icons mdc-card__action mdc-card__action--icon--unbounded" |
|
title="More options" data-mdc-ripple-is-unbounded="true">more_vert</button> |
|
</div> |
|
</div> |
|
</div> |
|
</div> |
|
</section> |
|
<aside class="side-bar-right">right</aside> |
|
</div> |
|
|
|
<div class="footer-container"></div> |
|
|
|
</div> |
|
|
|
<script src="./dist/bundle.js" async></script> |
|
</body> |
|
|
|
</html> |