---

+ Show component code

:root {
        /* header measurements */
        --header-height-on-desktop: 10rem;
        --header-height-on-mobile: 10rem;
        --header-h1-font-size: clamp(2rem, 5vw, 2.8125rem);
        --header-h2-font-size: clamp(0.875rem, 3vw, 0.9375rem);
 
        --logo-image: url("https://nu-scptheme.github.io/Black-Highlighter/img/logo.svg");
    }
 
    #header {
        --search-textbox-text-color: var(--swatch-secondary-color);
        background: none;
    }
 
    #header::before {
        content: " ";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0.75rem;
        background-image: var(--logo-image);
        background-repeat: no-repeat;
        background-position: center 0;
        background-size: auto calc(var(--header-height-on-desktop) - 1.5rem);
        opacity: 0.8;
        pointer-events: none;
    }
 
    #header h1,
    #header h2 {
        margin: 0;
        padding: 0;
        width: 100%;
        height: var(--header-height-on-desktop);
        display: flex;
        align-items: center;
        justify-content: center;
        display: flex;
        align-items: center;
        justify-content: center;
    }
 
    #header h1 a,
    #header h1 a::before,
    #header h2 span,
    #header h2 span::before {
        margin: 0;
        padding: 0;
        z-index: 0;
        display: block;
        text-align: center;
    }
 
    #header h1 {
        z-index: 1;
    }
 
    #header h1 a::before,
    #header h1 a::after {
        content: var(--header-title);
    }
 
    #header h1 a::before  {
        color: rgb(var(--swatch-text-tertiary-color));
        z-index: -1;
        -webkit-text-stroke: 0.325rem rgb(var(--swatch-text-dark));
    }
 
    #header h1 a::after {
        color: rgb(var(--swatch-headerh1-color));
        z-index: 1;
    }
 
    #header h2 {
        z-index: 0;
        text-transform: uppercase;
        pointer-events: none;
    }
 
    #header h2 span {
        margin-top: calc(var(--header-height-on-mobile)/2 + var(--header-h1-font-size)/2 - 2em);
    }
 
    #header h2 span::before,
    #header h2 span::after {
        --wght: 600;
        content: var(--header-subtitle);
        position: absolute;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        width: 100%;
        text-align: center;
    }
 
    #header h2 span::before {
        -webkit-text-stroke: 0.25rem rgb(var(--swatch-text-dark));
    }
 
    #header h2 span::after {
        color: rgb(var(--swatch-headerh2-color));
        z-index: 1;
    }
 
    #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
        color: rgba(0, 0, 0, 0);
    }
 
    @media (min-width: 36rem) {
 
        #login-status {
            flex-grow: 1;
            left: 3%;
            right: initial;
        }
 
         #login-status::before {
            --mask-image: none;
            background-color: transparent;
        }
 
        #login-status:not(:focus-within) {
            color: rgb(var(--login-line-divider-color));
            -webkit-user-select: initial;
            -moz-user-select: initial;
            -ms-user-select: initial;
            user-select: initial;
        }
 
        #login-status #account-topbutton,
        #login-status:not(:focus-within) #account-topbutton {
            --clip-path:
                    polygon( 0 0, 100% 0, 100% 100%, 0 100% );
            background-color: rgba(var(--login-arrow-color), 0);
 
        }
 
        #login-status #account-topbutton::before{
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(var(--login-arrow-color), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton::before,
        #login-status:not(:focus-within) #account-topbutton:hover::before {
            --clip-path:
                    polygon( 30% 35%, 70% 35%, 50% 60%, 50% 60% );
            --mask-image: initial;
        }
 
        #login-status:not(:focus-within) #account-topbutton::after {
            display: none;
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not([href*="account/messages"]) {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            pointer-events: all;
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #login-status:not(:focus-within) *:not(#account-topbutton):not(#account-options):not([href*="account/messages"]) {
            opacity: 1;
        }
 
        #login-status #my-account {
            --wght: 300;
        }
 
        #account-options {
            background: var(--gradient-header);
        }
 
        #search-top-box {
            top: 1.5em;
            right: 3%;
            background: rgba(var(--search-focus-textbox-bg-color), 0.4);
        }
 
         #search-top-box:focus-within ~ #login-status {
            opacity: 1;
        }
 
        #search-top-box::after {
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
            transition:
                background-color 150ms cubic-bezier(0.4, 0, 0.2, 1),
                clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1),
                -webkit-clip-path 150ms cubic-bezier(0.4, 0, 0.2, 1);
        }
 
        #search-top-box:not(:focus-within)::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0% 100%
                    );
            background-color: rgba(var(--search-icon-bg-color, --dark-accent), 1);
            -webkit-clip-path: var(--clip-path);
            clip-path: var(--clip-path);
        }
 
        #search-top-box:not(:focus-within):hover::after {
            --clip-path:
                    polygon(
                        0 0,
                        100% 0,
                        100% 100%,
                        0 100%
                    );
            background-color: rgb(var(--search-icon-hover-bg-color));
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) {
            max-width: var(--search-width);
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
            max-width: var(--search-width);
            padding: 0 var(--search-height) 0 1em;
            outline-width: 0;
            background-color: rgb(var(--search-focus-textbox-bg-color), 0.35);
            color: rgba(var(--search-textbox-text-color), 0.4);
            cursor: pointer;
        }
 
        #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="submit"],
        #search-top-box form[id="search-top-box-form"]:focus-within input[type="submit"] {
            pointer-events: all;
            border: none;
        }
 
    }
 
    #page-title::after,
    .meta-title::after,
    #page-title::before,
    .meta-title::before {
        content: "";
        flex-grow: 1;
        height: 0.0625rem;
        background: rgb(var(--swatch-primary));
    }
 
    #page-title::before,
    .meta-title::before {
        margin: auto 1.25rem auto auto;
    }

+ Show component code

@supports(display: grid) {
    :root {
        --sidebar-width-on-desktop: calc((var(--base-font-size) * (14 / 15)) * 19);
        --body-width-on-desktop: 45.75rem;
    }
    @media only screen and (min-width: 769px) {
        #side-bar .close-menu {
            display: block;
            position: fixed;
            top: 0.5rem;
            left: 0.5rem;
            width: 3rem;
            height: 3rem;
            background: unset;
            opacity: 1;
            pointer-events: all;
            z-index: -1;
        }
 
        #side-bar .close-menu img {
            color: transparent;
        }
 
        #side-bar .close-menu::before,
        #side-bar .close-menu::after {
            content: "";
            box-sizing: border-box;
            position: fixed;
            display: block;
            top: 0.5rem;
            left: 0.5rem;
            width: 3rem;
            height: 3rem;
            padding: 0;
            margin: 0;
            text-align: center;
            pointer-events: all;
            cursor: pointer;
            transition:
                opacity var(--sidebar-transition-timing);
        }
 
        #side-bar .close-menu::before {
            --mask:url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' id='Hamburger' x='0' y='0' baseProfile='tiny' overflow='visible' version='1.2' viewBox='0 0 32 32' xml:space='preserve'%3E%3Cpath d='M4 10h24c1.1 0 2-.9 2-2s-.9-2-2-2H4c-1.1 0-2 .9-2 2s.9 2 2 2zm24 4H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2zm0 8H4c-1.1 0-2 .9-2 2s.9 2 2 2h24c1.1 0 2-.9 2-2s-.9-2-2-2z'/%3E%3C/svg%3E");
            z-index: -1;
            background-color: var(--toggle-icon-color, rgb(var(--sidebar-links-text))) !important;
            -webkit-mask: var(--mask);
            mask: var(--mask);
            -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
            -webkit-mask-position: 50% 50%;
            mask-position: 50% 50%;
            -webkit-mask-size: 60%;
            mask-size: 60%;
        }
 
        #side-bar .close-menu::after {
            z-index: -2;
            background-color: var(--toggle-button-bg, rgb(var(--sidebar-bg-color))) !important;
            border-radius: var(--toggle-roundness, 50%);
            border: var(--toggle-border-color, rgb(var(--sidebar-links-text))) var(--toggle-border-width, 0.25rem) solid;
        }
 
        #side-bar:focus-within .close-menu,
        #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu {
            pointer-events: none;
        }
 
        #side-bar:focus-within .close-menu::before,
        #side-bar:focus-within .close-menu::after {
            opacity: 0;
            pointer-events: none;
        }
 
        #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::before,
        #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover .close-menu::after {
            opacity: 0;
            pointer-events: none;
        }
 
        #side-bar {
            display: block;
            position: fixed;
            top: 0;
            left: calc(var(--sidebar-width-on-desktop)*-1);
            z-index: 10;
            transition:
                left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
            height: 100%;
            overflow-y: auto;
            overflow-x: hidden;
            margin-top: 0;
        }
 
        #side-bar:focus-within {
            left: 0;
        }
 
        #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover {
            left: 0;
        }
 
        #side-bar .side-block {
            margin-top: 1rem;
            background-color: rgb(0, 0, 0, 0);
            border-radius: 0;
            border-left-width: 0px;
            border-right-width: 0px;
        }
 
        #main-content::before {
            content: "";
            display: block;
            position: fixed;
            top: 0;
            right: 0;
            z-index: -1;
            opacity: 0;
            transition:
                opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
                width 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
            margin-left: var(--sidebar-width-on-desktop);
            background: rgba(var(--swatch-menubg-black-color), .3) 1px 1px repeat;
            padding-right: 0;
            width: 100%;
            height: 100vh;
            pointer-events: none;
            z-index: 99;
        }
 
        #side-bar:focus-within ~ #main-content::before {
            width: calc(100% - var(--sidebar-width-on-desktop));
            opacity: 1;
            pointer-events: all;
        }
 
        #side-bar:not(:has(.close-menu:hover)):not(:focus-within):hover ~ #main-content::before {
            width: calc(100% - var(--sidebar-width-on-desktop));
            opacity: 1;
            pointer-events: all;
        }
 
        @supports (-moz-appearance:none) and (background-attachment:local) and (not (-moz-osx-font-smoothing:auto)) { #side-bar {
            padding: inherit;
        } }
 
        #content-wrap {
            display: flex;
            flex-direction: row;
            width: calc(100vw - (100vw - 100%));
            min-height: calc(100vh - calc(var(--final-header-height-on-desktop, 10.125rem)));
            flex-grow: 2;
            height: auto;
            position: relative;
            margin: 0 auto;
            max-width: inherit;
        }
 
        #main-content {
            width: 100%;
            position: initial;
            max-height: 100%;
            padding: 2rem 1rem;
            max-width: var(--body-width-on-desktop, 45.75rem);
            margin: 0 auto;
        }
 
        #page-content {
            max-width: min(90vw, var(--body-width-on-desktop, 45.75rem));
        }
 
        @supports (-webkit-hyphens:none) { 
            #side-bar {
                transition:
                    left 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
                    padding-right 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms,
                    background-color 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
                padding-right: 0;
                background-color: rgb(0, 0, 0, 0);
                pointer-events: all;
                overflow-x: visible;
                overflow-y: visible;
                z-index: 999;
            }
 
            #side-bar::-webkit-scrollbar {
                opacity: 0;
                -webkit-transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
                transition: opacity 500ms cubic-bezier(0.4, 0, 0.2, 1) 100ms;
            }
 
            #side-bar .close-menu::before {
                z-index: 999;
            }
 
            #side-bar .close-menu::after {
                z-index: 998;
            }
 
            #side-bar:hover .close-menu::before,
            #side-bar:hover .close-menu::after {
                opacity: 0;
            }
 
            #side-bar:hover {
                left: 0;
                background-color: rgba(var(--swatch-menubg-color), 1);
                padding-right: 0;
            }
 
            #side-bar:hover::-webkit-scrollbar {
                opacity: 1;
            }
 
            #side-bar:hover~#main-content::before {
                width: calc(100% - var(--sidebar-width-on-desktop));
                opacity: 1;
                pointer-events: all;
            }
        }
    }
}

深林文学部

2023「涅槃重生」新人竞赛

纵使深林之中浓荫蔽日，幼苗们仍会固执地从土中探出头来，

让生机弥漫着每个角落。

---

参赛要求：主题限定为涅槃重生，文章体裁不做限制。

---

竞赛流程：

• 开始投稿日期：北京时间(GMT+8) 2023年07月10日 00时00分
• 截止投稿日期：北京时间(GMT+8) 2023年08月16日 23时59分
• 截止投票日期：北京时间(GMT+8) 2023年08月24日 23时59分

---

参赛规则：

1. 仅支持原创作品投稿。如有抄袭、盗用的，一经发现，取消参赛者的参赛资格并按照网站站规进行处理；
2. 本次竞赛禁止投稿带有限制级内容/成人内容/敏感内容的作品。
3. 所有参赛者与参赛作品均需遵守网站站规中的社区环境相关一栏。
4. 请参赛者确认是否拥有本站成员资格，详情请见加入网站。如有无法注册Wikidot账号或有困难的，请联系站务组寻求帮助或申请代发服务。
5. 禁止一系列的小号行为，如开小号发布文章，开小号进行刷分。如有以上行为的，将取消其参赛资格。
6. 所有代发的参赛作品所有权均属于原作者，作者可自行决定是否对作品进行署名。对于未署名的参赛作品，在竞赛结束后归于匿名作品一类。
7. 本次竞赛设定主题而不限定体裁，参赛者可以创作任何类型的文章，但文章中必须包含主题或与主题相关。
8. 为了保证竞赛的公平公正性，禁止文章作者为自己的作品进行评分，禁止利用各类媒介对作品进行拉票或过度宣传。
9. 本次竞赛对投稿文章数量不做要求，每位参赛者均可投稿任意数量的作品。
10. 本次竞赛允许团队合作创作，参赛文章及获奖奖励所有权归团队所有，团队所获奖项由团队内部商议分配。
11. 参赛者需要为各自的参赛作品加上“原创”、“文章”、和“2023新人竞赛”标签，详细情况见标签指导。
12. 本次竞赛属于另一种的主题文章范畴（需要添加“主题文章”标签），允许合著写作（需要添加“合作主题文章”标签），“主题文章”标签与“合作主题文章”标签不可以同时使用。
13. 本次竞赛最终解释权归于举办方，如有疑问请联系举办方。

竞赛奖项设置：

• 一般奖项

获奖要求	奖品内容
文章在所有的参赛文章中达到评分第一	白色定制T恤*11，站娘定制抱枕*12，站娘海报*23
文章在所有的参赛文章中达到评分第二	定制手机壳*14，网站图标钥匙扣*15，网站图标勋章*16
文章在所有的参赛文章中达到评分第三	网站图标钥匙扣*17，网站图标勋章*18

以上奖品均由Liurd、eastleavecn和White fantasy的联合资金提供。
以上奖品发送由网站管理组负责。

• 成就奖项

成就	要求	奖品	赞助
「CSS-Hampion」	在文章中使用足以改变全局样式的CSS代码	由Liurd提供的版式定制机会*1	Liurd
「先行者」9	第一个发布带有竞赛标签的文章	Arcaea曲包*1	Guyueqing
「烟火之约」	文章内容时间跨度超越百年，且有“烟火”与“久别重逢”两个要素*1	烟花与网站站娘的定制双面镭射票*1（不可折现）	Guyueqing
「伟大的可能」	悲剧科幻小说并在同类作品中得分最高，负分不算	Steam游戏《The Great Perhaps》*1	Doctor Rorschach
「DDL骑士」	8月16日9:00后最后一个打上竞赛标签的文章。	“DDL骑士”字符画与字符徽章发在获奖文章的讨论区	niezechuan25

以上奖品发送由各自赞助者负责。

评奖颁奖规则：

1. 评奖颁奖均由网站管理组和本次竞赛的主办方负责。
2. 评奖文章至少需达到+4分的合格分数线。
3. 除非特别说明，否则所有奖项均允许等价折现，且不允许更换奖品。
4. 合著写作的奖品由合著写作者内部自己平分。
5. 竞赛结束后将给出获奖名单，届时请获奖选手自行参考赞助列表进行领奖，主办方将全程协助。
6. 实物奖品需要获奖者提供地址，将直接从各网络商店地址直接发送到获奖者提供的地址。依据隐私权政策，位置信息将仅用于发送实物奖品。

奖品赞助规则：

1. 奖品赞助开放时间为即日起至竞赛评分结束。视情况，主办方可能会提前关闭赞助。
2. 如果你有意向提供竞赛资金赞助或奖品赞助，可通过各种渠道联系White fantasy（比赛举办）或eastleavecn（资金管理）。
3. 所有赞助项成功确定以后，除非是遇到特殊情况，否则不支持取消。
4. 所有奖品默认可折现，如果不可折现，请赞助人员明确的提出。

如对奖品相关有疑问的，请联系lestday233、eastleavecn或网站管理组。如对评奖颁奖相关有疑问的，请联系lestday233、White fantasy或网站管理组。

所有参赛作品

页面

评分

评论

雨和鲸	12	16
跨越叙事层的相逢	9	14
重生	8	2
回归……	7	6
深林之护•序章•复燃的星	4	2
第五天	4	8
Another World Again 第二部分：涅槃计划	4	1

帮助与建议：

如果你想参加本次竞赛并欲进行文章创作，那么下面的一些内容会给予你一定的帮助。
这是必读的网站规则
想要加入我们？(这里是加入网站的链接）
想要创作一篇文章？（写作指导，维基语法，沙盒网站）
还有其他疑问？指导中心或询问网站管理组都会找到答案。

---

Q&A

• 我想要找人代发，可以找任何人发布我的作品吗？

不可以。代发作品由本站专用账号负责，如果想要代发或匿名发布作品，请向管理组申请。

• 这次竞赛到底有什么要求，我为什么看地晕头转向？

本次竞赛对文章体裁不做要求，你可以创作任何类型的文章，但你创作的文章内容中必须包含本次限制主题“涅槃重生”或与其相关。也就是说，你可以写小说，也可以写散文，但你的文章内容里必须有“涅槃重生”。

• 我没有在本网站发布过文章，或者我没有较多的创作经验，那么我可以参赛吗？

可以。进行创作交流是本次竞赛的目的之一，本次竞赛并没有设置发布文章数量的门槛。希望通过本次竞赛，每一位参赛者都能有所进步和收获。

• 我想要参加本次竞赛，我应该怎样撰写并发布我的文章？

本站有专用的沙盒网站作为创作者草拟文章的地方，除此之外你也可以使用其他媒介。但请注意，作品正式发布后将不再允许进行大规模修改，请在发布作品前核对清楚。

特别鸣谢：

（排名不分先后）感谢慷慨赞助！
Liurd、Guyueqing、eastleavecn、Doctor Rorschach、White fantasy、niezechuan25

---

竞赛举办：

（排名不分先后）如有任何问题，请来询问我们！
lestday233（竞赛主办）、White fantasy（竞赛主办）、WeissCharlotte（资金管理）

Footnotes

1. 需发送你的衣服尺码，深林文学部定制款，价值大约15元

2. 深林文学部网站站娘形象定制款，价值大约6.44元

3. 深林文学部网站站娘形象定制款，价值大约5.88元

4. 需发送你的手机型号，深林文学部定制款，价值大约5.5元

5. 印有深林文学部网站图标的钥匙扣，价值大约4.59元

6. 印有深林文学部网站图标的勋章，价值大约2.8元

7. 印有深林文学部网站图标的钥匙扣，价值大约4.59元

8. 印有深林文学部网站图标的勋章，价值大约2.8元

9. 由于特殊原因，延迟发奖