styling
This commit is contained in:
parent
59c1094f97
commit
aec519c427
|
@ -17,8 +17,8 @@
|
|||
|
||||
<body>
|
||||
|
||||
<ul class="lasdist">
|
||||
<div class="card derp" _="on click toggle .trunc on me">
|
||||
<ul class="list">
|
||||
<div class="card trunc" _="on click toggle .trunc on me">
|
||||
<img class="icon" src="nextcloud_icon_14.png">
|
||||
<h3>Nextcloud</h3>
|
||||
<p class="text">
|
||||
|
@ -72,16 +72,58 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card trunc" _="on click toggle .trunc on me">
|
||||
<img class="icon" src="nextcloud_icon_14.png">
|
||||
<h3>Nextcloud</h3>
|
||||
<p class="text">
|
||||
Mollis, ante non euismod ornare, orci diam ornare orci, eu mattis
|
||||
tortor lectus at erat. Nam rutrum erat nec euismod lacinia. Curabitur
|
||||
et velit ut mauris euismod tempus. Fusce pharetra augue lectus, quis
|
||||
maximus quam auctor pellentesque.
|
||||
Nextcloud is a suite of client-server software for creating and using file
|
||||
hosting services. Our nextcloud server is integrated with OnlyOffice and can provide functionality similar to
|
||||
Dropbox, Office 365 or Google Drive.
|
||||
</p>
|
||||
<a class="footer" href="https://cloud.sondell.org">web app</a>
|
||||
<div class="footer" _="on click halt the event's bubbling">
|
||||
<h4>Get started</h4>
|
||||
<p>
|
||||
Download the app for your device and login with the server adress:
|
||||
<code class="link">
|
||||
https://cloud.sondell.org/
|
||||
</code>
|
||||
<button
|
||||
style="font:inherit;font-size:.8em;background:#3465a4;color:white;border:none;padding: 0 .4em; border-radius: .4em"
|
||||
_="on click
|
||||
writeText(my previousElementSibling's innerText) into navigator's clipboard
|
||||
put 'copied!' into me
|
||||
wait 1s
|
||||
put 'copy' into me">
|
||||
copy
|
||||
</button>
|
||||
</p>
|
||||
<span>
|
||||
|
||||
<a class="app-link" href="https://nextcloud.com/install/#card-clients-btns">
|
||||
<img src="./desktop.svg" height="40">
|
||||
</a>
|
||||
|
||||
<a class="app-link" href= "https://play.google.com/store/apps/details?id=com.nextcloud.client" rel="nofollow">
|
||||
<img src="./googleplay-trim.png" alt="Download from Google Play" height="40"
|
||||
data-canonical-src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png"
|
||||
style="max-width: 100%;">
|
||||
</a>
|
||||
|
||||
<a class="app-link" href="https://itunes.apple.com/us/app/nextcloud/id1125420102" rel="nofollow">
|
||||
<img
|
||||
src="https://camo.githubusercontent.com/c4395f930c17c2f878dbd98b55d461375f6feb7a998e0ac6e3be2376b8429b8a/68747470733a2f2f646576656c6f7065722e6170706c652e636f6d2f6173736574732f656c656d656e74732f6261646765732f646f776e6c6f61642d6f6e2d7468652d6170702d73746f72652e737667"
|
||||
alt="the Nextcloud iOS files app" height="40"
|
||||
data-canonical-src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
|
||||
style="max-width: 100%;">
|
||||
</a>
|
||||
<a class="app-link" href="https://itunes.apple.com/us/app/nextcloud/id1125420102" rel="nofollow">
|
||||
<img src="./pwa-badge.png" alt="Demo of the Nextcloud iOS files app" height="40"
|
||||
data-canonical-src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg"
|
||||
style="max-width: 100%;">
|
||||
</a>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
</body>
|
||||
|
|
|
@ -1,3 +1,7 @@
|
|||
body {
|
||||
padding-left: 2%;
|
||||
}
|
||||
|
||||
.icon {
|
||||
height: 100px;
|
||||
float: left;
|
||||
|
@ -15,15 +19,17 @@
|
|||
}
|
||||
|
||||
.list {
|
||||
display: flex;
|
||||
/* display: flex; */
|
||||
flex-direction: column;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
.card {
|
||||
border: 1px solid #1948e3;
|
||||
border-radius: 25px;
|
||||
margin: 0 auto;
|
||||
margin: 0 0 0 0;
|
||||
padding: 1em;
|
||||
max-width: 40em;
|
||||
|
||||
&:hover {
|
||||
background-color: lightblue;
|
||||
|
|
Loading…
Reference in a new issue