Main Page: Difference between revisions

From HUIJIA FUN
← Older edit
VisualWikitext
Edit
New main page design
 
(16 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{Theme-HJ}}<br>
{{Theme-HJ}}__NOTOC__
<div style="font-size: 26px;margin-top: 6px;text-align: center;">'''Welcome to「HUIJIA FUN - Plurimod Student Union Official Website」'''</div>
<html><style>
<div style="font-size: 18px;margin-bottom: 6px;text-align: center;">'''''Huijia Academy''' Thematic Forum Wikipedia''</div>
/* HUIJIA FUN Main Page (English): table-of-contents layout
<div style="font-family:Huiwen;text-align: center;">· Chinese Branch Website: https://huijia.fun ·<br>We are under DEVELOPING right now......</div>
* Mirrors huijia.fun 首页. Reads only Theme-HJ tokens; no shadows; hover uses colour, accent rule and arrow shift. */
<br>
<div class="mini-block">
<tabber>
|-|Website Information=
<br>
[[File:HUIJIA LOGO.png|150px|frameless|right]]
<span class="mini-block-title">Welcome to HUIJIA FUN</span>


This website is a '''non-profit''', '''Wikipedia''' and '''forum''' centered around Huijia Academy that features '''non-advertisement''' and '''non-membership''' system.
h1.firstHeading {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
    margin: 0 !important; padding: 0 !important;
}


Thank you for your support and trust in the [[HUIJIA FUN Editorial Department]]. Let's continue to strive as always to create a better entertaining encyclopedia platform experience for everyone on HUIJIA FUN!
.hf-home { max-width: 920px; margin: 0 auto; }
.hf-home .hf-toc > p, .hf-home .hf-start > p { display: none; }


This website welcomes participation and editing from anyone. We sincerely hope you will actively join and contribute to co-building HUIJIA FUN! For any questions or consultation requests, please contact the website administrator's official account '''[[User:PlurimodSU|PlurimodSU]]'''!
/* —— Masthead —— */
.hf-mast {
    text-align: center;
    padding: var(--space-8) var(--space-4) var(--space-6);
    margin-bottom: var(--space-8);
    border-bottom: 1px solid var(--rule);
}
.hf-mast-name {
    font-family: var(--font-latin);
    font-size: 44px;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: 0.24em;
    padding-left: 0.24em;
    color: var(--accent);
}
.hf-mast-line {
    font-family: var(--font-serif);
    font-size: 17px;
    letter-spacing: 0.02em;
    color: var(--ink);
    margin-top: var(--space-2);
}
.hf-mast-meta {
    font-family: var(--font-sans);
    font-size: 13px;
    letter-spacing: 0.08em;
    color: var(--ink-muted);
    margin-top: var(--space-3);
}
.hf-mast-meta .hf-dot { margin: 0 var(--space-2); }


|-|Create a Page=
/* —— Contents: area rows —— */
<br>
.hf-toc {
<div style="text-align:center"> '''Remember! This website is not only aimed at Huijia students but is also publicly accessible on the internet!'''
    border-top: 2px solid var(--accent);
    margin-bottom: var(--space-8);
}
.hf-zone-block { border-bottom: 1px solid var(--rule); }


To ensure resource reliability, information neutrality, and compliance with the '''Creative Commons''' license and copyright, please make sure you have read the [[Guideline]], and understand the community and editing rules. Before writing a page, please be aware that this is a publicly accessible website on the internet that follows the '''CC BY-SA''' license and maintains relatively rigorous content!
.hf-row {
    position: relative;
    display: grid;
    grid-template-columns: 3.5em minmax(0, 1fr) 2em;
    gap: var(--space-4);
    align-items: center;
    padding: var(--space-4) var(--space-2);
    transition: background-color 0.2s ease;
}
.hf-row::before {
    content: "";
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 3px;
    background: var(--accent);
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.25s ease;
}
.hf-row:hover,
.hf-row:focus-within { background-color: var(--accent-tint); }
.hf-row:hover::before,
.hf-row:focus-within::before { transform: scaleY(1); }


Ready? Create a page through the section below!
.hf-num {
{{#createpage:}}
    font-family: var(--font-latin);
</div>
    font-size: 24px;
    font-weight: 600;
    color: var(--ink-muted);
    text-align: center;
    transition: color 0.2s ease;
}
.hf-row:hover .hf-num,
.hf-row:focus-within .hf-num { color: var(--accent); }
 
.hf-zone {
    font-family: var(--font-serif);
    font-size: 22px;
    font-weight: 600;
}
.hf-zone a { color: var(--ink) !important; }
.hf-zone a::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}
.hf-alt {
    font-family: var(--font-serif);
    font-size: 14px;
    letter-spacing: 0.12em;
    color: var(--ink-muted);
    margin-left: var(--space-2);
}
.hf-desc {
    display: block;
    font-family: var(--font-body);
    font-size: 15px;
    line-height: 1.7;
    color: var(--ink-muted);
    margin-top: 2px;
}
.hf-arrow {
    font-family: var(--font-sans);
    font-size: 20px;
    color: var(--ink-muted);
    transition: transform 0.25s ease, color 0.2s ease;
}
.hf-row:hover .hf-arrow,
.hf-row:focus-within .hf-arrow { transform: translateX(6px); color: var(--accent); }
 
/* —— Sub-areas: one button per line —— */
.hf-home ul.hf-subs {
    list-style: none;
    display: grid;
    gap: var(--space-1);
    margin: 0 0 var(--space-4);
    padding: 0 var(--space-2) 0 calc(3.5em + var(--space-4) + var(--space-2));
}
.hf-home ul.hf-subs li {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: var(--radius-sm);
    transition: background-color 0.4s cubic-bezier(0.22, 0.58, 0.12, 0.98);
}
.hf-home ul.hf-subs li a {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px 10px 16px;
    font-family: var(--font-serif);
    font-size: 17px;
    letter-spacing: 0.04em;
    color: var(--ink) !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}
/* short accent rule on the left */
.hf-home ul.hf-subs li a::before {
    content: "";
    position: absolute;
    left: 0; top: 8px; bottom: 8px;
    width: 2px;
    background: var(--accent);
    transform: scaleY(0);
    transition: transform 0.25s ease;
}
/* arrow on the right (hidden from screen readers) */
.hf-home ul.hf-subs li a::after {
    content: "→";
    content: "→" / "";
    font-family: var(--font-sans);
    font-size: 15px;
    color: var(--ink-muted);
    transition: transform 0.25s ease, color 0.2s ease;
}
.hf-home ul.hf-subs li:hover,
.hf-home ul.hf-subs li:focus-within { background-color: var(--accent-tint); }
.hf-home ul.hf-subs li:active { background-color: var(--rule); }
.hf-home ul.hf-subs li:hover a,
.hf-home ul.hf-subs li:focus-within a { color: var(--accent) !important; }
.hf-home ul.hf-subs li:hover a::before,
.hf-home ul.hf-subs li:focus-within a::before { transform: scaleY(1); }
.hf-home ul.hf-subs li:hover a::after,
.hf-home ul.hf-subs li:focus-within a::after { transform: translateX(4px); color: var(--accent); }
 
/* —— Start here —— */
.hf-start {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--space-2) var(--space-4);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-8);
    background: var(--paper-sunk);
    border-left: 3px solid var(--accent);
    font-family: var(--font-sans);
    font-size: 15px;
}
.hf-start-label {
    font-family: var(--font-serif);
    font-weight: 600;
    color: var(--ink);
}
 
/* —— Footer —— */
.hf-foot {
    margin-top: var(--space-8);
    padding-top: var(--space-4);
    border-top: 1px solid var(--rule);
    font-family: var(--font-sans);
    font-size: 13px;
    line-height: 1.9;
    color: var(--ink-muted);
}
 
/* —— Keyboard focus —— */
.hf-zone a:focus-visible { outline: none; }
.hf-row:has(a:focus-visible) { outline: 2px solid var(--focus); outline-offset: 2px; }


|-|Recent Events=
/* —— Mobile —— */
<br>
@media screen and (max-width: 850px) {
<div style="font-size: 70px; font-weight: 200; text-align: right; height: 0; color: #f1f1f1; user-select: none; margin-bottom: 0">{{{background|Recent events}}}</div>
    .hf-mast-name { font-size: 32px; letter-spacing: 0.14em; padding-left: 0.14em; }
{{Section
    .hf-row { grid-template-columns: 2.5em minmax(0, 1fr) 1.5em; }
|Image=[[File:Bittersweet Memories.jpg]]
    .hf-home ul.hf-subs { padding-left: calc(2.5em + var(--space-4) + var(--space-2)); }
|Title=Release of Huijia Class of 2024 Graduation Song – Bittersweet Memories
}
|Content="Bittersweet Memories" is the graduation song for Huijia's Class of 2024. It is a song that expresses mixed feelings about past beautiful memories and future farewells. The lyrics and melody of this song may remind people of the time spent on campus and evoke those conflicting emotions: reluctance towards the ending student life and anticipation for future prospects.<br>Upon the song's release, we will also witness the graduation ceremony for Huijia School's Class of 2024. Students will gather together to reflect on past moments and express gratitude to classmates, teachers, and the school. This song will become a lasting memento for them, connecting their past and future, and serving as one of the most precious gifts upon their graduation. |Details=https://www.bilibili.com/video/BV1Fx4y1J7Mp
}}


</tabber>
/* —— Reduced motion —— */
@media (prefers-reduced-motion: reduce) {
    .hf-home *, .hf-home *::before, .hf-home *::after { transition: none !important; }
    .hf-row:hover .hf-arrow,
    .hf-home ul.hf-subs li:hover a::after { transform: none; }
}
</style></html>
<div class="hf-home">
<div class="hf-mast">
<div class="hf-mast-name">HUIJIA FUN</div>
<div class="hf-mast-line">Portfolio and archive of ''[[Verdant Green Revelation]]''</div>
<div class="hf-mast-meta plainlinks">Rooted in [[Beijing Huijia Private School|Huijia Academy]]<span class="hf-dot">·</span>Chinese Branch: [https://huijia.fun huijia.fun]</div>
</div>
<div class="hf-toc">
<div class="hf-zone-block">
<div class="hf-row"><div class="hf-num">I</div><div><span class="hf-zone">[[Canon Area]]</span><span class="hf-desc">The creative works of ''Verdant Green Revelation''</span></div><span class="hf-arrow" aria-hidden="true">→</span></div>
</div>
<div class="hf-zone-block">
<div class="hf-row"><div class="hf-num">II</div><div><span class="hf-zone">[[Worldview Area]]</span><span class="hf-desc">An encyclopedia of the world of Dipfield City</span></div><span class="hf-arrow" aria-hidden="true">→</span></div>
<ul class="hf-subs">
<li>[[:Category:Mythology|Mythology]]</li>
<li>[[:Category:Entity|Entity]]</li>
<li>[[:Category:Cosmology|Cosmology]]</li>
</ul>
</div>
<div class="hf-zone-block">
<div class="hf-row"><div class="hf-num">III</div><div><span class="hf-zone">[[Archive Area]]</span><span class="hf-desc">The real Huijia Academy</span></div><span class="hf-arrow" aria-hidden="true">→</span></div>
<ul class="hf-subs">
<li>[[:Category:Record|Record]]</li>
<li>[[:Category:Origin|Origin]]</li>
<li>[[:Category:Tangent|Tangent]]</li>
</ul>
</div>
</div>
</div>
<div class="mini-block-container mini-block-list">
<div class="hf-start"><span class="hf-start-label">First time here?</span>[[Verdant Green Revelation|About the series]] [[Quick Guide]] [[Guidelines]]</div>
<div class="mini-block">
<div style="font-size: 70px; font-weight: 200; text-align: right; height: 0; color: #f1f1f1; user-select: none; margin-bottom: 0">Archive</div>
<span class="mini-block-title">[[Archive Area]]


<li class="mdui-ripple">[[:Category:Record|Record]]</li>
== About this site ==
<li class="mdui-ripple">[[:Category:Origin|Origin]]</li>
HUIJIA FUN began as a playful student wiki centred on [[Beijing Huijia Private School|Huijia Academy]]. Today it is the portfolio and archive of [[Marina Malinti]], and the home of ''[[Verdant Green Revelation]]'': a Gesamtkunstwerk (total artwork) series spanning novels, music albums, the constructed language [[Pre-Diphic]], and a world rooted in Huijia Academy.
<li class="mdui-ripple">[[:Category:Tangent|Tangent]]</li>
 
</div>
The site is non-profit, ad-free and membership-free. It is maintained by [[Marina Malinti]] on behalf of the [[User:PlurimodSU|Plurimod Student Union]], and its content is published under CC BY-SA.
<div class="mini-block">
<div style="font-size: 70px; font-weight: 200; text-align: right; height: 0; color: #f1f1f1; user-select: none; margin-bottom: 0">Worldview</div>
<span class="mini-block-title">[[Worldview Area]]


<li class="mdui-ripple">[[:Category:Mythos|Mythos]]</li>
Before collaborating, please read the [[Guidelines]].
<li class="mdui-ripple">[[:Category:Entity|Entity]]</li>
<div class="hf-foot">
<li class="mdui-ripple">[[:Category:Ontology|Ontology]]</li>
Contact: [email protected]<br>
Thanks to: LastW!sh and Trooperr9863625badun (writing), Akatsuki0702 (framework), Bululu and JohnDing (world-building), 1S0d1uM1 and Hewu888 (articles)
</div>
</div>
</div>
</div>
[[Category:Hub]]
[[Category:Hub]]

Latest revision as of 22:52, 5 October 2026

HUIJIA FUN
Portfolio and archive of Verdant Green Revelation
Rooted in Huijia Academy·Chinese Branch: huijia.fun
I
Canon AreaThe creative works of Verdant Green Revelation
II
Worldview AreaAn encyclopedia of the world of Dipfield City
III
Archive AreaThe real Huijia Academy
First time here?About the series Quick Guide Guidelines

About this site

HUIJIA FUN began as a playful student wiki centred on Huijia Academy. Today it is the portfolio and archive of Marina Malinti, and the home of Verdant Green Revelation: a Gesamtkunstwerk (total artwork) series spanning novels, music albums, the constructed language Pre-Diphic, and a world rooted in Huijia Academy.

The site is non-profit, ad-free and membership-free. It is maintained by Marina Malinti on behalf of the Plurimod Student Union, and its content is published under CC BY-SA.

Before collaborating, please read the Guidelines.

Contact: [email protected]
Thanks to: LastW!sh and Trooperr9863625badun (writing), Akatsuki0702 (framework), Bululu and JohnDing (world-building), 1S0d1uM1 and Hewu888 (articles)

Retrieved from "https://en.huijia.fun/index.php?title=Main_Page&oldid=180"