首页美化(1/3)
This commit is contained in:
parent
81ad56139e
commit
f232250491
@ -2,52 +2,164 @@
|
|||||||
|
|
||||||
/** @var yii\web\View $this */
|
/** @var yii\web\View $this */
|
||||||
|
|
||||||
$this->title = 'My Yii Application';
|
use app\assets\TSParticlesAsset;
|
||||||
|
use yii\helpers\Url;
|
||||||
|
|
||||||
|
$this->title = '首页';
|
||||||
|
TSParticlesAsset::register($this);
|
||||||
?>
|
?>
|
||||||
<div class="site-index">
|
<div id="tsparticles" style="position: absolute;width: 100%;height: 100%;z-index: -1"></div>
|
||||||
|
<div class="site-index">
|
||||||
|
<div class="jumbotron text-center bg-transparent mt-5 mb-5">
|
||||||
|
<?php if (Yii::$app->user->isGuest): ?>
|
||||||
|
<h1 class="display-4">这里是<?= Yii::$app->name ?>的首页</h1>
|
||||||
|
<p>你需要登录或注册账户才能访问更多内容</p>
|
||||||
|
<p><a class="btn btn-lg btn-primary" href="<?= Url::to(['/user/register']) ?>">注册账户</a></p>
|
||||||
|
<p><a class="btn btn-lg btn-success" href="<?= Url::to(['/user/login']) ?>">登录账户</a></p>
|
||||||
|
<?php elseif (Yii::$app->user->can('user')): ?>
|
||||||
|
<p>系统公告</p>
|
||||||
|
<div class="body-content">
|
||||||
|
|
||||||
<div class="jumbotron text-center bg-transparent mt-5 mb-5">
|
<div class="row">
|
||||||
<h1 class="display-4">这里是网盘的首页</h1>
|
<div class="col-lg-4 mb-3">
|
||||||
|
<h2>Heading</h2>
|
||||||
|
|
||||||
<p class="lead">内容还在建设中</p>
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
|
||||||
|
incididunt ut
|
||||||
|
labore
|
||||||
|
et
|
||||||
|
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||||
|
nisi
|
||||||
|
ut
|
||||||
|
aliquip
|
||||||
|
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||||
|
cillum
|
||||||
|
dolore eu
|
||||||
|
fugiat nulla pariatur.</p>
|
||||||
|
|
||||||
<p><a class="btn btn-lg btn-success" href="https://www.yiiframework.com">Get started with Yii</a></p>
|
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/doc/">Yii
|
||||||
</div>
|
Documentation
|
||||||
|
»</a></p>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-4 mb-3">
|
||||||
|
<h2>Heading</h2>
|
||||||
|
|
||||||
<div class="body-content">
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
|
||||||
|
incididunt ut
|
||||||
|
labore
|
||||||
|
et
|
||||||
|
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||||
|
nisi
|
||||||
|
ut
|
||||||
|
aliquip
|
||||||
|
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||||
|
cillum
|
||||||
|
dolore eu
|
||||||
|
fugiat nulla pariatur.</p>
|
||||||
|
|
||||||
<div class="row">
|
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/forum/">Yii Forum
|
||||||
<div class="col-lg-4 mb-3">
|
»</a>
|
||||||
<h2>Heading</h2>
|
</p>
|
||||||
|
</div>
|
||||||
|
<div class="col-lg-4">
|
||||||
|
<h2>Heading</h2>
|
||||||
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
|
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
|
||||||
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
|
incididunt ut
|
||||||
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
|
labore
|
||||||
fugiat nulla pariatur.</p>
|
et
|
||||||
|
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris
|
||||||
|
nisi
|
||||||
|
ut
|
||||||
|
aliquip
|
||||||
|
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||||
|
cillum
|
||||||
|
dolore eu
|
||||||
|
fugiat nulla pariatur.</p>
|
||||||
|
|
||||||
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/doc/">Yii Documentation »</a></p>
|
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/extensions/">Yii
|
||||||
</div>
|
Extensions
|
||||||
<div class="col-lg-4 mb-3">
|
»</a></p>
|
||||||
<h2>Heading</h2>
|
</div>
|
||||||
|
</div>
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
|
</div>
|
||||||
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
|
<?php else: ?>
|
||||||
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
|
<p>你已经登录,欢迎回来</p>
|
||||||
fugiat nulla pariatur.</p>
|
<?php endif; ?>
|
||||||
|
|
||||||
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/forum/">Yii Forum »</a></p>
|
|
||||||
</div>
|
|
||||||
<div class="col-lg-4">
|
|
||||||
<h2>Heading</h2>
|
|
||||||
|
|
||||||
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et
|
|
||||||
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
|
|
||||||
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
|
|
||||||
fugiat nulla pariatur.</p>
|
|
||||||
|
|
||||||
<p><a class="btn btn-outline-secondary" href="https://www.yiiframework.com/extensions/">Yii Extensions »</a></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<?php
|
||||||
|
$js = <<<JS
|
||||||
|
async function loadParticles(options) {
|
||||||
|
await tsParticles.load({ id: "tsparticles", options });
|
||||||
|
}
|
||||||
|
|
||||||
|
const configs = {
|
||||||
|
fpsLimit: 144,
|
||||||
|
particles: {
|
||||||
|
number: {
|
||||||
|
value: 100,
|
||||||
|
density: {
|
||||||
|
enable: true,
|
||||||
|
area: 800
|
||||||
|
}
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
value: ["#2EB67D", "#ECB22E", "#E01E5B", "#36C5F0"]
|
||||||
|
},
|
||||||
|
shape: {
|
||||||
|
type: "circle"
|
||||||
|
},
|
||||||
|
opacity: {
|
||||||
|
value: 0.4
|
||||||
|
},
|
||||||
|
size: {
|
||||||
|
value: { min: 4, max: 8 }
|
||||||
|
},
|
||||||
|
links: {
|
||||||
|
enable: true,
|
||||||
|
distance: 150,
|
||||||
|
color: "#808080",
|
||||||
|
opacity: 0.4,
|
||||||
|
width: 1
|
||||||
|
},
|
||||||
|
move: {
|
||||||
|
enable: true,
|
||||||
|
speed: 3,
|
||||||
|
outModes: {
|
||||||
|
default: "out"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
interactivity: {
|
||||||
|
events: {
|
||||||
|
onHover: {
|
||||||
|
enable: true,
|
||||||
|
mode: "grab"
|
||||||
|
},
|
||||||
|
onClick: {
|
||||||
|
enable: true,
|
||||||
|
mode: "push"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
modes: {
|
||||||
|
grab: {
|
||||||
|
distance: 280,
|
||||||
|
links: {
|
||||||
|
opacity: 1,
|
||||||
|
color: "#808080"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
push: {
|
||||||
|
quantity: 4
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
loadParticles(configs);
|
||||||
|
|
||||||
|
JS;
|
||||||
|
|
||||||
|
$this->registerJs($js);
|
||||||
|
?>
|
Loading…
Reference in New Issue
Block a user