728/ismism
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

content

Browse Source
This commit is contained in:
728
2022-08-25 15:20:02 +08:00
parent f3f797746b
commit ddcba8cafa
1 changed files with 129 additions and 109 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
ismism.ts/ui/index.html
View File

@ -87,6 +87,9 @@
header {
padding-top: 32px;
padding-bottom: 16px;
max-width: 1140px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
@ -140,10 +143,6 @@
opacity: 0.7;
}
.padding {
padding: 0.01em 16px;
}
.banner {
position: relative;
padding: 0.01em 16px;
@ -160,6 +159,29 @@
top: 0
}
.content {
display: flex;
flex-flow: row wrap;
justify-content: center;
margin-left: auto;
margin-right: auto;
max-width: 1400px;
min-width: 320px;
}
.content-main {
display: inline-block;
flex-grow: 1;
max-width: 960px;
}
.content-side {
display: inline-block;
flex-grow: 1;
min-width: 320px;
max-width: 960px;
}
.animate-left {
position: relative;
animation: animateleft 0.4s
@ -220,121 +242,119 @@
</div>
</header>
<div class="w3-content w3-animate-right" style="max-width:1400px">
<div class="w3-row">
<div class="w3-col l8 s12">
<div class="w3-card-4 w3-margin w3-white">
<div class="w3-container">
<a href="#1">
<h3><code class="w3-dark-grey w3-tag w3-round">#1</code> <b>星星家园扩建</b>
</h3>
</a>
<div><a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#设施建设">设施建设</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#设施建设">物资配给</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#苏州">苏州</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
</div>
<div class="w3-margin-bottom w3-small">
<i><code>公示时间：2022-08-12 12:32<br>
更新时间：2022-08-12 12:32</code></i>
</div>
<div class="content animate-right">
<div class="content-main">
<div class="w3-card-4 w3-margin w3-white">
<div class="w3-container">
<a href="#1">
<h3><code class="w3-dark-grey w3-tag w3-round">#1</code> <b>星星家园扩建</b>
</h3>
</a>
<div><a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#设施建设">设施建设</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#设施建设">物资配给</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#苏州">苏州</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
<a class="w3-button w3-margin-bottom w3-padding-small w3-hover-dark-grey w3-round w3-border w3-border-dark-grey"
href="#星星家园">星星家园</a>
</div>
<img src="https://www.w3schools.com/w3images/woods.jpg" alt="Nature" style="width:100%">
<div class="w3-container">
<p>Mauris neque quam, fermentum ut nisl vitae, convallis maximus nisl. Sed mattis nunc id lorem
euismod placerat. Vivamus porttitor magna enim, ac accumsan tortor cursus at. Phasellus sed
ultricies mi non congue ullam corper. Praesent tincidunt sed
tellus ut rutrum. Sed vitae justo condimentum, porta lectus vitae, ultricies congue gravida
diam non fringilla.</p>
<div class="w3-row">
<div class="w3-col m8 s12">
<p><button class="w3-button w3-padding-large w3-white w3-border"><b>READ MORE
»</b></button></p>
</div>
<div class="w3-col m4 w3-hide-small">
<p>
<span class="w3-padding-large w3-right"><b>支持  </b><span
class="w3-tag">1000</span></span>
</p>
</div>
</div>
<div class="w3-margin-bottom w3-small">
<i><code>公示时间：2022-08-12 12:32<br>
更新时间：2022-08-12 12:32</code></i>
</div>
</div>
<hr>
<div class="w3-card-4 w3-margin w3-white">
<div class="w3-container">
<h3><b>BLOG ENTRY</b></h3>
<h5>Title description, <span class="w3-opacity">April 2, 2014</span></h5>
</div>
<img src="https://www.w3schools.com/w3images/bridge.jpg" alt="Norway" style="width:100%">
<img src="https://www.w3schools.com/w3images/woods.jpg" alt="Nature" style="width:100%">
<div class="w3-container">
<p>Mauris neque quam, fermentum ut nisl vitae, convallis maximus nisl. Sed mattis nunc id lorem
euismod placerat. Vivamus porttitor magna enim, ac accumsan tortor cursus at. Phasellus sed
ultricies mi non congue ullam corper. Praesent tincidunt sed
tellus ut rutrum. Sed vitae justo condimentum, porta lectus vitae, ultricies congue gravida
diam non fringilla.</p>
<div class="w3-row">
<div class="w3-col m8 s12">
<p><button class="w3-button w3-padding-large w3-white w3-border"><b>READ MORE
»</b></button></p>
</div>
<div class="w3-col m4 w3-hide-small">
<p><span class="w3-padding-large w3-right"><b>Comments  </b> <span
class="w3-badge">2</span></span></p>
</div>
<div class="w3-container">
<p>Mauris neque quam, fermentum ut nisl vitae, convallis maximus nisl. Sed mattis nunc id lorem
euismod placerat. Vivamus porttitor magna enim, ac accumsan tortor cursus at. Phasellus sed
ultricies mi non congue ullam corper. Praesent tincidunt sed
tellus ut rutrum. Sed vitae justo condimentum, porta lectus vitae, ultricies congue gravida
diam non fringilla.</p>
<div class="w3-row">
<div class="w3-col m8 s12">
<p><button class="w3-button w3-padding-large w3-white w3-border"><b>READ MORE
»</b></button></p>
</div>
<div class="w3-col m4 w3-hide-small">
<p>
<span class="w3-padding-large w3-right"><b>支持  </b><span
class="w3-tag">1000</span></span>
</p>
</div>
</div>
</div>
</div>
<div class="w3-col l4">
<div class="w3-container w3-margin">
<div class="w3-container w3-padding">
<h4>Popular Posts</h4>
</div>
<ul class="w3-ul w3-hoverable">
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/workshop.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Lorem</span><br>
<span>Sed mattis nunc</span>
</li>
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/gondol.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Ipsum</span><br>
<span>Praes tinci sed</span>
</li>
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/skies.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Dorum</span><br>
<span>Ultricies congue</span>
</li>
<li class="w3-padding-16 w3-hide-medium w3-hide-small">
<img src="https://www.w3schools.com//w3images/rock.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Mingsum</span><br>
<span>Lorem ipsum dipsum</span>
</li>
</ul>
<hr>
<div class="w3-card-4 w3-margin w3-white">
<div class="w3-container">
<h3><b>BLOG ENTRY</b></h3>
<h5>Title description, <span class="w3-opacity">April 2, 2014</span></h5>
</div>
<img src="https://www.w3schools.com/w3images/bridge.jpg" alt="Norway" style="width:100%">
<div class="w3-container">
<p>Mauris neque quam, fermentum ut nisl vitae, convallis maximus nisl. Sed mattis nunc id lorem
euismod placerat. Vivamus porttitor magna enim, ac accumsan tortor cursus at. Phasellus sed
ultricies mi non congue ullam corper. Praesent tincidunt sed
tellus ut rutrum. Sed vitae justo condimentum, porta lectus vitae, ultricies congue gravida
diam non fringilla.</p>
<div class="w3-row">
<div class="w3-col m8 s12">
<p><button class="w3-button w3-padding-large w3-white w3-border"><b>READ MORE
»</b></button></p>
</div>
<div class="w3-col m4 w3-hide-small">
<p><span class="w3-padding-large w3-right"><b>Comments  </b> <span
class="w3-badge">2</span></span></p>
</div>
</div>
</div>
</div>
</div>
<div class="content-side">
<div class="w3-container w3-margin">
<div class="w3-container w3-padding">
<h4>Popular Posts</h4>
</div>
<ul class="w3-ul w3-hoverable">
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/workshop.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Lorem</span><br>
<span>Sed mattis nunc</span>
</li>
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/gondol.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Ipsum</span><br>
<span>Praes tinci sed</span>
</li>
<li class="w3-padding-16">
<img src="https://www.w3schools.com//w3images/skies.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Dorum</span><br>
<span>Ultricies congue</span>
</li>
<li class="w3-padding-16 w3-hide-medium w3-hide-small">
<img src="https://www.w3schools.com//w3images/rock.jpg" alt="Image"
class="w3-left w3-margin-right" style="width:50px">
<span class="w3-large">Mingsum</span><br>
<span>Lorem ipsum dipsum</span>
</li>
</ul>
</div>
</div>
</div>