yunzhui-blog
Version:
69 lines (63 loc) • 2.62 kB
HTML
<html lang="zh-CN"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>云坠の小窝 - CDN服务说明</title>
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#6366f1',
secondary: '#4f46e5',
neutral: '#1f2937',
},
fontFamily: {
sans: ['Inter', 'system-ui', 'sans-serif'],
},
}
}
}
</script>
<style type="text/tailwindcss">
@layer utilities {
.text-shadow {
text-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.bg-gradient {
background: linear-gradient(135deg, #6366f1 0%, #4f46e5 100%);
}
}
</style>
</head>
<body class="bg-gray-50 min-h-screen flex flex-col items-center justify-center p-4">
<div class="max-w-md w-full bg-white rounded-xl shadow-lg overflow-hidden transform transition-all duration-300 hover:shadow-xl">
<div class="bg-gradient p-6 text-white text-center">
<i class="fa fa-cloud text-5xl mb-4"></i>
<h1 class="text-2xl font-bold text-shadow">云坠の小窝</h1>
<p class="opacity-90 mt-1">CDN服务说明</p>
</div>
<div class="p-6">
<div class="flex items-center justify-center mb-4">
<div class="flex-shrink-0 mr-3">
<i class="fa fa-info-circle text-primary text-xl"></i>
</div>
<div>
<p class="text-gray-700">此链接为云坠の小窝私有CDN服务</p>
</div>
</div>
<div class="bg-gray-50 rounded-lg p-4 border border-gray-100">
<p class="text-sm text-gray-500 text-center">
<i class="fa fa-lock mr-1"></i> 私人服务，未经允许请勿使用
</p>
</div>
</div>
<div class="bg-gray-50 px-6 py-4 border-t border-gray-100 text-center">
<p class="text-sm text-gray-500">© 云坠の小窝</p>
</div>
</div>
<p class="mt-6 text-sm text-gray-500 text-center">
如有疑问，请联系服务所有者
</p>
</body></html>