Compare commits
5 commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 0633a48f09 | |||
| ceb05fc3f7 | |||
| 7ea5e9414d | |||
| 419e9b3e0a | |||
| cc72b8211b |
919 changed files with 28834 additions and 55368 deletions
.browserslistrc.editorconfig.env.example.gitignoreLICENSEMakefileREADME.mdVERSION
assets
README.md
common.css
common.js
css/misuzu
_input
_msz.cssanimations.cssauth
avatar.csschangelog
comments
confirm.csscontainer.cssemoticon.cssflags.cssfooter.cssforum
actions.csscategories.cssconfirm.cssheader.cssleaderboard.csspoll.csspost.csspriority.cssstatus.csstopics.css
header.csslanding.cssmanage
_manage.cssblacklist.csschangelog-actions-tags.cssemote.cssemotes.cssnavigation.cssrole-item.cssroles.cssstatistic.cssstatistics.csstag.csstags.cssuser-item.cssuser.cssusers.css
markdown.cssmessagebox.cssnavigation.cssnews
pagination.csspermissions.cssprofile
about.cssaccounts.cssbirthdate.cssguidelines.cssheader.cssprofile.cssrelations.csssignature.csswarning.css
search
|
|
@ -1 +0,0 @@
|
|||
last 5 versions, not dead
|
||||
|
|
@ -6,6 +6,3 @@ insert_final_newline = true
|
|||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 4
|
||||
|
||||
[Makefile]
|
||||
indent_style = tab
|
||||
|
|
|
|||
41
.env.example
41
.env.example
|
|
@ -1,41 +0,0 @@
|
|||
# Enable debug mode
|
||||
# Useful for debugging
|
||||
MSZ_DEBUG=1
|
||||
|
||||
# Database connection setting
|
||||
# This uses the Index library's DSN syntax
|
||||
# Currently Misuzu only supports MariaDB, or Null of course since that does nothing
|
||||
#
|
||||
# For normal TCP connection you can use the following syntax:
|
||||
#DATABASE_DSN="mariadb://username:password@hostname/dbname?charset=utf8mb4"
|
||||
#
|
||||
# For a UNIX socket connection you can use the following syntax:
|
||||
#DATABASE_DSN="mariadb://username:password@:unix:/dbname?socket=/path/to/mysqld.sock&charset=utf8mb4"
|
||||
#
|
||||
# And here's your unsensible default:
|
||||
DATABASE_DSN="null:"
|
||||
|
||||
# Sentry error reporting setting
|
||||
# I have not idea this works, just shove the value Sentry gives you in here.
|
||||
# You can also leave it commented.
|
||||
#SENTRY_DSN="https://6e41e3a2507d1542fd1e9aaf54f05d87@o4505858016870400.ingest.sentry.io/4505858023751680"
|
||||
|
||||
# Domain roles
|
||||
# This assigns what domain has what role, domains can also have multiple roles!
|
||||
# Pairs are split by ;, domain and role pairs are split by =, roles are split by , and if you want a prefix use :
|
||||
# The example below maps everything to localhost for development.
|
||||
# But to make things more understandable, the value for Flashii is also included
|
||||
#DOMAIN_ROLES="flashii.net=main; fii.moe=redirect"
|
||||
DOMAIN_ROLES="localhost=main,redirect:/go"
|
||||
|
||||
# Local storage path
|
||||
# This determines where uploaded files are stored. If left unset, the storage folder in the project tree will be used.
|
||||
#STORAGE_PATH_LOCAL="/path/to/storage"
|
||||
|
||||
# Remote storage path
|
||||
# Path on which the storage folder is exposed to the web for NGINX.
|
||||
#STORAGE_PATH_REMOTE="/_storage"
|
||||
|
||||
# Template cache directory
|
||||
# Writeable directory path to which template files are cached.
|
||||
#TEMPLATE_CACHE="/tmp/msz-tpl-cache"
|
||||
35
.gitignore
vendored
35
.gitignore
vendored
|
|
@ -1,63 +1,28 @@
|
|||
# Assets
|
||||
/public/assets
|
||||
/assets/current.json
|
||||
|
||||
# Libraries
|
||||
/vendor
|
||||
/node_modules
|
||||
/npm-debug.log
|
||||
/yarn-error.log
|
||||
/lib/index-dev
|
||||
/composer.local.json
|
||||
|
||||
# Configuration
|
||||
/.env
|
||||
/config/config.cfg
|
||||
/config/github.cfg
|
||||
/config/config.ini
|
||||
/config/github.ini
|
||||
/config/keys/*.pem
|
||||
/.debug
|
||||
/.migrating
|
||||
|
||||
# Storage
|
||||
/storage/*
|
||||
!/storage/.gitkeep
|
||||
/store
|
||||
|
||||
# OS specific
|
||||
[Tt]humbs.db
|
||||
[Dd]esktop.ini
|
||||
.DS_Store
|
||||
|
||||
# IDE specific
|
||||
.vscode/
|
||||
.vs/
|
||||
.idea/
|
||||
|
||||
# Vagrant things
|
||||
.vagrant/
|
||||
/devel/nginx/dhparam.pem
|
||||
/devel/nginx/misuzu.crt
|
||||
/devel/nginx/misuzu.key
|
||||
|
||||
# Compiled/copied assets
|
||||
/public/js
|
||||
/public/css
|
||||
/public/webfonts
|
||||
/assets/typescript/*.d.ts
|
||||
/public/errors.css
|
||||
/public/error-*.html
|
||||
|
||||
# Google
|
||||
/public/robots.txt
|
||||
|
||||
# Well known
|
||||
/public/.well-known
|
||||
|
||||
# moguu?
|
||||
/public/moguu.swf
|
||||
/public/moguu.html
|
||||
|
||||
# admin
|
||||
/public/admin
|
||||
|
|
|
|||
221
LICENSE
221
LICENSE
|
|
@ -1,30 +1,201 @@
|
|||
Copyright (c) 2017-2025, flashwave <me@flash.moe>
|
||||
All rights reserved.
|
||||
Apache License
|
||||
Version 2.0, January 2004
|
||||
http://www.apache.org/licenses/
|
||||
|
||||
Redistribution and use in source and binary forms, with or without
|
||||
modification, are permitted (subject to the limitations in the disclaimer
|
||||
below) provided that the following conditions are met:
|
||||
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||
|
||||
* Redistributions of source code must retain the above copyright notice,
|
||||
this list of conditions and the following disclaimer.
|
||||
1. Definitions.
|
||||
|
||||
* Redistributions in binary form must reproduce the above copyright
|
||||
notice, this list of conditions and the following disclaimer in the
|
||||
documentation and/or other materials provided with the distribution.
|
||||
"License" shall mean the terms and conditions for use, reproduction,
|
||||
and distribution as defined by Sections 1 through 9 of this document.
|
||||
|
||||
* Neither the name of the copyright holder nor the names of its
|
||||
contributors may be used to endorse or promote products derived from this
|
||||
software without specific prior written permission.
|
||||
"Licensor" shall mean the copyright owner or entity authorized by
|
||||
the copyright owner that is granting the License.
|
||||
|
||||
NO EXPRESS OR IMPLIED LICENSES TO ANY PARTY'S PATENT RIGHTS ARE GRANTED BY
|
||||
THIS LICENSE. THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND
|
||||
CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
|
||||
LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
|
||||
PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR
|
||||
CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
||||
EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
|
||||
PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR
|
||||
BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER
|
||||
IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
|
||||
ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE
|
||||
POSSIBILITY OF SUCH DAMAGE.
|
||||
"Legal Entity" shall mean the union of the acting entity and all
|
||||
other entities that control, are controlled by, or are under common
|
||||
control with that entity. For the purposes of this definition,
|
||||
"control" means (i) the power, direct or indirect, to cause the
|
||||
direction or management of such entity, whether by contract or
|
||||
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||
|
||||
"You" (or "Your") shall mean an individual or Legal Entity
|
||||
exercising permissions granted by this License.
|
||||
|
||||
"Source" form shall mean the preferred form for making modifications,
|
||||
including but not limited to software source code, documentation
|
||||
source, and configuration files.
|
||||
|
||||
"Object" form shall mean any form resulting from mechanical
|
||||
transformation or translation of a Source form, including but
|
||||
not limited to compiled object code, generated documentation,
|
||||
and conversions to other media types.
|
||||
|
||||
"Work" shall mean the work of authorship, whether in Source or
|
||||
Object form, made available under the License, as indicated by a
|
||||
copyright notice that is included in or attached to the work
|
||||
(an example is provided in the Appendix below).
|
||||
|
||||
"Derivative Works" shall mean any work, whether in Source or Object
|
||||
form, that is based on (or derived from) the Work and for which the
|
||||
editorial revisions, annotations, elaborations, or other modifications
|
||||
represent, as a whole, an original work of authorship. For the purposes
|
||||
of this License, Derivative Works shall not include works that remain
|
||||
separable from, or merely link (or bind by name) to the interfaces of,
|
||||
the Work and Derivative Works thereof.
|
||||
|
||||
"Contribution" shall mean any work of authorship, including
|
||||
the original version of the Work and any modifications or additions
|
||||
to that Work or Derivative Works thereof, that is intentionally
|
||||
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||
or by an individual or Legal Entity authorized to submit on behalf of
|
||||
the copyright owner. For the purposes of this definition, "submitted"
|
||||
means any form of electronic, verbal, or written communication sent
|
||||
to the Licensor or its representatives, including but not limited to
|
||||
communication on electronic mailing lists, source code control systems,
|
||||
and issue tracking systems that are managed by, or on behalf of, the
|
||||
Licensor for the purpose of discussing and improving the Work, but
|
||||
excluding communication that is conspicuously marked or otherwise
|
||||
designated in writing by the copyright owner as "Not a Contribution."
|
||||
|
||||
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||
on behalf of whom a Contribution has been received by Licensor and
|
||||
subsequently incorporated within the Work.
|
||||
|
||||
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
copyright license to reproduce, prepare Derivative Works of,
|
||||
publicly display, publicly perform, sublicense, and distribute the
|
||||
Work and such Derivative Works in Source or Object form.
|
||||
|
||||
3. Grant of Patent License. Subject to the terms and conditions of
|
||||
this License, each Contributor hereby grants to You a perpetual,
|
||||
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||
(except as stated in this section) patent license to make, have made,
|
||||
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||
where such license applies only to those patent claims licensable
|
||||
by such Contributor that are necessarily infringed by their
|
||||
Contribution(s) alone or by combination of their Contribution(s)
|
||||
with the Work to which such Contribution(s) was submitted. If You
|
||||
institute patent litigation against any entity (including a
|
||||
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||
or a Contribution incorporated within the Work constitutes direct
|
||||
or contributory patent infringement, then any patent licenses
|
||||
granted to You under this License for that Work shall terminate
|
||||
as of the date such litigation is filed.
|
||||
|
||||
4. Redistribution. You may reproduce and distribute copies of the
|
||||
Work or Derivative Works thereof in any medium, with or without
|
||||
modifications, and in Source or Object form, provided that You
|
||||
meet the following conditions:
|
||||
|
||||
(a) You must give any other recipients of the Work or
|
||||
Derivative Works a copy of this License; and
|
||||
|
||||
(b) You must cause any modified files to carry prominent notices
|
||||
stating that You changed the files; and
|
||||
|
||||
(c) You must retain, in the Source form of any Derivative Works
|
||||
that You distribute, all copyright, patent, trademark, and
|
||||
attribution notices from the Source form of the Work,
|
||||
excluding those notices that do not pertain to any part of
|
||||
the Derivative Works; and
|
||||
|
||||
(d) If the Work includes a "NOTICE" text file as part of its
|
||||
distribution, then any Derivative Works that You distribute must
|
||||
include a readable copy of the attribution notices contained
|
||||
within such NOTICE file, excluding those notices that do not
|
||||
pertain to any part of the Derivative Works, in at least one
|
||||
of the following places: within a NOTICE text file distributed
|
||||
as part of the Derivative Works; within the Source form or
|
||||
documentation, if provided along with the Derivative Works; or,
|
||||
within a display generated by the Derivative Works, if and
|
||||
wherever such third-party notices normally appear. The contents
|
||||
of the NOTICE file are for informational purposes only and
|
||||
do not modify the License. You may add Your own attribution
|
||||
notices within Derivative Works that You distribute, alongside
|
||||
or as an addendum to the NOTICE text from the Work, provided
|
||||
that such additional attribution notices cannot be construed
|
||||
as modifying the License.
|
||||
|
||||
You may add Your own copyright statement to Your modifications and
|
||||
may provide additional or different license terms and conditions
|
||||
for use, reproduction, or distribution of Your modifications, or
|
||||
for any such Derivative Works as a whole, provided Your use,
|
||||
reproduction, and distribution of the Work otherwise complies with
|
||||
the conditions stated in this License.
|
||||
|
||||
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||
any Contribution intentionally submitted for inclusion in the Work
|
||||
by You to the Licensor shall be under the terms and conditions of
|
||||
this License, without any additional terms or conditions.
|
||||
Notwithstanding the above, nothing herein shall supersede or modify
|
||||
the terms of any separate license agreement you may have executed
|
||||
with Licensor regarding such Contributions.
|
||||
|
||||
6. Trademarks. This License does not grant permission to use the trade
|
||||
names, trademarks, service marks, or product names of the Licensor,
|
||||
except as required for reasonable and customary use in describing the
|
||||
origin of the Work and reproducing the content of the NOTICE file.
|
||||
|
||||
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||
agreed to in writing, Licensor provides the Work (and each
|
||||
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||
implied, including, without limitation, any warranties or conditions
|
||||
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||
appropriateness of using or redistributing the Work and assume any
|
||||
risks associated with Your exercise of permissions under this License.
|
||||
|
||||
8. Limitation of Liability. In no event and under no legal theory,
|
||||
whether in tort (including negligence), contract, or otherwise,
|
||||
unless required by applicable law (such as deliberate and grossly
|
||||
negligent acts) or agreed to in writing, shall any Contributor be
|
||||
liable to You for damages, including any direct, indirect, special,
|
||||
incidental, or consequential damages of any character arising as a
|
||||
result of this License or out of the use or inability to use the
|
||||
Work (including but not limited to damages for loss of goodwill,
|
||||
work stoppage, computer failure or malfunction, or any and all
|
||||
other commercial damages or losses), even if such Contributor
|
||||
has been advised of the possibility of such damages.
|
||||
|
||||
9. Accepting Warranty or Additional Liability. While redistributing
|
||||
the Work or Derivative Works thereof, You may choose to offer,
|
||||
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||
or other liability obligations and/or rights consistent with this
|
||||
License. However, in accepting such obligations, You may act only
|
||||
on Your own behalf and on Your sole responsibility, not on behalf
|
||||
of any other Contributor, and only if You agree to indemnify,
|
||||
defend, and hold each Contributor harmless for any liability
|
||||
incurred by, or claims asserted against, such Contributor by reason
|
||||
of your accepting any such warranty or additional liability.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
APPENDIX: How to apply the Apache License to your work.
|
||||
|
||||
To apply the Apache License to your work, attach the following
|
||||
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||
replaced with your own identifying information. (Don't include
|
||||
the brackets!) The text should be enclosed in the appropriate
|
||||
comment syntax for the file format. We also recommend that a
|
||||
file or class name and description of purpose be included on the
|
||||
same "printed page" as the copyright notice for easier
|
||||
identification within third-party archives.
|
||||
|
||||
Copyright (c) 2017-2019, flashwave <me@flash.moe>
|
||||
|
||||
Licensed under the Apache License, Version 2.0 (the "License");
|
||||
you may not use this file except in compliance with the License.
|
||||
You may obtain a copy of the License at
|
||||
|
||||
http://www.apache.org/licenses/LICENSE-2.0
|
||||
|
||||
Unless required by applicable law or agreed to in writing, software
|
||||
distributed under the License is distributed on an "AS IS" BASIS,
|
||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
See the License for the specific language governing permissions and
|
||||
limitations under the License.
|
||||
|
|
|
|||
58
Makefile
58
Makefile
|
|
@ -1,58 +0,0 @@
|
|||
PHP_EXE := $(shell which php8.4)
|
||||
COMPOSER_EXE := $(shell which composer)
|
||||
NODE_EXE := $(shell which node)
|
||||
NPM_EXE := $(shell which npm)
|
||||
SUDO_EXE := $(shell which sudo)
|
||||
|
||||
WWW_USER := www-data
|
||||
BUILD_EXE := build.js
|
||||
ENV_FILE := .env
|
||||
TOOLS_DIR := tools
|
||||
VENDOR_DIR := vendor
|
||||
|
||||
all: install migrate clear-cache build cron
|
||||
|
||||
install: composer_install npm_install
|
||||
|
||||
composer_install:
|
||||
${PHP_EXE} ${COMPOSER_EXE} install
|
||||
|
||||
npm_install:
|
||||
${NPM_EXE} ci
|
||||
|
||||
update: composer_update npm_update
|
||||
|
||||
composer_update:
|
||||
${PHP_EXE} ${COMPOSER_EXE} update
|
||||
|
||||
npm_update:
|
||||
${NPM_EXE} update --save
|
||||
|
||||
migrate:
|
||||
${SUDO_EXE} -u ${WWW_USER} ${PHP_EXE} ${TOOLS_DIR}/migrate
|
||||
|
||||
clear-cache:
|
||||
${SUDO_EXE} -u ${WWW_USER} ${PHP_EXE} ${TOOLS_DIR}/nuke-tpl-cache
|
||||
|
||||
cron:
|
||||
${SUDO_EXE} -u ${WWW_USER} ${PHP_EXE} ${TOOLS_DIR}/cron slow
|
||||
|
||||
build:
|
||||
${NODE_EXE} --env-file-if-exists ${ENV_FILE} ${BUILD_EXE}
|
||||
|
||||
rebuild-css:
|
||||
${NODE_EXE} --env-file-if-exists ${ENV_FILE} ${BUILD_EXE} css
|
||||
|
||||
rebuild-js:
|
||||
${NODE_EXE} --env-file-if-exists ${ENV_FILE} ${BUILD_EXE} js
|
||||
|
||||
rebuild-twig:
|
||||
${NODE_EXE} --env-file-if-exists ${ENV_FILE} ${BUILD_EXE} twig
|
||||
|
||||
analyse:
|
||||
${PHP_EXE} ${VENDOR_DIR}/bin/phpstan
|
||||
|
||||
tag: analyse
|
||||
${PHP_EXE} ${TOOLS_DIR}/create-tag
|
||||
|
||||
.PHONY: all update composer npm build rebuild-css rebuild-js rebuild-twig migrate clear-cache cron analyse tag
|
||||
|
|
@ -2,6 +2,6 @@
|
|||
> Misuzu can and will steal your lunch money.
|
||||
|
||||
## Requirements
|
||||
- PHP 8.4
|
||||
- MariaDB 11.4
|
||||
- PHP 7.4
|
||||
- MariaDB 10.4
|
||||
- [Composer](https://getcomposer.org/)
|
||||
|
|
|
|||
1
VERSION
1
VERSION
|
|
@ -1 +0,0 @@
|
|||
20250616.1
|
||||
6
assets/README.md
Normal file
6
assets/README.md
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
# Misuzu Assets
|
||||
|
||||
Subdirectories of the `css` and `js` folder are accessible through the web as `example.com/assets/<subdirectory>.<directory>`.
|
||||
Meaning `/assets/js/misuzu` is accessible as `/assets/misuzu.js`.
|
||||
Files are concatenated recursively, files first then directories in alphabetical order.
|
||||
Use `_` prefixes to raise things up.
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
.msz-loading {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
min-width: var(--msz-loading-container-width, calc(var(--msz-loading-size, 1) * 100px));
|
||||
min-height: var(--msz-loading-container-height, calc(var(--msz-loading-size, 1) * 100px));
|
||||
}
|
||||
.msz-loading-inline {
|
||||
display: inline-flex;
|
||||
min-width: 0;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.msz-loading-frame {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.msz-loading-icon {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: repeat(3, 1fr);
|
||||
gap: var(--msz-loading-gap, calc(var(--msz-loading-size, 1) * 1px));
|
||||
margin: var(--msz-loading-margin, calc(var(--msz-loading-size, 1) * 10px));
|
||||
}
|
||||
|
||||
.msz-loading-icon-block {
|
||||
background: var(--msz-loading-colour, currentColor);
|
||||
width: var(--msz-loading-width, calc(var(--msz-loading-size, 1) * 10px));
|
||||
height: var(--msz-loading-height, calc(var(--msz-loading-size, 1) * 10px));
|
||||
}
|
||||
|
||||
.msz-loading-icon-block-hidden {
|
||||
opacity: 0;
|
||||
}
|
||||
|
|
@ -1,33 +0,0 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html, body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
[hidden],
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
:root {
|
||||
--font-regular: Inter, 'Zen Kaku Gothic New', sans-serif;
|
||||
--font-monospace: 'Victor Mono', monospace;
|
||||
font-feature-settings: 'calt' 1, 'dlig' 1, 'ss01' 1;
|
||||
font-optical-sizing: auto;
|
||||
}
|
||||
|
||||
@supports (font-variation-settings: normal) {
|
||||
:root {
|
||||
--font-regular: InterVariable, 'Zen Kaku Gothic New', sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
@include loading.css;
|
||||
@include perf.css;
|
||||
|
|
@ -1,101 +0,0 @@
|
|||
.msz-perfs {
|
||||
position: fixed;
|
||||
bottom: 4px;
|
||||
left: 4px;
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
flex-direction: column-reverse;
|
||||
align-items: flex-start;
|
||||
opacity: .5;
|
||||
}
|
||||
.msz-perfs-right {
|
||||
left: initial;
|
||||
right: 4px;
|
||||
}
|
||||
.msz-perfs:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.msz-perf {
|
||||
background-color: #111d;
|
||||
color: #fff;
|
||||
font-family: var(--font-monospace);
|
||||
font-feature-settings: 'ss07' 1;
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
padding: 4px 8px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
.msz-perfs:hover .msz-perf {
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.msz-perf-number {
|
||||
color: #fff;
|
||||
}
|
||||
.msz-perf-unit {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.msz-perf-header {
|
||||
display: flex;
|
||||
flex: 0 0 auto;
|
||||
gap: 4px;
|
||||
}
|
||||
.msz-perf:hover .msz-perf-header {
|
||||
border-bottom: 1px solid #888;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.msz-perf-type {
|
||||
flex: 0 0 auto;
|
||||
font-weight: 700;
|
||||
min-width: 60px;
|
||||
}
|
||||
.msz-perf-type-navigation {
|
||||
color: #f0f;
|
||||
}
|
||||
.msz-perf-type-other {
|
||||
color: #0ff;
|
||||
}
|
||||
|
||||
.msz-perf-target {
|
||||
flex: 1 0 auto;
|
||||
min-width: 200px;
|
||||
}
|
||||
.msz-perf-target-host,
|
||||
.msz-perf-target-path,
|
||||
.msz-perf-target-query {
|
||||
display: inline-block;
|
||||
}
|
||||
.msz-perf-target-host,
|
||||
.msz-perf-target-query {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.msz-perf-total {
|
||||
flex: 0 0 auto;
|
||||
min-width: 80px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.msz-perf-timings {
|
||||
display: none;
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
}
|
||||
.msz-perf:hover .msz-perf-timings {
|
||||
display: table;
|
||||
}
|
||||
|
||||
.msz-perf-timing-name {
|
||||
font-weight: 700;
|
||||
min-width: 60px;
|
||||
}
|
||||
.msz-perf-timing-comment {
|
||||
color: #888;
|
||||
}
|
||||
.msz-perf-timing-duration {
|
||||
min-width: 80px;
|
||||
text-align: right;
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
const $arrayRemoveAt = function(array, index) {
|
||||
array.splice(index, 1);
|
||||
};
|
||||
|
||||
const $arrayRemoveValue = function(array, item) {
|
||||
let index;
|
||||
while(array.length > 0 && (index = array.indexOf(item)) >= 0)
|
||||
$arrayRemoveAt(array, index);
|
||||
};
|
||||
|
||||
const $arrayRemoveAny = function(array, predicate) {
|
||||
let index;
|
||||
while(array.length > 0 && (index = array.findIndex(predicate)) >= 0)
|
||||
$arrayRemoveAt(array, index);
|
||||
};
|
||||
|
||||
const $arrayShuffle = function(array) {
|
||||
if(array.length < 2)
|
||||
return;
|
||||
|
||||
for(let i = array.length - 1; i > 0; --i) {
|
||||
const j = Math.floor(Math.random() * (i + 1));
|
||||
const tmp = array[i];
|
||||
array[i] = array[j];
|
||||
array[j] = tmp;
|
||||
}
|
||||
};
|
||||
|
|
@ -1,24 +0,0 @@
|
|||
#include html.js
|
||||
|
||||
const $csrf = (() => {
|
||||
let elem;
|
||||
const getElement = () => {
|
||||
if(elem === undefined)
|
||||
elem = $query('meta[name="csrf-token"]');
|
||||
return elem;
|
||||
};
|
||||
|
||||
return {
|
||||
get token() {
|
||||
return getElement()?.content ?? '';
|
||||
},
|
||||
set token(token) {
|
||||
if(typeof token !== 'string')
|
||||
throw 'token must be a string';
|
||||
|
||||
const elem = getElement();
|
||||
if(elem instanceof HTMLMetaElement)
|
||||
elem.content = token;
|
||||
},
|
||||
};
|
||||
})();
|
||||
|
|
@ -1,157 +0,0 @@
|
|||
const $id = document.getElementById.bind(document);
|
||||
const $query = document.querySelector.bind(document);
|
||||
const $queryAll = document.querySelectorAll.bind(document);
|
||||
const $text = document.createTextNode.bind(document);
|
||||
|
||||
const $insertBefore = function(target, element) {
|
||||
target.parentNode.insertBefore(element, target);
|
||||
};
|
||||
|
||||
const $appendChild = function(element, child) {
|
||||
switch(typeof child) {
|
||||
case 'undefined':
|
||||
break;
|
||||
|
||||
case 'string':
|
||||
element.appendChild($text(child));
|
||||
break;
|
||||
|
||||
case 'function':
|
||||
$appendChild(element, child());
|
||||
break;
|
||||
|
||||
case 'object':
|
||||
if(child === null)
|
||||
break;
|
||||
|
||||
if(child instanceof Node)
|
||||
element.appendChild(child);
|
||||
else if(child?.element instanceof Node)
|
||||
element.appendChild(child.element);
|
||||
else if(typeof child?.toString === 'function')
|
||||
element.appendChild($text(child.toString()));
|
||||
break;
|
||||
|
||||
default:
|
||||
element.appendChild($text(child.toString()));
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
const $appendChildren = function(element, ...children) {
|
||||
for(const child of children)
|
||||
$appendChild(element, child);
|
||||
};
|
||||
|
||||
const $removeChild = function(element, child) {
|
||||
switch(typeof child) {
|
||||
case 'function':
|
||||
$removeChild(element, child());
|
||||
break;
|
||||
|
||||
case 'object':
|
||||
if(child === null)
|
||||
break;
|
||||
|
||||
if(child instanceof Node)
|
||||
element.removeChild(child);
|
||||
else if(child?.element instanceof Node)
|
||||
element.removeChild(child.element);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
const $removeChildren = function(element) {
|
||||
while(element.lastChild)
|
||||
element.removeChild(element.lastChild);
|
||||
};
|
||||
|
||||
const $fragment = function(props, ...children) {
|
||||
const fragment = document.createDocumentFragment();
|
||||
$appendChildren(fragment, ...children);
|
||||
return fragment;
|
||||
};
|
||||
|
||||
const $element = function(type, props, ...children) {
|
||||
if(typeof type === 'function')
|
||||
return new type(props ?? {}, ...children);
|
||||
|
||||
const element = document.createElement(type ?? 'div');
|
||||
|
||||
if(props)
|
||||
for(let key in props) {
|
||||
const prop = props[key];
|
||||
if(prop === undefined || prop === null)
|
||||
continue;
|
||||
|
||||
switch(typeof prop) {
|
||||
case 'function':
|
||||
if(key.substring(0, 2) === 'on')
|
||||
key = key.substring(2).toLowerCase();
|
||||
element.addEventListener(key, prop);
|
||||
break;
|
||||
|
||||
case 'object':
|
||||
if(prop instanceof Array) {
|
||||
if(key === 'class')
|
||||
key = 'classList';
|
||||
|
||||
const attr = element[key];
|
||||
let addFunc = null;
|
||||
|
||||
if(attr instanceof Array)
|
||||
addFunc = attr.push.bind(attr);
|
||||
else if(attr instanceof DOMTokenList)
|
||||
addFunc = attr.add.bind(attr);
|
||||
|
||||
if(addFunc !== null) {
|
||||
for(let j = 0; j < prop.length; ++j)
|
||||
addFunc(prop[j]);
|
||||
} else {
|
||||
if(key === 'classList')
|
||||
key = 'class';
|
||||
element.setAttribute(key, prop.toString());
|
||||
}
|
||||
} else {
|
||||
if(key === 'class' || key === 'className')
|
||||
key = 'classList';
|
||||
|
||||
let setFunc = null;
|
||||
if(element[key] instanceof DOMTokenList)
|
||||
setFunc = (ak, av) => { if(av) element[key].add(ak); };
|
||||
else if(element[key] instanceof CSSStyleDeclaration)
|
||||
setFunc = (ak, av) => {
|
||||
if(ak.includes('-'))
|
||||
element[key].setProperty(ak, av);
|
||||
else
|
||||
element[key][ak] = av;
|
||||
};
|
||||
else
|
||||
setFunc = (ak, av) => { element[key][ak] = av; };
|
||||
|
||||
for(const attrKey in prop) {
|
||||
const attrValue = prop[attrKey];
|
||||
if(attrValue)
|
||||
setFunc(attrKey, attrValue);
|
||||
}
|
||||
}
|
||||
break;
|
||||
|
||||
case 'boolean':
|
||||
if(prop)
|
||||
element.setAttribute(key, '');
|
||||
break;
|
||||
|
||||
default:
|
||||
if(key === 'className')
|
||||
key = 'class';
|
||||
|
||||
element.setAttribute(key, prop.toString());
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
$appendChildren(element, ...children);
|
||||
|
||||
return element;
|
||||
};
|
||||
|
|
@ -1,183 +0,0 @@
|
|||
const MszLoadingIcon = function() {
|
||||
const element = <div class="msz-loading-icon"/>;
|
||||
for(let i = 0; i < 9; ++i)
|
||||
element.appendChild(<div class="msz-loading-icon-block"/>);
|
||||
|
||||
// this is moderately cursed but it'll do
|
||||
const blocks = [
|
||||
element.children[3],
|
||||
element.children[0],
|
||||
element.children[1],
|
||||
element.children[2],
|
||||
element.children[5],
|
||||
element.children[8],
|
||||
element.children[7],
|
||||
element.children[6],
|
||||
];
|
||||
|
||||
let tsLastUpdate;
|
||||
let counter = 0;
|
||||
let playing = false;
|
||||
let delay = 50;
|
||||
let playResolve;
|
||||
let pauseResolve;
|
||||
|
||||
const update = tsCurrent => {
|
||||
try {
|
||||
if(tsLastUpdate !== undefined && (tsCurrent - tsLastUpdate) < delay)
|
||||
return;
|
||||
tsLastUpdate = tsCurrent;
|
||||
|
||||
for(let i = 0; i < blocks.length; ++i)
|
||||
blocks[(counter + i) % blocks.length].classList.toggle('msz-loading-icon-block-hidden', i < 3);
|
||||
|
||||
++counter;
|
||||
} finally {
|
||||
if(playResolve)
|
||||
try {
|
||||
playResolve();
|
||||
} finally {
|
||||
playResolve = undefined;
|
||||
playing = true;
|
||||
}
|
||||
|
||||
if(pauseResolve)
|
||||
try {
|
||||
pauseResolve();
|
||||
} finally {
|
||||
pauseResolve = undefined;
|
||||
playing = false;
|
||||
}
|
||||
|
||||
if(playing)
|
||||
requestAnimationFrame(update);
|
||||
}
|
||||
};
|
||||
|
||||
const play = () => {
|
||||
return new Promise(resolve => {
|
||||
if(playing || playResolve) {
|
||||
resolve();
|
||||
return;
|
||||
}
|
||||
|
||||
playResolve = resolve;
|
||||
requestAnimationFrame(update);
|
||||
});
|
||||
};
|
||||
const pause = () => {
|
||||
return new Promise(resolve => {
|
||||
if(!playing || pauseResolve) {
|
||||
resolve();
|
||||
return;
|
||||
}
|
||||
|
||||
pauseResolve = resolve;
|
||||
});
|
||||
};
|
||||
const stop = async () => {
|
||||
await pause();
|
||||
counter = 0;
|
||||
};
|
||||
const restart = async () => {
|
||||
await stop();
|
||||
await play();
|
||||
};
|
||||
const reverse = () => {
|
||||
blocks.reverse();
|
||||
};
|
||||
const setBlock = (num, state=null) => {
|
||||
element.children[num].classList.toggle('msz-loading-icon-block-hidden', !state);
|
||||
};
|
||||
const batsu = () => {
|
||||
setBlock(0, true);setBlock(1, false);setBlock(2, true);
|
||||
setBlock(3, false);setBlock(4, true);setBlock(5, false);
|
||||
setBlock(6, true);setBlock(7, false);setBlock(8, true);
|
||||
};
|
||||
const maru = () => {
|
||||
setBlock(0, true);setBlock(1, true);setBlock(2, true);
|
||||
setBlock(3, true);setBlock(4, false);setBlock(5, true);
|
||||
setBlock(6, true);setBlock(7, true);setBlock(8, true);
|
||||
};
|
||||
|
||||
return {
|
||||
get element() { return element; },
|
||||
get playing() { return playing; },
|
||||
get delay() { return delay; },
|
||||
set delay(value) {
|
||||
if(typeof value !== 'number')
|
||||
value = parseFloat(value);
|
||||
if(isNaN(value) || !isFinite(value))
|
||||
return;
|
||||
if(value < 0)
|
||||
value = Math.abs(value);
|
||||
delay = value;
|
||||
},
|
||||
|
||||
play,
|
||||
pause,
|
||||
stop,
|
||||
restart,
|
||||
reverse,
|
||||
batsu,
|
||||
maru,
|
||||
};
|
||||
};
|
||||
|
||||
const MszLoading = function(options=null) {
|
||||
if(typeof options !== 'object')
|
||||
throw 'options must be an object';
|
||||
|
||||
let {
|
||||
element, size, colour,
|
||||
width, height, inline,
|
||||
containerWidth, containerHeight,
|
||||
gap, margin, hidden,
|
||||
} = options ?? {};
|
||||
|
||||
if(typeof element === 'string')
|
||||
element = document.querySelector(element);
|
||||
if(!(element instanceof HTMLElement))
|
||||
element = <div class="msz-loading"/>;
|
||||
|
||||
if(!element.classList.contains('msz-loading'))
|
||||
element.classList.add('msz-loading');
|
||||
if(inline)
|
||||
element.classList.add('msz-loading-inline');
|
||||
if(hidden)
|
||||
element.classList.add('hidden');
|
||||
|
||||
if(typeof size === 'number' && size > 0)
|
||||
element.style.setProperty('--msz-loading-size', size);
|
||||
if(typeof containerWidth === 'string')
|
||||
element.style.setProperty('--msz-loading-container-width', containerWidth);
|
||||
if(typeof containerHeight === 'string')
|
||||
element.style.setProperty('--msz-loading-container-height', containerHeight);
|
||||
if(typeof gap === 'string')
|
||||
element.style.setProperty('--msz-loading-gap', gap);
|
||||
if(typeof margin === 'string')
|
||||
element.style.setProperty('--msz-loading-margin', margin);
|
||||
if(typeof width === 'string')
|
||||
element.style.setProperty('--msz-loading-width', width);
|
||||
if(typeof height === 'string')
|
||||
element.style.setProperty('--msz-loading-height', height);
|
||||
if(typeof colour === 'string')
|
||||
element.style.setProperty('--msz-loading-colour', colour);
|
||||
|
||||
let icon;
|
||||
if(element.childElementCount < 1) {
|
||||
icon = new MszLoadingIcon;
|
||||
icon.play();
|
||||
element.appendChild(<div class="msz-loading-frame">{icon}</div>);
|
||||
}
|
||||
|
||||
return {
|
||||
get element() { return element; },
|
||||
|
||||
get hasIcon() { return icon !== undefined; },
|
||||
get icon() { return icon; },
|
||||
|
||||
get visible() { return !element.classList.contains('hidden'); },
|
||||
set visible(state) { element.classList.toggle('hidden', !state); },
|
||||
};
|
||||
};
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
#include array.js
|
||||
#include csrf.js
|
||||
#include html.js
|
||||
#include meta.js
|
||||
#include perf.jsx
|
||||
#include uniqstr.js
|
||||
#include xhr.js
|
||||
|
||||
#include loading.jsx
|
||||
|
|
@ -1,36 +0,0 @@
|
|||
#include html.js
|
||||
|
||||
const $meta = (() => {
|
||||
return {
|
||||
get(name, prefixed=true) {
|
||||
if(!name) return;
|
||||
if(prefixed) name = `msz-${name}`;
|
||||
|
||||
const elem = $query(`meta[name="${name}"]`);
|
||||
if(elem instanceof HTMLMetaElement && typeof elem.content === 'string')
|
||||
return elem.content;
|
||||
|
||||
return null;
|
||||
},
|
||||
set(name, value, prefixed=true) {
|
||||
if(!name) return;
|
||||
if(prefixed) name = `msz-${name}`;
|
||||
|
||||
let elem = $query(`meta[name="${name}"]`);
|
||||
if(elem instanceof HTMLMetaElement) {
|
||||
if(typeof value === 'string')
|
||||
elem.content = value;
|
||||
else
|
||||
elem.remove();
|
||||
} else {
|
||||
if(typeof value !== 'string')
|
||||
return;
|
||||
|
||||
elem = document.createElement('meta');
|
||||
elem.name = name;
|
||||
elem.content = value;
|
||||
document.head.appendChild(elem);
|
||||
}
|
||||
},
|
||||
};
|
||||
})();
|
||||
|
|
@ -1,72 +0,0 @@
|
|||
#include html.js
|
||||
|
||||
(() => {
|
||||
const perfs = <div class="msz-perfs"/>;
|
||||
perfs.ondblclick = () => {
|
||||
perfs.classList.toggle('msz-perfs-right');
|
||||
};
|
||||
|
||||
const appendReal = elem => {
|
||||
$appendChild(perfs, elem);
|
||||
};
|
||||
|
||||
let append = elem => {
|
||||
append = appendReal;
|
||||
$appendChild(document.body, perfs);
|
||||
appendReal(elem);
|
||||
};
|
||||
|
||||
(new PerformanceObserver(list => {
|
||||
for(const entry of list.getEntries()) {
|
||||
if(entry.serverTiming.length < 1)
|
||||
break;
|
||||
|
||||
const url = new URL(entry.name);
|
||||
|
||||
let total = 0;
|
||||
let queries = -1;
|
||||
const timings = <table class="msz-perf-timings"/>;
|
||||
for(const timing of entry.serverTiming) {
|
||||
if(timing.name === 'msz-queries') {
|
||||
queries = Math.ceil(timing.duration);
|
||||
continue;
|
||||
}
|
||||
|
||||
total += timing.duration;
|
||||
$appendChild(timings, <tr class="msz-perf-timing">
|
||||
<td class="msz-perf-timing-name">{timing.name}</td>
|
||||
<td class="msz-perf-timing-comment">{decodeURIComponent(timing.description)}</td>
|
||||
<td class="msz-perf-timing-duration">
|
||||
<span class="msz-perf-number">{timing.duration}</span>
|
||||
<span class="msz-perf-unit">ms</span>
|
||||
</td>
|
||||
</tr>);
|
||||
}
|
||||
|
||||
append(<div class="msz-perf">
|
||||
<div class="msz-perf-header">
|
||||
<div class={`msz-perf-type msz-perf-type-${entry instanceof PerformanceNavigationTiming ? 'navigation' : 'other'}`}>
|
||||
{entry instanceof PerformanceNavigationTiming ? entry.type : (
|
||||
entry.initiatorType === 'xmlhttprequest' ? 'xhr' : entry.initiatorType
|
||||
)}
|
||||
</div>
|
||||
<div class="msz-perf-target">
|
||||
{url.host !== location.host ? <div class="msz-perf-target-host">{url.host}</div> : null}
|
||||
<div class="msz-perf-target-path">{url.pathname}</div>
|
||||
{url.search !== '' ? <div class="msz-perf-target-query">{url.search}</div> : null}
|
||||
</div>
|
||||
{queries > 0 ? <div class="msz-perf-total">
|
||||
<span class="msz-perf-number">{queries}</span>
|
||||
{' '}
|
||||
<span class="msz-perf-unit">{queries === 1 ? 'query' : 'queries'}</span>
|
||||
</div> : null}
|
||||
<div class="msz-perf-total">
|
||||
<span class="msz-perf-number">{total.toFixed(5)}</span>
|
||||
<span class="msz-perf-unit">ms</span>
|
||||
</div>
|
||||
</div>
|
||||
{timings}
|
||||
</div>);
|
||||
}
|
||||
})).observe({ entryTypes: ['navigation', 'resource'] });
|
||||
})();
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
const $rngi = function(min, max) {
|
||||
let ret = 0;
|
||||
const range = max - min;
|
||||
|
||||
const bitsNeeded = Math.ceil(Math.log2(range));
|
||||
if(bitsNeeded > 53)
|
||||
return -1;
|
||||
|
||||
const bytesNeeded = Math.ceil(bitsNeeded / 8),
|
||||
mask = Math.pow(2, bitsNeeded) - 1;
|
||||
|
||||
const bytes = new Uint8Array(bytesNeeded);
|
||||
crypto.getRandomValues(bytes);
|
||||
|
||||
let p = (bytesNeeded - 1) * 8;
|
||||
for(let i = 0; i < bytesNeeded; ++i) {
|
||||
ret += bytes[i] * Math.pow(2, p);
|
||||
p -= 8;
|
||||
}
|
||||
|
||||
ret &= mask;
|
||||
|
||||
if(ret >= range)
|
||||
return $rngi(min, max);
|
||||
|
||||
return min + ret;
|
||||
};
|
||||
|
||||
const $rngs = (function() {
|
||||
const chars = 'AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz0123456789';
|
||||
|
||||
return function(length) {
|
||||
let str = '';
|
||||
for(let i = 0; i < length; ++i)
|
||||
str += chars[$rngi(0, chars.length)];
|
||||
return str;
|
||||
};
|
||||
})();
|
||||
|
|
@ -1,117 +0,0 @@
|
|||
#include csrf.js
|
||||
|
||||
const $xhr = (function() {
|
||||
const send = function(method, url, options, body) {
|
||||
if(options === undefined)
|
||||
options = {};
|
||||
else if(typeof options !== 'object')
|
||||
throw 'options must be undefined or an object';
|
||||
|
||||
Object.freeze(options);
|
||||
|
||||
const xhr = new XMLHttpRequest;
|
||||
const requestHeaders = new Map;
|
||||
|
||||
if('headers' in options && typeof options.headers === 'object')
|
||||
for(const name in options.headers)
|
||||
if(options.headers.hasOwnProperty(name))
|
||||
requestHeaders.set(name.toLowerCase(), options.headers[name]);
|
||||
|
||||
if(options.csrf)
|
||||
requestHeaders.set('x-csrf-token', $csrf.token);
|
||||
|
||||
if(typeof options.download === 'function') {
|
||||
xhr.onloadstart = ev => options.download(ev);
|
||||
xhr.onprogress = ev => options.download(ev);
|
||||
xhr.onloadend = ev => options.download(ev);
|
||||
}
|
||||
|
||||
if(typeof options.upload === 'function') {
|
||||
xhr.upload.onloadstart = ev => options.upload(ev);
|
||||
xhr.upload.onprogress = ev => options.upload(ev);
|
||||
xhr.upload.onloadend = ev => options.upload(ev);
|
||||
}
|
||||
|
||||
if(options.authed)
|
||||
xhr.withCredentials = true;
|
||||
|
||||
if(typeof options.timeout === 'number')
|
||||
xhr.timeout = options.timeout;
|
||||
|
||||
if(typeof options.type === 'string')
|
||||
xhr.responseType = options.type;
|
||||
|
||||
if(typeof options.abort === 'function')
|
||||
options.abort(() => xhr.abort());
|
||||
|
||||
if(typeof options.xhr === 'function')
|
||||
options.xhr(() => xhr);
|
||||
|
||||
if(typeof body === 'object') {
|
||||
if(body instanceof URLSearchParams) {
|
||||
requestHeaders.set('content-type', 'application/x-www-form-urlencoded');
|
||||
} else if(body instanceof FormData) {
|
||||
// content-type is implicitly set
|
||||
} else if(body instanceof Blob || body instanceof ArrayBuffer || body instanceof DataView) {
|
||||
if(!requestHeaders.has('content-type'))
|
||||
requestHeaders.set('content-type', 'application/octet-stream');
|
||||
} else if(!requestHeaders.has('content-type')) {
|
||||
const bodyParts = [];
|
||||
for(const name in body)
|
||||
if(body.hasOwnProperty(name))
|
||||
bodyParts.push(encodeURIComponent(name) + '=' + encodeURIComponent(body[name]));
|
||||
body = bodyParts.join('&');
|
||||
requestHeaders.set('content-type', 'application/x-www-form-urlencoded');
|
||||
}
|
||||
}
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
xhr.onload = ev => {
|
||||
const headers = (headersString => {
|
||||
const headers = new Map;
|
||||
|
||||
const raw = headersString.trim().split(/[\r\n]+/);
|
||||
for(const name in raw)
|
||||
if(raw.hasOwnProperty(name)) {
|
||||
const parts = raw[name].split(': ');
|
||||
headers.set(parts.shift(), parts.join(': '));
|
||||
}
|
||||
|
||||
return headers;
|
||||
})(xhr.getAllResponseHeaders());
|
||||
|
||||
if(headers.has('x-csrf-token'))
|
||||
$csrf.token = headers.get('x-csrf-token');
|
||||
|
||||
resolve({
|
||||
get ev() { return ev; },
|
||||
get xhr() { return xhr; },
|
||||
|
||||
get status() { return xhr.status; },
|
||||
get headers() { return headers; },
|
||||
get body() { return xhr.response; },
|
||||
get text() { return xhr.responseText; },
|
||||
});
|
||||
};
|
||||
|
||||
xhr.onerror = ev => reject({
|
||||
xhr: xhr,
|
||||
ev: ev,
|
||||
});
|
||||
|
||||
xhr.open(method, url);
|
||||
for(const [name, value] of requestHeaders)
|
||||
xhr.setRequestHeader(name, value);
|
||||
xhr.send(body);
|
||||
});
|
||||
};
|
||||
|
||||
return {
|
||||
send: send,
|
||||
get: (url, options, body) => send('GET', url, options, body),
|
||||
post: (url, options, body) => send('POST', url, options, body),
|
||||
delete: (url, options, body) => send('DELETE', url, options, body),
|
||||
patch: (url, options, body) => send('PATCH', url, options, body),
|
||||
put: (url, options, body) => send('PUT', url, options, body),
|
||||
};
|
||||
})();
|
||||
|
|
@ -1,7 +1,9 @@
|
|||
.input__button {
|
||||
background-color: var(--background-colour);
|
||||
font-family: var(--font-regular);
|
||||
padding: 4px 12px;
|
||||
font-size: 1.2em;
|
||||
line-height: 1.4em;
|
||||
padding: 5px 10px;
|
||||
min-width: 80px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
|
|
@ -13,8 +15,6 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
text-decoration: none;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
.input__button:hover, .input__button:active,
|
||||
.input__button:focus, .input__button:checked,
|
||||
|
|
@ -4,12 +4,10 @@
|
|||
background: #222;
|
||||
color: #fff;
|
||||
min-width: 150px;
|
||||
font-size: 1.2em;
|
||||
border-radius: 2px;
|
||||
box-shadow: inset 0 0 4px #111;
|
||||
transition: border-color .2s;
|
||||
font-family: inherit;
|
||||
font-size: 1em;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
.input__select:focus {
|
||||
border-color: var(--accent-colour);
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
.input__text {
|
||||
font-size: 1.2em;
|
||||
border: 1px solid #222;
|
||||
padding: 5px 10px;
|
||||
background: #222;
|
||||
|
|
@ -6,11 +7,8 @@
|
|||
border-radius: 2px;
|
||||
box-shadow: inset 0 0 4px #111;
|
||||
transition: border-color .2s;
|
||||
font-family: inherit;
|
||||
font-size: 1em;
|
||||
line-height: 1.25em;
|
||||
}
|
||||
.input__text:focus { border-color: var(--accent-colour); }
|
||||
.input__text--readonly { color: #888; }
|
||||
.input__text--monospace { font-family: var(--font-monospace); font-feature-settings: 'ss07' 1; }
|
||||
.input__text--monospace { font-family: var(--font-monospace); }
|
||||
.input__text--centre { text-align: center; }
|
||||
|
|
@ -1,11 +1,11 @@
|
|||
.input__textarea {
|
||||
font-size: 1.2em;
|
||||
border: 1px solid #222;
|
||||
padding: 4px 12px;
|
||||
padding: 5px 10px;
|
||||
vertical-align: bottom;
|
||||
background: #222;
|
||||
color: #fff;
|
||||
font-family: var(--font-monospace);
|
||||
font-feature-settings: 'ss07' 1;
|
||||
border-radius: 2px;
|
||||
box-shadow: inset 0 0 4px #111;
|
||||
transition: border-color .2s;
|
||||
|
|
@ -10,8 +10,9 @@
|
|||
}
|
||||
.input__upload__selection {
|
||||
text-align: center;
|
||||
font-size: 1.2em;
|
||||
border: 1px solid #222;
|
||||
padding: 4px 12px;
|
||||
padding: 5px 10px;
|
||||
background: #222;
|
||||
color: #fff;
|
||||
border-radius: 2px;
|
||||
100
assets/css/misuzu/_msz.css
Normal file
100
assets/css/misuzu/_msz.css
Normal file
|
|
@ -0,0 +1,100 @@
|
|||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
outline-style: none;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
[hidden],
|
||||
.hidden {
|
||||
display: none !important;
|
||||
visibility: hidden !important;
|
||||
}
|
||||
|
||||
:root {
|
||||
--font-size: 12px;
|
||||
--line-height: 20px;
|
||||
--font-regular: Tahoma, Geneva, 'Dejavu Sans', Arial, Helvetica, sans-serif;
|
||||
--font-monospace: Consolas, 'Liberation Mono', Menlo, Courier, monospace;
|
||||
|
||||
--site-max-width: 1200px;
|
||||
--site-mobile-width: 800px;
|
||||
--site-logo: url('/images/logos/imouto-default.png');
|
||||
|
||||
--header-height-desktop: 70px;
|
||||
--header-height-mobile: 50px;
|
||||
|
||||
--background-image: initial;
|
||||
--background-colour: #111;
|
||||
--background-colour-translucent-1: rgba(17, 17, 17, 0.1);
|
||||
--background-colour-translucent-2: rgba(17, 17, 17, 0.2);
|
||||
--background-colour-translucent-3: rgba(17, 17, 17, 0.3);
|
||||
--background-colour-translucent-4: rgba(17, 17, 17, 0.4);
|
||||
--background-colour-translucent-5: rgba(17, 17, 17, 0.5);
|
||||
--background-colour-translucent-6: rgba(17, 17, 17, 0.6);
|
||||
--background-colour-translucent-7: rgba(17, 17, 17, 0.7);
|
||||
--background-colour-translucent-8: rgba(17, 17, 17, 0.8);
|
||||
--background-colour-translucent-9: rgba(17, 17, 17, 0.9);
|
||||
--background-pattern: url('/images/clouds.png') fixed;
|
||||
|
||||
--container-colour: #161616;
|
||||
|
||||
--text-colour: #fff;
|
||||
--text-colour-inverted: #000;
|
||||
|
||||
--user-colour: inherit;
|
||||
--user-header: url('/images/pixel.png');
|
||||
--accent-colour: #8559a5;
|
||||
--header-accent-colour: var(--accent-colour);
|
||||
|
||||
/** octobre **/
|
||||
--site-logo: url('/images/logos/imouto-halloween.png');
|
||||
--accent-colour: #ee9400;
|
||||
}
|
||||
|
||||
html {
|
||||
scrollbar-color: var(--accent-colour) var(--background-colour);
|
||||
}
|
||||
|
||||
.main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-image: var(--background-image);
|
||||
background-color: var(--background-colour);
|
||||
font-size: var(--font-size);
|
||||
line-height: var(--line-height);
|
||||
font-family: var(--font-regular);
|
||||
color: var(--text-colour);
|
||||
background-attachment: fixed;
|
||||
background-position: center center;
|
||||
}
|
||||
.main__wrapper {
|
||||
max-width: var(--site-max-width);
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
|
||||
.main--bg-blend {
|
||||
background-color: var(--accent-colour);
|
||||
background-blend-mode: multiply;
|
||||
}
|
||||
.main--bg-slide { animation: background-slide infinite linear 2s; }
|
||||
.main--bg-cover { background-size: cover; }
|
||||
.main--bg-contain { background-size: contain; }
|
||||
.main--bg-stretch { background-size: 100% 100%; }
|
||||
.main--bg-tile { background-size: auto; }
|
||||
|
||||
.link {
|
||||
color: var(--accent-colour);
|
||||
text-decoration: none;
|
||||
}
|
||||
.link:hover, .link:focus { text-decoration: underline; }
|
||||
|
||||
|
|
@ -43,7 +43,7 @@
|
|||
|
||||
.changelog__change__username {
|
||||
color: inherit;
|
||||
font-size: 1.375em;
|
||||
font-size: 1.4em;
|
||||
line-height: 1.5em;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -52,7 +52,7 @@
|
|||
}
|
||||
|
||||
.changelog__change__userrole {
|
||||
font-size: .875em;
|
||||
font-size: .9em;
|
||||
line-height: 1.5em;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
|
|
@ -64,13 +64,15 @@
|
|||
.changelog__change__date {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.changelog__change__date:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.changelog__change__text {
|
||||
line-height: 1.25em;
|
||||
line-height: 1.2em;
|
||||
flex: 1 1 auto;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
|
|
@ -1,8 +1,6 @@
|
|||
.changelog__entry {
|
||||
display: flex;
|
||||
margin: 5px;
|
||||
font-size: .875em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.changelog__entry__info { display: flex; }
|
||||
|
||||
|
|
@ -70,7 +68,7 @@
|
|||
.changelog__entry__tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
font-size: .75em;
|
||||
font-size: .9em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
|
|
@ -6,6 +6,8 @@
|
|||
text-decoration: none;
|
||||
padding: 1px 3px;
|
||||
color: var(--accent-colour);
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.changelog__listing__date:hover {
|
||||
text-decoration: underline;
|
||||
|
|
@ -21,8 +21,8 @@
|
|||
}
|
||||
.changelog__log__text {
|
||||
padding: 8px 12px;
|
||||
font-size: 1.375em;
|
||||
line-height: 1.25em;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.3em;
|
||||
align-self: center;
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
159
assets/css/misuzu/comments/comment.css
Normal file
159
assets/css/misuzu/comments/comment.css
Normal file
|
|
@ -0,0 +1,159 @@
|
|||
.comment {
|
||||
margin: 10px;
|
||||
}
|
||||
.comment__reply-toggle {
|
||||
display: none;
|
||||
}
|
||||
.comment__reply-toggle:checked ~ .comment--reply {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.comment--reply {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.comment--deleted > .comment__container {
|
||||
opacity: .5;
|
||||
transition: opacity .2s;
|
||||
}
|
||||
.comment--deleted > .comment__container:hover {
|
||||
opacity: .9;
|
||||
}
|
||||
|
||||
.comment__container {
|
||||
display: flex;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.comment__mention {
|
||||
color: var(--user-colour);
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
.comment__mention:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.comment__actions {
|
||||
list-style: none;
|
||||
display: flex;
|
||||
font-size: .9em;
|
||||
align-items: center;
|
||||
}
|
||||
.comment__action {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.comment__action:not(:last-child) {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.comment__action--link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.comment__action--post {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.comment__action--button {
|
||||
cursor: pointer;
|
||||
font: 12px/20px var(--font-regular);
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.comment__action--hide {
|
||||
opacity: 0;
|
||||
transition: opacity .2s;
|
||||
}
|
||||
|
||||
.comment__action--voted {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.comment__action__checkbox {
|
||||
vertical-align: text-top;
|
||||
margin-right: 2px;
|
||||
}
|
||||
|
||||
.comment__replies .comment--indent-1,
|
||||
.comment__replies .comment--indent-2,
|
||||
.comment__replies .comment--indent-3,
|
||||
.comment__replies .comment--indent-4,
|
||||
.comment__replies .comment--indent-5 {
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
.comment__avatar {
|
||||
flex: 0 0 auto;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
.comment__replies .comment__avatar {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.comment__content {
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.comment__content:hover .comment__action--hide {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.comment__info {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.comment__text {
|
||||
margin-right: 2px;
|
||||
}
|
||||
.comment__text--input {
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
min-height: 50px;
|
||||
font: 12px/20px var(--font-regular);
|
||||
margin-right: 1px;
|
||||
}
|
||||
|
||||
.comment__user {
|
||||
color: var(--user-colour);
|
||||
text-decoration: none;
|
||||
}
|
||||
.comment__user--link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.comment__date,
|
||||
.comment__pin {
|
||||
color: #666;
|
||||
font-size: .9em;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.comment__link {
|
||||
color: #666;
|
||||
display: inline-flex;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.comment__pin {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.comment__pin:before {
|
||||
content: "-";
|
||||
padding-right: 4px;
|
||||
}
|
||||
36
assets/css/misuzu/comments/comments.css
Normal file
36
assets/css/misuzu/comments/comments.css
Normal file
|
|
@ -0,0 +1,36 @@
|
|||
.comments {
|
||||
--comments-max-height: 600px;
|
||||
margin: 1px;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
.comments__listing {
|
||||
overflow-y: auto;
|
||||
}
|
||||
.comments__listing--limit {
|
||||
max-height: var(--comments-max-height);
|
||||
}
|
||||
|
||||
/*.comments__input,*/
|
||||
.comments__javascript,
|
||||
.comments__notice--staff {
|
||||
border-bottom: 1px solid var(--accent-colour);
|
||||
padding-bottom: 1px;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
|
||||
.comments__none,
|
||||
.comments__javascript,
|
||||
.comments__notice {
|
||||
padding: 10px;
|
||||
font-size: 1.2em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.comments__notice__link {
|
||||
color: var(--accent-colour);
|
||||
text-decoration: none;
|
||||
}
|
||||
.comments__notice__link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
11
assets/css/misuzu/confirm.css
Normal file
11
assets/css/misuzu/confirm.css
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
.confirm {
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.confirm__buttons {
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
justify-content: center;
|
||||
}
|
||||
.confirm__message { padding: 2px 5px; }
|
||||
.confirm__button { margin-right: 5px; }
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
.container {
|
||||
background-color: var(--container-colour);
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
|
||||
text-shadow: 0 1px 4px #000;
|
||||
overflow: hidden;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
|
@ -13,12 +14,10 @@
|
|||
overflow: hidden;
|
||||
}
|
||||
.container__title__text {
|
||||
font-size: 1.125rem;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5em;
|
||||
padding: 8px 10px;
|
||||
word-wrap: break-word;
|
||||
font-weight: 500;
|
||||
min-height: 44px;
|
||||
}
|
||||
.container__title__link {
|
||||
color: inherit;
|
||||
|
|
@ -32,6 +31,7 @@
|
|||
width: 100%;
|
||||
height: 100%;
|
||||
mask-image: linear-gradient(0deg, transparent 10%, var(--background-colour) 100%);
|
||||
-webkit-mask-image: linear-gradient(0deg, transparent 10%, var(--background-colour) 100%);
|
||||
background: var(--background-pattern);
|
||||
background-color: var(--accent-colour);
|
||||
background-blend-mode: multiply;
|
||||
|
|
@ -129,7 +129,7 @@
|
|||
/* Ix */
|
||||
.flag--id { background-position: top -96px left -48px; }
|
||||
.flag--ie { background-position: top -96px left -64px; }
|
||||
.flag--il { background-position: top -180px left -288px; }
|
||||
.flag--il { background-position: top -96px left -176px; }
|
||||
.flag--in { background-position: top -96px left -208px; }
|
||||
.flag--io { background-position: top -96px left -224px; }
|
||||
.flag--iq { background-position: top -96px left -256px; }
|
||||
|
|
@ -295,9 +295,6 @@
|
|||
.flag--wf { background-position: top -264px left -80px; }
|
||||
.flag--ws { background-position: top -264px left -288px; }
|
||||
|
||||
/* Xx */
|
||||
.flag--xm { background-position: top -276px left -192px; }
|
||||
|
||||
/* Yx */
|
||||
.flag--ye { background-position: top -288px left -64px; }
|
||||
.flag--yt { background-position: top -288px left -304px; }
|
||||
|
|
@ -5,7 +5,6 @@
|
|||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.footer__link:focus,
|
||||
.footer__link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
|
@ -13,8 +12,8 @@
|
|||
max-width: var(--site-max-width);
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
font-size: .875rem;
|
||||
line-height: 1.5rem;
|
||||
font-size: .9em;
|
||||
line-height: 1.5em;
|
||||
padding: 1em 0;
|
||||
}
|
||||
.footer__background {
|
||||
|
|
@ -4,6 +4,8 @@
|
|||
overflow: auto;
|
||||
}
|
||||
.forum__categories__empty {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
}
|
||||
|
|
@ -61,8 +63,8 @@
|
|||
background-size: 80px 80px;
|
||||
background-image: radial-gradient(ellipse at center, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .4) 100%);
|
||||
box-shadow: 0 1px 4px #111;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.25em;
|
||||
font-size: 2em;
|
||||
line-height: 1.5em;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -80,25 +82,22 @@
|
|||
justify-content: center;
|
||||
flex-direction: column;
|
||||
line-height: 1.5em;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.forum__category__title {
|
||||
font-size: 1.125em;
|
||||
line-height: 1.25em;
|
||||
font-size: 1.3em;
|
||||
}
|
||||
|
||||
.forum__category__description,
|
||||
.forum__category__subforums {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.forum__category__subforums {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
}
|
||||
.forum__category__subforum {
|
||||
padding: 2px;
|
||||
pointer-events: initial;
|
||||
color: var(--accent-colour);
|
||||
text-decoration: none;
|
||||
|
|
@ -126,23 +125,21 @@
|
|||
}
|
||||
|
||||
.forum__category__stat {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.3em;
|
||||
opacity: .7;
|
||||
pointer-events: auto;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
|
||||
.forum__category__stat:first-child {
|
||||
font-size: 1.25em;
|
||||
font-size: 1.5em;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.forum__category__activity {
|
||||
text-align: right;
|
||||
min-width: 300px;
|
||||
font-size: .875em;
|
||||
line-height: 1.375em;
|
||||
min-width: 270px;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.forum__category__activity__none,
|
||||
.forum__category__activity__details {
|
||||
|
|
@ -163,7 +160,7 @@
|
|||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 230px;
|
||||
max-width: 200px;
|
||||
}
|
||||
.forum__category__activity__post:hover,
|
||||
.forum__category__activity__post:focus {
|
||||
|
|
@ -174,7 +171,6 @@
|
|||
color: var(--user-colour);
|
||||
text-decoration: none;
|
||||
pointer-events: initial;
|
||||
display: block;
|
||||
}
|
||||
.forum__category__username:hover,
|
||||
.forum__category__username:focus {
|
||||
|
|
@ -197,7 +193,7 @@
|
|||
flex-wrap: wrap;
|
||||
}
|
||||
.forum__category__details {
|
||||
flex-basis: calc(100% - 8em); /* god knows what this does */
|
||||
flex-basis: calc(100% - 100px);
|
||||
}
|
||||
.forum__category__stats {
|
||||
min-width: initial;
|
||||
|
|
@ -233,7 +229,4 @@
|
|||
.forum__category__avatar {
|
||||
display: none;
|
||||
}
|
||||
.forum__category__username {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
15
assets/css/misuzu/forum/confirm.css
Normal file
15
assets/css/misuzu/forum/confirm.css
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
.forum__confirm {
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.forum__confirm__message {
|
||||
padding: 2px 5px;
|
||||
}
|
||||
.forum__confirm__buttons {
|
||||
display: flex;
|
||||
padding: 5px;
|
||||
justify-content: center;
|
||||
}
|
||||
.forum__confirm__button {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
|
@ -7,8 +7,8 @@
|
|||
}
|
||||
|
||||
.forum__header__title {
|
||||
font-size: 1.5em;
|
||||
line-height: 1.25em;
|
||||
font-size: 2em;
|
||||
line-height: 1.5em;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
padding: 0 5px;
|
||||
|
|
@ -28,18 +28,19 @@
|
|||
margin: 0;
|
||||
box-shadow: initial;
|
||||
font-size: 1em;
|
||||
font-family: var(--font-regular);
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.forum__header__breadcrumbs {
|
||||
display: flex;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
align-items: center;
|
||||
}
|
||||
.forum__header__breadcrumb {
|
||||
color: var(--accent-colour);
|
||||
text-decoration: none;
|
||||
padding: 2px 6px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
.forum__header__breadcrumb:hover {
|
||||
text-decoration: underline;
|
||||
|
|
@ -47,7 +48,7 @@
|
|||
.forum__header__breadcrumb__separator {
|
||||
color: var(--accent-colour);
|
||||
margin: 0 4px;
|
||||
font-size: .875em;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.forum__header__actions {
|
||||
|
|
@ -36,13 +36,14 @@
|
|||
|
||||
.forum__leaderboard__user {
|
||||
margin: 2px 0;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.forum__leaderboard__user--rank-1 {
|
||||
font-size: 1.5em;
|
||||
font-size: 1.6em;
|
||||
}
|
||||
.forum__leaderboard__user--rank-2,
|
||||
.forum__leaderboard__user--rank-3 {
|
||||
font-size: 1.25em;
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
.forum__leaderboard__user__background {
|
||||
|
|
@ -68,7 +69,6 @@
|
|||
justify-content: center;
|
||||
font-weight: 700;
|
||||
flex: 0 0 auto;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
.forum__leaderboard__user__rank:before {
|
||||
content: "#";
|
||||
104
assets/css/misuzu/forum/poll.css
Normal file
104
assets/css/misuzu/forum/poll.css
Normal file
|
|
@ -0,0 +1,104 @@
|
|||
.forum__poll__container {
|
||||
margin: 2px 0;
|
||||
padding: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.forum__poll__toggle,
|
||||
.forum__poll__toggle:checked ~ .forum__poll__container--poll,
|
||||
.forum__poll__toggle:not(:checked) ~ .forum__poll__container--results {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.forum__poll__options {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
max-width: 500px;
|
||||
min-width: 100%;
|
||||
}
|
||||
|
||||
.forum__poll__results {
|
||||
max-width: 800px;
|
||||
width: 100%;
|
||||
padding: 0 1px;
|
||||
}
|
||||
|
||||
.forum__poll__option {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.forum__poll__remaining,
|
||||
.forum__poll__expires {
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.forum__poll__remaining__num,
|
||||
.forum__poll__expires__num,
|
||||
.forum__poll__remaining__datetime,
|
||||
.forum__poll__expires__datetime {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.forum__poll__buttons {
|
||||
display: flex;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
.forum__poll__button {
|
||||
margin: 0 2px;
|
||||
}
|
||||
|
||||
.forum__poll__result {
|
||||
overflow: hidden;
|
||||
border-radius: 5px;
|
||||
margin: 4px 0;
|
||||
border: 1px solid var(--accent-colour);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.forum__poll__result__background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 100%;
|
||||
background: var(--accent-colour);
|
||||
opacity: .2;
|
||||
}
|
||||
|
||||
.forum__poll__result--voted .forum__poll__result__background {
|
||||
opacity: .4;
|
||||
}
|
||||
|
||||
.forum__poll__result__container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.forum__poll__result__text {
|
||||
flex: 1 1 auto;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.forum__poll__result--voted .forum__poll__result__text {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.forum__poll__result__votes {
|
||||
flex: 0 0 auto;
|
||||
padding: 5px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.forum__poll__result__percent {
|
||||
flex: 0 0 auto;
|
||||
padding: 5px;
|
||||
min-width: 60px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
@media (min-width: 400px) {
|
||||
.forum__poll__options {
|
||||
min-width: 300px;
|
||||
}
|
||||
}
|
||||
|
|
@ -22,8 +22,8 @@
|
|||
}
|
||||
|
||||
.forum__post__details {
|
||||
font-size: .875em;
|
||||
line-height: 1.75em;
|
||||
font-size: .9em;
|
||||
line-height: 1.7em;
|
||||
padding: 0 2px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
|
@ -36,9 +36,6 @@
|
|||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.forum__post__id {
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
.forum__post__datetime:hover,
|
||||
.forum__post__datetime:focus,
|
||||
.forum__post__id:hover,
|
||||
|
|
@ -49,11 +46,15 @@
|
|||
}
|
||||
|
||||
.forum__post__text {
|
||||
padding: 2px;
|
||||
line-height: 1.5em;
|
||||
margin: 2px;
|
||||
line-height: 1.2em;
|
||||
flex: 1 1 auto;
|
||||
overflow: auto;
|
||||
}
|
||||
.forum__post__text--edit {
|
||||
.forum__post__text--edit {
|
||||
/* figure out why this is needed */
|
||||
max-width: calc(100% - 4px);
|
||||
min-width: calc(100% - 4px);
|
||||
margin: 2px 2px 0;
|
||||
min-height: 400px;
|
||||
height: 100%;
|
||||
|
|
@ -65,12 +66,6 @@
|
|||
font-family: inherit;
|
||||
}
|
||||
|
||||
.forum__post__text img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
max-height: 900px
|
||||
}
|
||||
|
||||
.forum__post__info__content {
|
||||
width: 150px;
|
||||
text-align: center;
|
||||
|
|
@ -100,14 +95,14 @@
|
|||
}
|
||||
|
||||
.forum__post__posts-count {
|
||||
font-size: .75em;
|
||||
margin-left: 8px;
|
||||
font-size: .9em;
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.forum__post__joined {
|
||||
flex: 1 1 auto;
|
||||
max-width: 170px;
|
||||
font-size: .75em;
|
||||
font-size: .9em;
|
||||
justify-self: flex-end;
|
||||
}
|
||||
|
||||
|
|
@ -120,7 +115,7 @@
|
|||
|
||||
.forum__post__username {
|
||||
color: inherit;
|
||||
font-size: 1.25em;
|
||||
font-size: 1.4em;
|
||||
line-height: 2em;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -130,8 +125,8 @@
|
|||
}
|
||||
|
||||
.forum__post__usertitle {
|
||||
font-size: .75em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.5em;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
|
|
@ -157,9 +152,6 @@
|
|||
}
|
||||
|
||||
.forum__post__action {
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
display: block;
|
||||
padding: 5px 10px;
|
||||
margin: 1px;
|
||||
color: inherit;
|
||||
|
|
@ -167,9 +159,6 @@
|
|||
transition: background-color .2s;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
.forum__post__action:hover,
|
||||
.forum__post__action:focus {
|
||||
|
|
@ -184,19 +173,16 @@
|
|||
}
|
||||
.forum__post__signature img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
max-height: 150px;
|
||||
}
|
||||
|
||||
.forum__post__badge {
|
||||
background-color: var(--accent-colour);
|
||||
border-radius: 24px;
|
||||
border-radius: 12px;
|
||||
width: 100%;
|
||||
padding: 2px;
|
||||
box-shadow: 0 2px 3px #000A;
|
||||
margin: 4px;
|
||||
overflow: hidden;
|
||||
font-size: .875em;
|
||||
}
|
||||
.forum__post__badge__desktop {
|
||||
display: block;
|
||||
|
|
@ -211,11 +197,13 @@
|
|||
}
|
||||
.forum__post__text {
|
||||
margin: 4px;
|
||||
font-size: 1.2em;
|
||||
line-height: 1.3em;
|
||||
}
|
||||
.forum__post__info {
|
||||
flex-direction: row;
|
||||
margin: 0;
|
||||
padding: 4px;
|
||||
padding: 5px;
|
||||
}
|
||||
.forum__post__info__content {
|
||||
width: 100%;
|
||||
|
|
@ -254,8 +242,8 @@
|
|||
padding: 2px 10px;
|
||||
margin: 0;
|
||||
align-self: flex-start;
|
||||
margin-left: 10px;
|
||||
font-size: .875em;
|
||||
margin-left: 5px;
|
||||
font-size: .9em;
|
||||
}
|
||||
.forum__post__badge__desktop {
|
||||
display: none;
|
||||
37
assets/css/misuzu/forum/priority.css
Normal file
37
assets/css/misuzu/forum/priority.css
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
.forum__priority__votes {
|
||||
text-align: center;
|
||||
margin: 5px 16px 5px 5px;
|
||||
-webkit-touch-callout: none !important;
|
||||
-webkit-user-select: none !important;
|
||||
-khtml-user-select: none !important;
|
||||
-moz-user-select: none !important;
|
||||
-ms-user-select: none !important;
|
||||
user-select: none !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.forum__priority__vote {
|
||||
font-size: 14px;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.forum__priority__star {
|
||||
margin-right: -.9em;
|
||||
opacity: .6;
|
||||
text-shadow: 0 1px 1px #000;
|
||||
color: var(--user-colour);
|
||||
transition: text-shadow .2s;
|
||||
}
|
||||
.forum__priority__star:last-child {
|
||||
margin-right: 0;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.forum__priority__vote:hover .forum__priority__star {
|
||||
text-shadow: 0 0 1px #fff;
|
||||
}
|
||||
|
||||
.forum__priority__input {
|
||||
margin: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.5em;
|
||||
font-size: 2em;
|
||||
padding-bottom: 1px;
|
||||
}
|
||||
.forum__status__icon__background {
|
||||
|
|
@ -4,6 +4,8 @@
|
|||
overflow: auto;
|
||||
}
|
||||
.forum__topics__empty {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
}
|
||||
|
|
@ -74,7 +76,7 @@
|
|||
background-size: 60px 60px;
|
||||
background-image: radial-gradient(ellipse at center, rgba(255, 255, 255, .2) 0%, rgba(0, 0, 0, .4) 100%);
|
||||
box-shadow: 0 1px 4px #111;
|
||||
font-size: 1.125em;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5em;
|
||||
color: #fff;
|
||||
display: flex;
|
||||
|
|
@ -89,6 +91,9 @@
|
|||
.forum__topic__icon--unread {
|
||||
background-color: var(--accent-colour);
|
||||
}
|
||||
.forum__topic__icon--faded {
|
||||
opacity: .3;
|
||||
}
|
||||
.forum__topic__icon__participated {
|
||||
position: absolute;
|
||||
bottom: 2px;
|
||||
|
|
@ -100,6 +105,16 @@
|
|||
box-shadow: 0 1px 2px #111;
|
||||
pointer-events: initial;
|
||||
}
|
||||
.forum__topic__icon__priority {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
line-height: 30px;
|
||||
font-size: .9em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.forum__topic__details {
|
||||
margin: 0 4px;
|
||||
|
|
@ -112,15 +127,14 @@
|
|||
}
|
||||
|
||||
.forum__topic__title {
|
||||
font-size: 1.125em;
|
||||
font-size: 1.3em;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.forum__topic__info {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
.forum__topic__stats,
|
||||
|
|
@ -136,15 +150,14 @@
|
|||
}
|
||||
|
||||
.forum__topic__stat {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.3em;
|
||||
opacity: .7;
|
||||
pointer-events: auto;
|
||||
cursor: default;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
.forum__topic__stat:first-child {
|
||||
font-size: 1.25em;
|
||||
font-size: 1.4em;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
|
|
@ -153,7 +166,7 @@
|
|||
align-items: center;
|
||||
text-align: right;
|
||||
min-width: 200px;
|
||||
line-height: 1.25em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.forum__topic__activity__details {
|
||||
display: flex;
|
||||
|
|
@ -198,9 +211,8 @@
|
|||
.forum__topic__pagination {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
font-size: .9em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
.forum__topic__pagination__separator {
|
||||
margin: 0 8px;
|
||||
|
|
@ -210,7 +222,7 @@
|
|||
text-decoration: none;
|
||||
pointer-events: initial;
|
||||
margin: 0 1px;
|
||||
padding: 3px;
|
||||
padding: 2px 4px;
|
||||
border-radius: 2px;
|
||||
min-width: 25px;
|
||||
height: 25px;
|
||||
|
|
@ -263,8 +275,8 @@
|
|||
.forum__topic__pagination__item {
|
||||
min-width: 30px;
|
||||
height: 30px;
|
||||
line-height: 1.375em;
|
||||
font-size: 1.25em;
|
||||
line-height: 26px;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -273,4 +285,4 @@
|
|||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -55,6 +55,7 @@
|
|||
.header__desktop__link:focus {
|
||||
background-color: rgba(255, 255, 255, .2);
|
||||
}
|
||||
|
||||
.header__desktop__link:active {
|
||||
background-color: rgba(255, 255, 255, .1);
|
||||
}
|
||||
|
|
@ -69,7 +70,8 @@
|
|||
}
|
||||
.header__desktop__menu__link {
|
||||
margin: var(--header-link-margin) 0;
|
||||
padding: 4px 10px;
|
||||
font-size: 1.2em;
|
||||
padding: 6px 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
@ -85,8 +87,6 @@
|
|||
}
|
||||
.header__desktop__submenu__link {
|
||||
margin: 5px;
|
||||
font-size: .875em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.header__desktop__submenu__background {
|
||||
background: var(--header-accent-colour);
|
||||
|
|
@ -129,8 +129,8 @@
|
|||
margin: 2px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-size: 1.125rem;
|
||||
line-height: 2rem;
|
||||
font-size: 1.5em;
|
||||
line-height: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
transition: background-color .2s;
|
||||
|
|
@ -147,20 +147,14 @@
|
|||
}
|
||||
.header__desktop__user__button__count {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
right: -3px;
|
||||
z-index: 1;
|
||||
font-size: .625rem;
|
||||
line-height: 1.375rem;
|
||||
text-align: right;
|
||||
padding: 2px 2px 0;
|
||||
border-radius: 4px;
|
||||
bottom: 1px;
|
||||
right: 1px;
|
||||
font-size: 10px;
|
||||
background-color: var(--header-accent-colour);
|
||||
opacity: .9;
|
||||
border-radius: 4px;
|
||||
line-height: 12px;
|
||||
padding: 2px 3px;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
padding: 2px 4px;
|
||||
}
|
||||
|
||||
/** MOBILE HEADER **/
|
||||
|
|
@ -188,12 +182,18 @@
|
|||
.header__mobile__icon {
|
||||
flex: 0 0 auto;
|
||||
cursor: pointer;
|
||||
font-size: 1.5rem;
|
||||
font-size: 32px;
|
||||
width: var(--header-icon-px);
|
||||
height: var(--header-icon-px);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
-webkit-touch-callout: none !important;
|
||||
-webkit-user-select: none !important;
|
||||
-khtml-user-select: none !important;
|
||||
-moz-user-select: none !important;
|
||||
-ms-user-select: none !important;
|
||||
user-select: none !important;
|
||||
}
|
||||
|
||||
|
|
@ -223,8 +223,9 @@
|
|||
background: var(--background-pattern);
|
||||
background-color: var(--header-accent-colour);
|
||||
background-blend-mode: multiply;
|
||||
transition: max-height .3s;
|
||||
transition: max-height .2s;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
|
||||
text-shadow: 0 1px 4px #000;
|
||||
max-height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
|
@ -233,7 +234,7 @@
|
|||
}
|
||||
|
||||
.header__mobile__toggle:checked ~ .header__mobile__menu {
|
||||
max-height: 100vh;
|
||||
max-height: 600px;
|
||||
}
|
||||
|
||||
.header__mobile__user {
|
||||
|
|
@ -251,23 +252,24 @@
|
|||
color: inherit;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
padding: 6px;
|
||||
padding-left: 24px;
|
||||
padding: 8px;
|
||||
padding-left: 20px;
|
||||
cursor: pointer;
|
||||
border-radius: 2px;
|
||||
transition: background-color .2s, margin .1s, opacity .1s;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.header__mobile__link:not(:last-child) {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.header__mobile__link--primary {
|
||||
font-size: 1.25rem;
|
||||
padding: 8px;
|
||||
font-size: 1.5em;
|
||||
padding: 10px;
|
||||
}
|
||||
.header__mobile__link--user {
|
||||
margin: 2px;
|
||||
font-size: 1.25rem;
|
||||
padding: 8px;
|
||||
font-size: 1.5em;
|
||||
padding: 10px;
|
||||
}
|
||||
.header__mobile__link:hover,
|
||||
.header__mobile__link:focus {
|
||||
|
|
@ -280,6 +282,6 @@
|
|||
@media (max-width: 800px) {
|
||||
.header__desktop { display: none; }
|
||||
}
|
||||
@media (min-width: 801px) {
|
||||
@media (min-width: 800px) {
|
||||
.header__mobile { display: none; }
|
||||
}
|
||||
|
|
@ -57,10 +57,13 @@
|
|||
width: 45%;
|
||||
padding: 4px 0;
|
||||
}
|
||||
.landing__statistic__name {
|
||||
font-size: 1.3em;
|
||||
line-height: 2em;
|
||||
}
|
||||
.landing__statistic__value {
|
||||
font-size: 1.25em;
|
||||
line-height: 1.625em;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.landing__latest {
|
||||
|
|
@ -88,13 +91,13 @@
|
|||
padding-left: 8px;
|
||||
}
|
||||
.landing__latest__username {
|
||||
font-size: 1.25em;
|
||||
line-height: 1.375em;
|
||||
font-size: 1.5em;
|
||||
line-height: 1.4em;
|
||||
color: var(--user-colour);
|
||||
}
|
||||
.landing__latest__joined {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
25
assets/css/misuzu/manage/_manage.css
Normal file
25
assets/css/misuzu/manage/_manage.css
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
.manage {
|
||||
display: flex;
|
||||
}
|
||||
.manage__sidebar {
|
||||
flex: 0 0 auto;
|
||||
width: 280px;
|
||||
}
|
||||
.manage__content {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.manage__description {
|
||||
font-size: .9em;
|
||||
margin: 1px 2px;
|
||||
border-bottom: 1px solid var(--accent-colour);
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.manage {
|
||||
flex-direction: column;
|
||||
}
|
||||
.manage__sidebar {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
|
@ -13,8 +13,7 @@
|
|||
.manage__blacklist__textarea {
|
||||
margin: 0;
|
||||
padding: 5px 10px;
|
||||
font-family: var(--font-monospace);
|
||||
font-feature-settings: 'ss07' 1;
|
||||
font-family: monospace;
|
||||
width: 100%;
|
||||
min-width: 100%;
|
||||
max-width: 100%;
|
||||
|
|
@ -4,11 +4,13 @@
|
|||
.manage__navigation__links {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.manage__navigation__link {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
padding: 2px 8px;
|
||||
padding: 2px 5px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.manage__navigation__link:hover {
|
||||
text-decoration: underline;
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
.manage__role-item {
|
||||
display: flex;
|
||||
text-shadow: 0 1px 4px #000;
|
||||
box-shadow: 0 1px 4px #000A;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
|
@ -37,7 +38,6 @@
|
|||
width: 40px;
|
||||
height: 40px;
|
||||
box-shadow: 0 1px 4px #111;
|
||||
text-shadow: 0 1px 4px #000;
|
||||
margin: 10px;
|
||||
flex: 0 0 auto;
|
||||
overflow: hidden;
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
justify-content: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 1.25em;
|
||||
font-size: 1.5em;
|
||||
transition: background-color .2s;
|
||||
}
|
||||
.manage__role-item__icon__background {
|
||||
|
|
@ -73,9 +73,14 @@
|
|||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.manage__role-item__name {
|
||||
font-size: 1.4em;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
.manage__role-item__details {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.3em;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding: 1px 0;
|
||||
|
|
@ -85,11 +90,11 @@
|
|||
border-radius: 10px;
|
||||
background-color: var(--accent-colour);
|
||||
box-shadow: 0 1px 4px #111;
|
||||
padding: 2px 6px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
.manage__role-item__title {
|
||||
padding: 2px 6px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
.manage__role-item__actions {
|
||||
14
assets/css/misuzu/manage/statistic.css
Normal file
14
assets/css/misuzu/manage/statistic.css
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
.manage__statistic {
|
||||
border: 1px solid var(--accent-colour);
|
||||
border-radius: 2px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
.manage__statistic__name {
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
.manage__statistic__value {
|
||||
text-align: right;
|
||||
font-size: 1.5em;
|
||||
line-height: 2em;
|
||||
}
|
||||
|
|
@ -1,14 +1,9 @@
|
|||
.manage__statistics {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
padding: 5px;
|
||||
grid-gap: 5px;
|
||||
}
|
||||
@media (max-width: 1100px) {
|
||||
.manage__statistics {
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
}
|
||||
}
|
||||
@media (max-width: 900px) {
|
||||
.manage__statistics {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
|
@ -1,5 +1,6 @@
|
|||
.manage__user-item {
|
||||
display: flex;
|
||||
text-shadow: 0 1px 4px #000;
|
||||
box-shadow: 0 1px 4px #000A;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
|
@ -57,26 +58,24 @@
|
|||
}
|
||||
|
||||
.manage__user-item__name {
|
||||
font-size: 1.125em;
|
||||
line-height: 1.5em;
|
||||
max-width: 600px; /* whatever */
|
||||
font-size: 1.4em;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
.manage__user-item__details {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.3em;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.manage__user-item__detail {
|
||||
border-radius: 16px;
|
||||
border-radius: 10px;
|
||||
background-color: var(--accent-colour);
|
||||
box-shadow: 0 1px 4px #111;
|
||||
padding: 2px 8px;
|
||||
padding: 3px 8px;
|
||||
pointer-events: initial;
|
||||
margin: 2px;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
|
||||
.manage__user-item__actions {
|
||||
|
|
@ -89,7 +88,7 @@
|
|||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
font-size: 1.25em;
|
||||
font-size: 1.5em;
|
||||
border-radius: 2px;
|
||||
margin: 5px;
|
||||
margin-right: 0;
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
.markdown {
|
||||
line-height: 1.5em;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
||||
.markdown a {
|
||||
|
|
@ -53,6 +53,7 @@
|
|||
.markdown code {
|
||||
padding: .2em .4em;
|
||||
margin: 0;
|
||||
background-color: rgba(0, 0, 0, .7);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.markdown del code { text-decoration: inherit; }
|
||||
|
|
@ -64,6 +65,7 @@
|
|||
overflow: hidden;
|
||||
line-height: inherit;
|
||||
word-wrap: break-word;
|
||||
background: transparent;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
|
@ -78,7 +80,8 @@
|
|||
.markdown h1, .markdown h2,
|
||||
.markdown h3, .markdown h4,
|
||||
.markdown h5, .markdown h6 {
|
||||
margin: calc(var(--font-size) * 0.875) 0;
|
||||
margin-top: calc(var(--font-size) * 1.2);
|
||||
margin-bottom: var(--font-size);
|
||||
font-weight: 700;
|
||||
line-height: 1em;
|
||||
}
|
||||
|
|
@ -17,5 +17,4 @@
|
|||
display: flex;
|
||||
justify-content: center;
|
||||
padding: 5px;
|
||||
gap: 5px;
|
||||
}
|
||||
86
assets/css/misuzu/navigation.css
Normal file
86
assets/css/misuzu/navigation.css
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
.navigation {
|
||||
margin: 2px 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
border-width: 0;
|
||||
border-color: #000;
|
||||
border-style: solid;
|
||||
border-top-width: 1px;
|
||||
align-items: flex-start;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.navigation--top {
|
||||
border-top-width: 0;
|
||||
border-bottom-width: 1px;
|
||||
align-items: flex-end;
|
||||
}
|
||||
.navigation--top .navigation__option {
|
||||
border-top-width: 1px;
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
|
||||
.navigation__option {
|
||||
list-style: none;
|
||||
background-color: #c9bbcc;
|
||||
border: 1px solid #000;
|
||||
border-top-width: 0;
|
||||
flex-grow: 0;
|
||||
}
|
||||
.navigation__option:not(:first-child) { border-left-width: 0; }
|
||||
.navigation__option--selected {
|
||||
background-color: var(--accent-colour);
|
||||
top: -1px;
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.navigation__option--selected:not(:first-child) {
|
||||
margin-left: -1px;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
|
||||
.navigation__link {
|
||||
display: block;
|
||||
padding: 2px 1em;
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
}
|
||||
.navigation__link:hover, .navigation__link:focus { color: #609; }
|
||||
|
||||
|
||||
@media (max-width: 1000px) {
|
||||
.navigation {
|
||||
border: none;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.navigation--left {
|
||||
justify-content: left;
|
||||
padding-left: 25px;
|
||||
}
|
||||
.navigation--right {
|
||||
justify-content: right;
|
||||
padding-right: 25px;
|
||||
}
|
||||
|
||||
.navigation--top .navigation__option--selected { top: 1px; }
|
||||
|
||||
.navigation__link {
|
||||
padding: 10px 15px;
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.navigation__option {
|
||||
background-color: var(--accent-colour);
|
||||
width: 100%;
|
||||
border: none;
|
||||
flex-grow: 1;
|
||||
margin-bottom: 1px;
|
||||
}
|
||||
.navigation__option--selected {
|
||||
background-color: #a586c3;
|
||||
top: 0;
|
||||
}
|
||||
.navigation__option--selected .navigation__link {
|
||||
padding: 3px 1em;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
.news__feeds {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: 2px;
|
||||
padding: 2px;
|
||||
}
|
||||
|
|
@ -9,7 +9,7 @@
|
|||
display: flex;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-size: 1.25em;
|
||||
font-size: 1.5em;
|
||||
line-height: 32px;
|
||||
height: 32px;
|
||||
transition: background-color .2s;
|
||||
|
|
@ -44,7 +44,7 @@
|
|||
|
||||
.news__post__username {
|
||||
color: inherit;
|
||||
font-size: 1.25em;
|
||||
font-size: 1.4em;
|
||||
line-height: 1.5em;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -53,14 +53,14 @@
|
|||
}
|
||||
|
||||
.news__post__date {
|
||||
font-size: .875em;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.news__post__category {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-size: 1.125em;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
margin: 6px 0;
|
||||
}
|
||||
|
|
@ -69,6 +69,7 @@
|
|||
}
|
||||
|
||||
.news__post__text {
|
||||
line-height: 1.2em;
|
||||
flex: 1 1 auto;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
|
|
@ -100,4 +101,4 @@
|
|||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
129
assets/css/misuzu/news/preview.css
Normal file
129
assets/css/misuzu/news/preview.css
Normal file
|
|
@ -0,0 +1,129 @@
|
|||
.news__preview {
|
||||
display: flex;
|
||||
margin: 2px 0;
|
||||
flex-direction: row-reverse;
|
||||
|
||||
--user-colour: var(--accent-colour);
|
||||
}
|
||||
.news__preview__info__content {
|
||||
width: 200px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 15px;
|
||||
flex: 0 0 auto;
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
.news__preview__info__background {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
mask-image: linear-gradient(90deg, transparent 10%, var(--background-colour) 100%);
|
||||
-webkit-mask-image: linear-gradient(90deg, transparent 10%, var(--background-colour) 100%);
|
||||
background: var(--background-pattern);
|
||||
background-color: var(--user-colour);
|
||||
background-blend-mode: multiply;
|
||||
}
|
||||
|
||||
.news__preview__listing {
|
||||
flex-grow: 1;
|
||||
flex-shrink: 1;
|
||||
}
|
||||
|
||||
.news__preview__container {
|
||||
display: flex;
|
||||
margin: 1px;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.news__preview__user {
|
||||
display: flex;
|
||||
text-align: left;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.news__preview__user__details {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.news__preview__avatar {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.news__preview__username {
|
||||
color: inherit;
|
||||
font-size: 1.4em;
|
||||
line-height: 1.5em;
|
||||
text-decoration: none;
|
||||
}
|
||||
.news__preview__username[href]:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.news__preview__date {
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.news__preview__category {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.5em;
|
||||
margin: 6px 0;
|
||||
}
|
||||
.news__preview__category:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.news__preview__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
line-height: 1.2em;
|
||||
flex: 1 1 auto;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
margin: 2px;
|
||||
padding: 0 10px 10px 10px;
|
||||
}
|
||||
|
||||
.news__preview__text {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.news__preview__links {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.news__preview__link {
|
||||
font-size: .9em;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.news__preview { flex-direction: column-reverse; }
|
||||
.news__preview__info { display: none; }
|
||||
.news__preview__info__content {
|
||||
width: 100%;
|
||||
flex-wrap: wrap;
|
||||
text-align: left;
|
||||
}
|
||||
.news__preview__info__background {
|
||||
mask-image: linear-gradient(180deg, transparent 10%, var(--background-colour) 100%);
|
||||
-webkit-mask-image: linear-gradient(180deg, transparent 10%, var(--background-colour) 100%);
|
||||
}
|
||||
.news__preview__user {
|
||||
margin-bottom: 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.news__preview__avatar {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
|
|
@ -23,7 +23,9 @@
|
|||
.pagination__link {
|
||||
display: flex;
|
||||
min-width: 40px;
|
||||
min-height: 36px;
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
padding: 3px 10px 4px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
background-color: var(--background-colour);
|
||||
|
|
@ -35,17 +37,13 @@
|
|||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1 0 auto;
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
|
||||
.pagination__link:not(:last-child) {
|
||||
margin-right: 1px;
|
||||
.pagination__link:not(:last-child) { margin-right: 1px; }
|
||||
.pagination__link--disabled { --accent-colour: #555; }
|
||||
.pagination__link--first, .pagination__link--last,
|
||||
.pagination__link--next, .pagination__link--prev {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.pagination__link--disabled {
|
||||
--accent-colour: #555;
|
||||
}
|
||||
|
||||
.pagination__link--current,
|
||||
.pagination__link:not(.pagination__link--disabled):hover,
|
||||
.pagination__link:not(.pagination__link--disabled):active,
|
||||
|
|
@ -55,7 +53,5 @@
|
|||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.pagination__section--pages {
|
||||
display: none;
|
||||
}
|
||||
.pagination__section--pages { display: none; }
|
||||
}
|
||||
|
|
@ -6,12 +6,12 @@
|
|||
|
||||
.permissions__line {
|
||||
display: flex;
|
||||
font-size: .8rem;
|
||||
line-height: 1.5rem;
|
||||
font-size: .9em;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
.permissions__line--header {
|
||||
font-size: 1rem;
|
||||
line-height: 1.25rem;
|
||||
font-size: 1.2em;
|
||||
line-height: 1.4em;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, .1);
|
||||
padding-bottom: 1px;
|
||||
font-weight: 700;
|
||||
|
|
@ -1,26 +1,30 @@
|
|||
.profile__accounts__content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 2px 6px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
.profile__accounts__item {
|
||||
padding-bottom: 4px;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.profile__accounts__item:not(:last-child) {
|
||||
border-bottom: 1px solid #222;
|
||||
}
|
||||
|
||||
.profile__accounts__notice {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
text-align: center;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.profile__accounts__title {
|
||||
font-size: .875em;
|
||||
line-height: 1.5em;
|
||||
font-size: .9em;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
.profile__accounts__value {
|
||||
font-size: 1.2em;
|
||||
line-height: 1.2em;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
.profile__birthdate__content {
|
||||
padding: 2px 6px;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
.profile__birthdate__select {
|
||||
min-width: auto;
|
||||
|
|
@ -8,6 +8,6 @@
|
|||
display: inline-block;
|
||||
}
|
||||
.profile__birthdate__title {
|
||||
font-size: .875em;
|
||||
line-height: 1.75em;
|
||||
font-size: .9em;
|
||||
line-height: 1.8em;
|
||||
}
|
||||
|
|
@ -14,18 +14,20 @@
|
|||
padding: 1px;
|
||||
}
|
||||
.profile__guidelines__line--header {
|
||||
font-weight: 600;
|
||||
font-size: 1.2em;
|
||||
line-height: 1.5em;
|
||||
font-weight: 700;
|
||||
margin-bottom: 2px;
|
||||
border-bottom: 1px solid var(--accent-colour);
|
||||
padding-bottom: 2px;
|
||||
}
|
||||
.profile__guidelines__line:not(.profile__guidelines__line--header) {
|
||||
margin-left: 1.25em;
|
||||
.profile__guidelines__line:not(&--header) {
|
||||
margin-left: 1.3em;
|
||||
list-style: square;
|
||||
}
|
||||
|
||||
.profile__guidelines__emphasis {
|
||||
font-weight: 600;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.profile__guidelines__link {
|
||||
|
|
@ -19,6 +19,15 @@
|
|||
background-blend-mode: multiply;
|
||||
}
|
||||
|
||||
.profile__header--has-header {
|
||||
--profile-header-overlay-start: var(--background-colour-translucent-3);
|
||||
}
|
||||
|
||||
.profile__header--has-header .profile__header__background {
|
||||
background: var(--user-header) center / cover no-repeat;
|
||||
background-blend-mode: unset;
|
||||
}
|
||||
|
||||
.profile__header__avatar {
|
||||
display: flex;
|
||||
}
|
||||
|
|
@ -69,6 +78,15 @@
|
|||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.profile__header__details__relation {
|
||||
font-variant: all-small-caps;
|
||||
background: var(--profile-header-overlay-stop);
|
||||
border-radius: 2px;
|
||||
line-height: 1.2em;
|
||||
padding: 1px 5px 4px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.profile__header__options {
|
||||
min-height: 62px;
|
||||
background-color: var(--profile-header-overlay-stop);
|
||||
|
|
@ -101,11 +119,12 @@
|
|||
min-width: 130px;
|
||||
}
|
||||
.profile__header__stat__name {
|
||||
font-size: .875em;
|
||||
font-size: .9em;
|
||||
font-variant: small-caps;
|
||||
cursor: inherit;
|
||||
}
|
||||
.profile__header__stat__value {
|
||||
font-size: 1.125em;
|
||||
font-size: 1.3em;
|
||||
text-align: right;
|
||||
cursor: inherit;
|
||||
display: block;
|
||||
|
|
@ -113,9 +132,6 @@
|
|||
.profile__header__stat--date .profile__header__stat__value {
|
||||
text-align: left;
|
||||
}
|
||||
.profile__header__stat:not(.profile__header__stat--date) .profile__header__stat__value {
|
||||
font-feature-settings: 'ss01' 1, 'tnum' 1;
|
||||
}
|
||||
.profile__header__stat--link {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -124,18 +140,18 @@
|
|||
.profile__header__stat--link:focus,
|
||||
.profile__header__stat--link:active,
|
||||
.profile__header__stat--active {
|
||||
padding-bottom: 8px;
|
||||
border-bottom: 2px solid var(--accent-colour);
|
||||
}
|
||||
|
||||
.profile__header__username {
|
||||
font-size: 1.75em;
|
||||
line-height: 1.125em;
|
||||
color: var(--user-colour);
|
||||
font-size: 2em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.profile__header__title {
|
||||
font-size: .875em;
|
||||
line-height: 1.25em;
|
||||
font-size: .9em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
.profile__header__country {
|
||||
|
|
@ -143,9 +159,9 @@
|
|||
align-items: center;
|
||||
}
|
||||
.profile__header__country__name {
|
||||
font-size: .875em;
|
||||
font-size: .9em;
|
||||
margin-left: 4px;
|
||||
line-height: 1.25em;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
@media (max-width: 800px) {
|
||||
10
assets/css/misuzu/profile/relations.css
Normal file
10
assets/css/misuzu/profile/relations.css
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
.profile__relations {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
.profile__relations__user {
|
||||
margin: 2px;
|
||||
width: 300px;
|
||||
display: flex;
|
||||
}
|
||||
139
assets/css/misuzu/profile/warning.css
Normal file
139
assets/css/misuzu/profile/warning.css
Normal file
|
|
@ -0,0 +1,139 @@
|
|||
.profile__warning {
|
||||
margin: 2px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid var(--accent-colour);
|
||||
}
|
||||
.profile__warning__container {
|
||||
margin: 2px 0;
|
||||
}
|
||||
|
||||
.profile__warning--warning {
|
||||
--accent-colour: #666;
|
||||
}
|
||||
|
||||
.profile__warning--silence {
|
||||
--accent-colour: #f70;
|
||||
}
|
||||
|
||||
.profile__warning--ban {
|
||||
--accent-colour: #c33;
|
||||
}
|
||||
|
||||
.profile__warning--extendo {
|
||||
margin: 4px;
|
||||
}
|
||||
|
||||
.profile__warning__background {
|
||||
background-color: var(--accent-colour);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.profile__warning__content {
|
||||
background-color: var(--background-colour-translucent-9);
|
||||
display: flex;
|
||||
padding: 1px;
|
||||
}
|
||||
|
||||
.profile__warning__type,
|
||||
.profile__warning__created,
|
||||
.profile__warning__duration {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.profile__warning__type {
|
||||
min-width: 80px;
|
||||
background-color: var(--accent-colour);
|
||||
border-radius: 1px;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
.profile__warning__created,
|
||||
.profile__warning__duration {
|
||||
min-width: 100px;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
.profile__warning__note {
|
||||
padding: 1px 4px;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
|
||||
.profile__warning__private {
|
||||
border-top: 1px solid var(--accent-colour);
|
||||
margin-top: 1px;
|
||||
width: 100%;
|
||||
opacity: .5;
|
||||
transition: opacity .2s;
|
||||
}
|
||||
.profile__warning__private:hover,
|
||||
.profile__warning__private:active,
|
||||
.profile__warning__private:focus {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.profile__warning__tools {
|
||||
display: flex;
|
||||
padding-bottom: 1px;
|
||||
}
|
||||
|
||||
.profile__warning__options {
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.profile__warning__option {
|
||||
padding: 2px 5px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.profile__warning__user {
|
||||
display: flex;
|
||||
padding: 2px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
.profile__warning__user__avatar {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
|
||||
.profile__warning__user__username {
|
||||
padding: 0 5px;
|
||||
min-width: 60px;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
.profile__warning__user__username:hover,
|
||||
.profile__warning__user__username:focus,
|
||||
.profile__warning__user__username:active {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.profile__warning__user__ip {
|
||||
display: inline-flex;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.profile__warning__user__ip:before { content: "("; }
|
||||
.profile__warning__user__ip:after { content: ")"; }
|
||||
|
||||
|
||||
@media (max-width: 800px) {
|
||||
.profile__warning__content {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.profile__warning__tools {
|
||||
flex-direction: column;
|
||||
}
|
||||
.profile__warning__options {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue