biolink
user_3028062
xml
2 months ago
5.9 kB
0
No Index
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:layoutsversion='3' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/namespaces/all/scalar' xmlns:data='http://www.google.com/namespaces/all/scalar' xmlns:expr='http://www.google.com/namespaces/all/scalar'>
<head>
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<title><data:blog.pageTitle/></title>
<b:include data='blog' name='all-head-content'/>
<link href='https://fonts.googleapis.com/css2?family=Inter:wght@400;700&family=Space+Mono&family=Outfit:wght@400;700&family=Poppins:wght@400;600&display=swap' rel='stylesheet'/>
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css' rel='stylesheet'/>
<style type='text/css'>
:root { --bg-page: #f3f4f6; --text-main: #111827; --text-sub: #6b7280; --btn-bg: #2563eb; --btn-text: #ffffff; --btn-radius: 12px; --btn-shadow: 0 4px 6px -1px rgba(0,0,0,0.1); --btn-border: none; --font-main: 'Inter', sans-serif; }
body.theme-retro { --bg-page: #FFDE59; --text-main: #000; --text-sub: #000; --btn-bg: #5271FF; --btn-text: #fff; --btn-radius: 0px; --btn-shadow: 6px 6px 0px #000; --btn-border: 3px solid #000; --font-main: 'Space Mono', monospace; }
body.theme-soft { --bg-page: #fff5f5; --text-main: #4a5568; --text-sub: #a0aec0; --btn-bg: #ffffff; --btn-text: #4a5568; --btn-radius: 50px; --btn-shadow: 0 10px 25px rgba(255, 179, 179, 0.3); --btn-border: 1px solid #ffebeb; --font-main: 'Outfit', sans-serif; }
body.theme-cyber { --bg-page: #050505; --text-main: #00f2ff; --text-sub: #7000ff; --btn-bg: transparent; --btn-text: #00f2ff; --btn-radius: 4px; --btn-shadow: 0 0 15px rgba(0, 242, 255, 0.4); --btn-border: 2px solid #00f2ff; --font-main: 'Space Mono', monospace; }
body.theme-glass { --bg-page: linear-gradient(45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab); background-size: 400% 400%; animation: gradient 15s ease infinite; --text-main: #ffffff; --text-sub: rgba(255,255,255,0.8); --btn-bg: rgba(255, 255, 255, 0.15); --btn-text: #ffffff; --btn-radius: 16px; --btn-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37); --btn-border: 1px solid rgba(255, 255, 255, 0.18); --backdrop: blur(12px); --font-main: 'Poppins', sans-serif; }
@keyframes gradient { 0% {background-position: 0% 50%;} 50% {background-position: 100% 50%;} 100% {background-position: 0% 50%;} }
body { font-family: var(--font-main); background: var(--bg-page); margin: 0; padding: 0; display: flex; justify-content: center; min-height: 100vh; color: var(--text-main); transition: all 0.4s ease; background-attachment: fixed; background-size: cover; }
.wrapper { width: 100%; max-width: 420px; padding: 50px 20px; text-align: center; }
.widget h2, .widget-title, .caption, #theme-selector-section { display: none !important; }
body#layout #theme-selector-section { display: block !important; background: #fff3cd !important; border: 2px dashed #856404 !important; padding: 15px !important; margin-bottom: 20px !important; }
.profile-section img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; border: 4px solid white; box-shadow: 0 10px 20px rgba(0,0,0,0.1); margin-bottom: 15px; }
body.theme-retro .profile-section img { border-radius: 0; border: 4px solid black; box-shadow: 6px 6px 0 black; }
body.theme-cyber .profile-section img { border: 2px solid #00f2ff; box-shadow: 0 0 20px #7000ff; }
.bio-section h1 { font-size: 1.5rem; font-weight: 700; margin: 0; }
.bio-section .description { font-size: 0.95rem; color: var(--text-sub); margin: 10px 0 35px; }
.link-section ul { list-style: none; padding: 0; margin: 0; }
.link-section li { margin-bottom: 18px; }
.link-section a { display: block; background: var(--btn-bg); color: var(--btn-text) !important; padding: 16px 20px; border-radius: var(--btn-radius); text-decoration: none; font-weight: 600; border: var(--btn-border); box-shadow: var(--btn-shadow); backdrop-filter: var(--backdrop); transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.link-section a:hover { transform: translateY(-4px); opacity: 0.9; }
footer { margin-top: 50px; font-size: 11px; opacity: 0.6; text-transform: uppercase; letter-spacing: 2px; }
</style>
<b:skin><![CDATA[]]></b:skin>
</head>
<body>
<div class='wrapper'>
<b:section id='theme-selector-section' maxwidgets='1' showaddelement='yes'>
<b:widget id='Text2' locked='false' title='TEMA: ketik retro / soft / cyber / glass' type='Text' visible='true'>
<b:includable id='main'>
<div id='theme-trigger' style='display:none;'><data:content/></div>
<strong>PILIH TEMA:</strong> Ketik salah satu di kolom konten: <code>retro</code>, <code>soft</code>, <code>cyber</code>, <code>glass</code>.
</b:includable>
</b:widget>
</b:section>
<b:section class='profile-section' id='profile-photo' maxwidgets='1'><b:widget id='Image1' locked='false' type='Image'/></b:section>
<b:section class='bio-section' id='bio-info' maxwidgets='1'><b:widget id='Header1' locked='false' type='Header'/></b:section>
<b:section class='link-section' id='links' maxwidgets='1'><b:widget id='LinkList1' locked='false' type='LinkList'/></b:section>
<footer>© <data:blog.title/></footer>
</div>
<script type='text/javascript'>
var themeContent = document.getElementById('theme-trigger').innerText.trim().toLowerCase();
if (themeContent) { document.body.classList.add('theme-' + themeContent); }
</script>
<div style='display:none;'><b:section id='hidden'><b:widget id='Blog1' type='Blog'/></b:section></div>
</body>
</html>Editor is loading...