WIP, thinking about converting to EF

This commit is contained in:
Lani Aung
2021-11-18 21:24:20 -07:00
parent fd8858aab3
commit 1fd14ebafd
20 changed files with 1513 additions and 179 deletions
+1 -2
View File
@@ -21,7 +21,6 @@ namespace fxl.codes.kisekae.Controllers
_databaseService = databaseService;
}
[HttpGet]
public async Task<IActionResult> Index()
{
var files = await _databaseService.GetAll();
@@ -37,7 +36,7 @@ namespace fxl.codes.kisekae.Controllers
_databaseService.StoreToDatabase(file);
return Redirect("/");
return View();
}
public IActionResult Privacy()
+5 -2
View File
@@ -1,3 +1,4 @@
using System.Threading.Tasks;
using fxl.codes.kisekae.Services;
using Microsoft.AspNetCore.Mvc;
@@ -12,9 +13,11 @@ namespace fxl.codes.kisekae.Controllers
_databaseService = databaseService;
}
public IActionResult Index(int id, int configId)
public async Task<IActionResult> Index(int id)
{
return View();
var model = await _databaseService.LoadConfig(id);
return View(model);
}
}
}
+4 -1
View File
@@ -1,4 +1,5 @@
using System.ComponentModel.DataAnnotations.Schema;
using System.Runtime.Serialization;
namespace fxl.codes.kisekae.Entities
{
@@ -8,12 +9,14 @@ namespace fxl.codes.kisekae.Entities
public int Id { get; set; }
[Column("cel_id")] public int CelId { get; set; }
[Column("config_id")] public int ConfigId { get; set; }
public int Group { get; set; }
public int Mark { get; set; }
public int Fix { get; set; }
public Set Sets { get; set; } = Set.Unset;
public int Transparency { get; set; }
public string Comment { get; set; }
[Column("palette_id")] public int PaletteId { get; set; }
[IgnoreDataMember] public int PaletteIndex { get; set; }
[Column("palette_group")] public int PaletteGroup { get; set; }
public int X { get; set; }
public int Y { get; set; }
}
+13
View File
@@ -0,0 +1,13 @@
using System.ComponentModel.DataAnnotations.Schema;
namespace fxl.codes.kisekae.Entities
{
[Table("cel_render")]
public class CelRenderDto
{
public int Id { get; set; }
[Column("cel_id")] public int CelId { get; set; }
[Column("palette_id")] public int PaletteId { get; set; }
public byte[] Data { get; set; }
}
}
-2
View File
@@ -37,8 +37,6 @@ export default class Main {
}
private init() {
this.linearProgress.open()
let main = document.querySelector("main")
let directories = main.querySelector("ul")
+58
View File
@@ -0,0 +1,58 @@
import {MDCChipSet} from "@material/chips"
import Builder from "./utility"
class Uploader {
chips: MDCChipSet
constructor() {
this.init()
}
init() {
let upload = document.getElementById("lzh_upload") as HTMLInputElement
let container = document.querySelector(".mdc-evolution-chip-set__chips")
document.addEventListener("MDCChipSet:interaction", (event: Event) => {
console.log(event)
})
document.addEventListener("MDCChipSet:selection", (event: Event) => {
console.log(event)
})
upload.addEventListener("change", (event: InputEvent) => {
while (container.firstChild) container.removeChild(container.firstChild)
for (let index = 0; index < upload.files.length; index++) {
this.addChip(container, index, upload.files.item(index))
}
let element = document.querySelector(".mdc-evolution-chip-set")
this.chips = MDCChipSet.attachTo(element)
})
}
addChip(container: Element, index: number, file: File) {
const chipClass = "mdc-evolution-chip"
let textButton = Builder.element("button", {"type":"button","tabindex":0}, `${chipClass}__action`, `${chipClass}__action--primary`)
.addChildren(
Builder.element("span", {}, `${chipClass}__ripple`, `${chipClass}__ripple--primary`),
Builder.element("span", {}, `${chipClass}__text-label`).setText(file.name))
let textWrapper = Builder.element("span", {"role":"gridcell"}, `${chipClass}__cell`, `${chipClass}__cell--primary`)
.addChildren(textButton)
let trailingButton = Builder.element("button", {"type":"button","tabindex":-1,"data-mdc-deletable":"true","aria-label":`Remove ${file.name}`})
.addChildren(
Builder.element("span", {}, `${chipClass}__ripple`,`${chipClass}__ripple--trailing`),
Builder.element("span", {}, `${chipClass}__icon`,`${chipClass}__icon--trailing`).setText("close"))
let trailingWrapper = Builder.element("span", {"role":"gridcell"}, `${chipClass}__cell`, `${chipClass}__cell--trailing`)
.addChildren(trailingButton)
let chip = Builder.element("span", {"role":"row","id":`chip_${index}`}, chipClass).addChildren(textWrapper, trailingWrapper).build()
container.appendChild(chip)
}
}
new Uploader()
+4
View File
@@ -46,4 +46,8 @@ export default class Builder {
build(): HTMLElement {
return this.element
}
static element(tag: string, attributes: { [key: string]: string | number }, ...classes: string[]): Builder {
return new Builder(tag).addAttributes(attributes).addClass(...classes)
}
}
+6 -4
View File
@@ -4,15 +4,14 @@ using System.Linq;
using System.Text;
using System.Text.RegularExpressions;
using fxl.codes.kisekae.Entities;
using fxl.codes.kisekae.Models;
using Microsoft.Extensions.Logging;
namespace fxl.codes.kisekae.Services
{
public class ConfigurationReaderService
{
private const string CelRegex = @"#(?<Group>\d*)\.?(?<Fix>\d*)\s*(?<FileName>[\w\d\-]*\.[cCeElL]*)\s*\*?"
+ @"(?<PaletteId>\d*)?\s*\:?(?<Sets>[\d\s]*)?;?(?<Comment>[\w\d\-\s\%]*)";
private const string CelRegex = @"#(?<Mark>\d*)\.?(?<Fix>\d*)\s*(?<FileName>[\w\d\-]*\.[cCeElL]*)\s*\*?"
+ @"(?<PaletteIndex>\d*)?\s*\:?(?<Sets>[\d\s]*)?;?(?<Comment>[\w\d\-\s\%]*)";
private const string ResolutionRegexPattern = @"\((?<Width>[0-9]*).(?<Height>[0-9]*)\)";
@@ -124,13 +123,16 @@ namespace fxl.codes.kisekae.Services
foreach (var set in sets)
{
var value = set.Split(' ', StringSplitOptions.RemoveEmptyEntries);
var paletteGroup = int.Parse(value[0]);
for (var innerIndex = 1; innerIndex < value.Length; innerIndex++)
{
if (value[innerIndex] == "*") continue;
var point = value[innerIndex].Split(',', StringSplitOptions.RemoveEmptyEntries);
foreach (var cel in dto.Cels.Where(x => x.Id == innerIndex - 1))
foreach (var cel in dto.Cels.Where(x => x.Mark == innerIndex - 1))
{
cel.PaletteGroup = paletteGroup;
cel.X = int.Parse(point[0]);
cel.Y = int.Parse(point[1]);
}
+25 -43
View File
@@ -6,11 +6,11 @@ using System.IO.IsolatedStorage;
using System.Linq;
using System.Security.Cryptography;
using System.Text;
using System.Text.RegularExpressions;
using System.Threading.Tasks;
using Dapper;
using fxl.codes.kisekae.Entities;
using fxl.codes.kisekae.Extensions;
using fxl.codes.kisekae.Models;
using Microsoft.AspNetCore.Http;
using Microsoft.Extensions.Configuration;
using Microsoft.Extensions.Logging;
@@ -55,48 +55,6 @@ namespace fxl.codes.kisekae.Services
return files;
}
public async void GetKisekaeConfig(int id, int configId)
{
await using var connection = new NpgsqlConnection(_connectionString);
await connection.OpenAsync();
var queryParams = new { Id = id, ConfigId = configId };
var cels = connection.Query<CelConfigDto>("select * from cel_config where config_id = @ConfigId", queryParams);
if (cels == null)
{
var config = connection.QuerySingle<ConfigurationDto>(
"select * from configuration where kisekae_id = @Id and id = @ConfigId",
queryParams);
foreach (var line in config.Data.Split(Environment.NewLine, StringSplitOptions.RemoveEmptyEntries))
switch (line.ToCharArray()[0])
{
case '(':
var resolutionRegex = new Regex(ResolutionRegexPattern);
var resolutionMatch = resolutionRegex.Match(line);
config.Width = int.Parse(resolutionMatch.Groups["Width"].Value);
config.Height = int.Parse(resolutionMatch.Groups["Height"].Value);
break;
case '[':
var borderValue = line[1..];
if (borderValue.Contains(';')) borderValue = borderValue.Split(';')[0].Trim();
config.BorderIndex = int.Parse(borderValue);
break;
case '%':
break;
case '#':
break;
case '$':
case ' ':
break;
}
await connection.UpdateAsync(config);
}
await connection.CloseAsync();
}
public async void StoreToDatabase(IFormFile file)
{
var memoryStream = await GetAsMemoryStream(file);
@@ -155,6 +113,30 @@ namespace fxl.codes.kisekae.Services
await connection.CloseAsync();
}
public async Task<PlaysetModel> LoadConfig(int configId)
{
await using var connection = new NpgsqlConnection(_connectionString);
await connection.OpenAsync();
var config = await connection.QuerySingleAsync<ConfigurationDto>("select * from configuration where id = @configId", new { configId });
var celIds = await connection.QueryAsync<int>("select cel_id from cel_config where config_id = @configId", new { configId });
var renders = await connection.QueryAsync<CelRenderDto>($"select * from cel_render where cel_id in ({string.Join(",", celIds)})");
if (!renders.Any())
{
using var reader = await connection.QueryMultipleAsync($"select * from cel where id in ({string.Join(",", celIds)});"
+ "select * from palette where kisekae_id = @kisekaeId", new { kisekaeId = config.KisekaeId });
var cels = reader.Read<CelDto>();
var palettes = reader.Read<PaletteDto>().ToDictionary(x => x.Id);
}
await connection.CloseAsync();
return null;
}
private KisekaeDto GetExisting(IDbConnection connection, string filename, string checksum)
{
var existing = connection.QuerySingleOrDefault<KisekaeDto>("select * from kisekae where kisekae.filename = @Filename", new { Filename = filename });
+5 -2
View File
@@ -1,3 +1,4 @@
using Dapper;
using fxl.codes.kisekae.Services;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
@@ -34,7 +35,7 @@ namespace fxl.codes.kisekae
if (env.IsDevelopment())
{
app.UseDeveloperExceptionPage();
NpgsqlLogManager.Provider = new ConsoleLoggingProvider();
NpgsqlLogManager.Provider = new ConsoleLoggingProvider(NpgsqlLogLevel.Debug);
NpgsqlLogManager.IsParameterLoggingEnabled = true;
}
else
@@ -55,8 +56,10 @@ namespace fxl.codes.kisekae
{
endpoints.MapControllerRoute(
"default",
"{controller=Home}/{action=Index}/{id?}/{configId?}");
"{controller=Home}/{action=Index}/{id?}");
});
DefaultTypeMap.MatchNamesWithUnderscores = true;
}
}
}
+19 -1
View File
@@ -6,8 +6,9 @@ $fxl-orange: #ff6e40;
$on-primary: $fxl-gray
);
@use "@material/button/styles";
@use "@material/button/styles" as button-styles;
@use "@material/button/mixins" as button-mixins;
@use "@material/chips/styles" as chip-styles;
@use "@material/icon-button/icon-button";
@use "@material/linear-progress";
@use "@material/top-app-bar/mdc-top-app-bar";
@@ -31,6 +32,7 @@ body {
display: flex;
flex: 1;
flex-direction: column;
padding: 1rem;
header {
ul {
@@ -66,6 +68,22 @@ body {
}
}
}
.visually-hidden {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
&:focus + label {
outline: thin dotted;
}
&:focus-within + label {
outline: thin dotted;
}
}
}
footer {
+23 -4
View File
@@ -4,9 +4,23 @@
ViewData["Title"] = "Select";
}
<form enctype="multipart/form-data" method="post" asp-action="Upload">
<input type="file" name="file">
<input class="btn" type="submit" value="Upload">
<form enctype="multipart/form-data" method="post" asp-action="Upload" id="file_upload">
<fieldset>
<input type="file" name="file" multiple accept=".lzh" class="visually-hidden" id="lzh_upload">
<label for="lzh_upload" class="mdc-button mdc-button--outlined">
<span class="mdc-button__ripple"></span>
<span class="mdc-button__label">Add KiSS file(s)</span>
</label>
<button type="submit" class="mdc-button mdc-button--unelevated">
<span class="mdc-button__ripple"></span>
<span class="mdc-button__label">Upload</span>
</button>
<div class="selected-files mdc-evolution-chip-set" role="grid">
<div class="mdc-evolution-chip-set__chips" role="presentation"></div>
</div>
</fieldset>
</form>
<ul>
@@ -18,10 +32,15 @@
@foreach (var (key, value) in kiss.Configurations)
{
<li>
<a asp-controller="Play" asp-action="Index" asp-route-id="@kiss.Id" asp-route-configId="@key">@value</a>
<a asp-controller="Play" asp-action="Index" asp-route-id="@kiss.Id">@value</a>
</li>
}
</ul>
</li>
}
</ul>
@section Scripts
{
<script src="~/js/uploader.js" asp-append-version="true"></script>
}
+10
View File
@@ -0,0 +1,10 @@
@{
ViewData["Title"] = "Uploading";
}
Uploading...
@section Scripts
{
<script src="~/js/uploader.js" asp-append-version="true"></script>
}
+12 -12
View File
@@ -23,19 +23,19 @@
</section>
</div>
</header>
<div role="progressbar" class="mdc-linear-progress" aria-label="Example Progress Bar" aria-valuemin="0" aria-valuemax="1" aria-valuenow="0">
<div class="mdc-linear-progress__buffer">
<div class="mdc-linear-progress__buffer-bar"></div>
<div class="mdc-linear-progress__buffer-dots"></div>
</div>
<div class="mdc-linear-progress__bar mdc-linear-progress__primary-bar">
<span class="mdc-linear-progress__bar-inner"></span>
</div>
<div class="mdc-linear-progress__bar mdc-linear-progress__secondary-bar">
<span class="mdc-linear-progress__bar-inner"></span>
</div>
</div>
<main class="mdc-top-app-bar--fixed-adjust" role="main">
<div role="progressbar" class="mdc-linear-progress" aria-label="Example Progress Bar" aria-valuemin="0" aria-valuemax="1" aria-valuenow="0">
<div class="mdc-linear-progress__buffer">
<div class="mdc-linear-progress__buffer-bar"></div>
<div class="mdc-linear-progress__buffer-dots"></div>
</div>
<div class="mdc-linear-progress__bar mdc-linear-progress__primary-bar">
<span class="mdc-linear-progress__bar-inner"></span>
</div>
<div class="mdc-linear-progress__bar mdc-linear-progress__secondary-bar">
<span class="mdc-linear-progress__bar-inner"></span>
</div>
</div>
@RenderBody()
</main>
<footer>
+1
View File
@@ -9,6 +9,7 @@
<TypeScriptCompile Include="Scripts\main.ts" />
<TypeScriptCompile Include="Scripts\pto.ts" />
<TypeScriptCompile Include="Scripts\tracker.ts" />
<TypeScriptCompile Include="Scripts\upload.ts" />
<TypeScriptCompile Include="Scripts\utility.ts" />
</ItemGroup>
+2 -2
View File
@@ -2,8 +2,8 @@ const path = require('path');
module.exports = [{
entry: {
main: "./Scripts/main.ts",
style: "./Styles/main.scss"
main: ["./Scripts/main.ts", "./Styles/main.scss"],
uploader: "./Scripts/upload.ts",
},
output: {
filename: 'js/[name].js',
+940
View File
@@ -713,6 +713,932 @@ svg.mdc-button__icon {
/*rtl:end:ignore*/
}
.mdc-evolution-chip,
.mdc-evolution-chip__cell,
.mdc-evolution-chip__action {
display: inline-flex;
align-items: center;
}
.mdc-evolution-chip {
position: relative;
max-width: 100%;
}
.mdc-evolution-chip .mdc-elevation-overlay {
width: 100%;
height: 100%;
top: 0;
/* @noflip */
/*rtl:ignore*/
left: 0;
}
.mdc-evolution-chip__cell,
.mdc-evolution-chip__action {
height: 100%;
}
.mdc-evolution-chip__cell--primary {
overflow-x: hidden;
}
.mdc-evolution-chip__cell--trailing {
flex: 1 0 auto;
}
.mdc-evolution-chip__action {
align-items: center;
background: none;
border: none;
box-sizing: content-box;
cursor: pointer;
display: inline-flex;
justify-content: center;
outline: none;
padding: 0;
text-decoration: none;
color: inherit;
}
.mdc-evolution-chip__action--presentational {
cursor: auto;
}
.mdc-evolution-chip--disabled,
.mdc-evolution-chip__action:disabled {
pointer-events: none;
}
.mdc-evolution-chip__action--primary {
overflow-x: hidden;
}
.mdc-evolution-chip__action--trailing {
position: relative;
}
.mdc-evolution-chip__action--primary:before {
box-sizing: border-box;
content: "";
height: 100%;
left: 0;
position: absolute;
pointer-events: none;
top: 0;
width: 100%;
z-index: 1;
}
.mdc-evolution-chip--touch {
margin-top: 8px;
margin-bottom: 8px;
}
.mdc-evolution-chip__action-touch {
position: absolute;
top: 50%;
height: 48px;
left: 0;
right: 0;
transform: translateY(-50%);
}
.mdc-evolution-chip__text-label {
white-space: nowrap;
user-select: none;
text-overflow: ellipsis;
overflow: hidden;
}
.mdc-evolution-chip__graphic {
align-items: center;
display: inline-flex;
justify-content: center;
overflow: hidden;
pointer-events: none;
position: relative;
flex: 1 0 auto;
}
.mdc-evolution-chip__checkmark {
position: absolute;
opacity: 0;
top: 50%;
/* @noflip */
/*rtl:ignore*/
left: 50%;
}
.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic {
width: 0;
}
.mdc-evolution-chip__checkmark-background {
opacity: 0;
}
.mdc-evolution-chip__checkmark-svg {
display: block;
}
.mdc-evolution-chip__checkmark-path {
stroke-width: 2px;
stroke-dasharray: 29.7833385;
stroke-dashoffset: 29.7833385;
stroke: currentColor;
}
.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic {
transition: width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark {
transition: transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
transform: translate(-75%, -50%);
}
.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path {
transition: stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic {
transition: width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark {
transition: opacity 50ms 0ms linear, transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
transform: translate(-75%, -50%);
}
.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path {
stroke-dashoffset: 0;
}
.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary {
transition: opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path {
transition: stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary {
transition: opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1);
}
.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark {
transition: opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);
transform: translate(-50%, -50%);
}
.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path {
stroke-dashoffset: 0;
}
.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary {
opacity: 0;
}
.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark {
transform: translate(-50%, -50%);
opacity: 1;
}
.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path {
stroke-dashoffset: 0;
}
@keyframes mdc-evolution-chip-enter {
from {
transform: scale(0.8);
opacity: 0.4;
}
to {
transform: scale(1);
opacity: 1;
}
}
.mdc-evolution-chip--enter {
animation: mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1);
}
@keyframes mdc-evolution-chip-exit {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.mdc-evolution-chip--exit {
animation: mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1);
}
.mdc-evolution-chip--hidden {
opacity: 0;
pointer-events: none;
transition: width 150ms 0ms cubic-bezier(0.4, 0, 1, 1);
}
.mdc-evolution-chip {
height: 32px;
border-radius: 16px;
background-color: #e0e0e0;
}
.mdc-evolution-chip .mdc-evolution-chip__ripple {
border-radius: 16px;
}
.mdc-evolution-chip .mdc-evolution-chip__action--primary:before,
.mdc-evolution-chip .mdc-evolution-chip__action--primary:after {
border-radius: 16px;
}
.mdc-evolution-chip .mdc-evolution-chip__icon--primary {
border-radius: 16px;
}
.mdc-evolution-chip .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 12px;
/* @noflip */
/*rtl:ignore*/
padding-right: 12px;
}
[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary, .mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 12px;
/* @noflip */
/*rtl:ignore*/
padding-right: 12px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic {
/* @noflip */
/*rtl:ignore*/
padding-left: 6px;
/* @noflip */
/*rtl:ignore*/
padding-right: 6px;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 6px;
/* @noflip */
/*rtl:ignore*/
padding-right: 6px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 12px;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 12px;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing {
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing, .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing, .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after, .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 12px;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary, .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 12px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic {
/* @noflip */
/*rtl:ignore*/
padding-left: 6px;
/* @noflip */
/*rtl:ignore*/
padding-right: 6px;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 6px;
/* @noflip */
/*rtl:ignore*/
padding-right: 6px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing {
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
}
[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary, .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
/*rtl:end:ignore*/
}
.mdc-evolution-chip .mdc-evolution-chip__text-label {
color: rgba(0, 0, 0, 0.87);
}
.mdc-evolution-chip .mdc-evolution-chip__icon--primary {
color: rgba(0, 0, 0, 0.87);
}
.mdc-evolution-chip .mdc-evolution-chip__checkmark {
color: rgba(0, 0, 0, 0.87);
}
.mdc-evolution-chip .mdc-evolution-chip__icon--trailing {
color: rgba(0, 0, 0, 0.87);
}
.mdc-evolution-chip .mdc-evolution-chip__text-label {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-family: Roboto, sans-serif;
/* @alternate */
font-family: var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, Roboto, sans-serif));
font-size: 0.875rem;
/* @alternate */
font-size: var(--mdc-typography-body2-font-size, 0.875rem);
line-height: 1.25rem;
/* @alternate */
line-height: var(--mdc-typography-body2-line-height, 1.25rem);
font-weight: 400;
/* @alternate */
font-weight: var(--mdc-typography-body2-font-weight, 400);
letter-spacing: 0.0178571429em;
/* @alternate */
letter-spacing: var(--mdc-typography-body2-letter-spacing, 0.0178571429em);
text-decoration: inherit;
/* @alternate */
text-decoration: var(--mdc-typography-body2-text-decoration, inherit);
text-transform: inherit;
/* @alternate */
text-transform: var(--mdc-typography-body2-text-transform, inherit);
}
.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon) {
--mdc-chip-graphic-selected-width: 20px;
}
.mdc-evolution-chip .mdc-evolution-chip__graphic {
height: 20px;
width: 20px;
font-size: 20px;
}
.mdc-evolution-chip .mdc-evolution-chip__icon--primary {
height: 20px;
width: 20px;
font-size: 20px;
}
.mdc-evolution-chip .mdc-evolution-chip__checkmark {
height: 20px;
width: 20px;
}
.mdc-evolution-chip .mdc-evolution-chip__icon--trailing,
.mdc-evolution-chip .mdc-evolution-chip__action--trailing:after {
height: 18px;
width: 18px;
font-size: 18px;
}
@media screen and (forced-colors: active), (-ms-high-contrast: active) {
.mdc-evolution-chip.mdc-evolution-chip--disabled .mdc-evolution-chip__action--primary:before {
border-color: GrayText;
}
.mdc-evolution-chip.mdc-evolution-chip--disabled .mdc-evolution-chip__text-label {
color: GrayText;
}
.mdc-evolution-chip.mdc-evolution-chip--disabled .mdc-evolution-chip__icon--primary {
color: GrayText;
}
.mdc-evolution-chip.mdc-evolution-chip--disabled .mdc-evolution-chip__checkmark {
color: GrayText;
}
.mdc-evolution-chip.mdc-evolution-chip--disabled .mdc-evolution-chip__icon--trailing {
color: GrayText;
}
}
.mdc-evolution-chip .mdc-evolution-chip__action:after {
position: absolute;
content: "";
border: 0px solid transparent;
pointer-events: none;
box-sizing: border-box;
z-index: 1;
}
.mdc-evolution-chip .mdc-evolution-chip__action:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused:after, .mdc-evolution-chip .mdc-evolution-chip__action:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus:after {
border-width: 5px;
border-style: double;
}
.mdc-evolution-chip .mdc-evolution-chip__action--primary:after {
height: 100%;
width: 100%;
top: 50%;
/* @noflip */
/*rtl:ignore*/
left: 50%;
transform: translate(-50%, -50%);
}
.mdc-evolution-chip .mdc-evolution-chip__action--trailing:after {
top: 50%;
transform: translateY(-50%);
border-radius: 50%;
}
.mdc-evolution-chip--filter.mdc-evolution-chip--selected {
background-color: #cecece;
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic {
/* @noflip */
/*rtl:ignore*/
padding-left: 4px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 4px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 12px;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 12px;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic {
/* @noflip */
/*rtl:ignore*/
padding-left: 4px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 4px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing {
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 8px;
/* @noflip */
/*rtl:ignore*/
padding-right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after {
/* @noflip */
/*rtl:ignore*/
left: 8px;
/* @noflip */
/*rtl:ignore*/
right: initial;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing:after[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
left: initial;
/* @noflip */
/*rtl:ignore*/
right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary {
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
}
[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary, .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
padding-left: 0;
/* @noflip */
/*rtl:ignore*/
padding-right: 0;
/*rtl:end:ignore*/
}
.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon) {
--mdc-chip-graphic-selected-width: 24px;
}
.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic {
height: 24px;
width: 24px;
font-size: 24px;
}
.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary {
height: 24px;
width: 24px;
font-size: 24px;
}
.mdc-evolution-chip__action--primary .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--primary .mdc-evolution-chip__ripple::after {
background-color: #000;
/* @alternate */
background-color: var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000));
}
.mdc-evolution-chip__action--primary:hover .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--primary.mdc-ripple-surface--hover .mdc-evolution-chip__ripple::before {
opacity: 0.04;
/* @alternate */
opacity: var(--mdc-ripple-hover-opacity, 0.04);
}
.mdc-evolution-chip__action--primary.mdc-ripple-upgraded--background-focused .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--primary:not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__ripple::before {
transition-duration: 75ms;
opacity: 0.12;
/* @alternate */
opacity: var(--mdc-ripple-focus-opacity, 0.12);
}
.mdc-evolution-chip__action--primary:not(.mdc-ripple-upgraded) .mdc-evolution-chip__ripple::after {
transition: opacity 150ms linear;
}
.mdc-evolution-chip__action--primary:not(.mdc-ripple-upgraded):active .mdc-evolution-chip__ripple::after {
transition-duration: 75ms;
opacity: 0.12;
/* @alternate */
opacity: var(--mdc-ripple-press-opacity, 0.12);
}
.mdc-evolution-chip__action--primary.mdc-ripple-upgraded {
--mdc-ripple-fg-opacity: var(--mdc-ripple-press-opacity, 0.12);
}
.mdc-evolution-chip__action--trailing .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--trailing .mdc-evolution-chip__ripple::after {
background-color: #000;
/* @alternate */
background-color: var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000));
}
.mdc-evolution-chip__action--trailing:hover .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--trailing.mdc-ripple-surface--hover .mdc-evolution-chip__ripple::before {
opacity: 0.04;
/* @alternate */
opacity: var(--mdc-ripple-hover-opacity, 0.04);
}
.mdc-evolution-chip__action--trailing.mdc-ripple-upgraded--background-focused .mdc-evolution-chip__ripple::before, .mdc-evolution-chip__action--trailing:not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__ripple::before {
transition-duration: 75ms;
opacity: 0.12;
/* @alternate */
opacity: var(--mdc-ripple-focus-opacity, 0.12);
}
.mdc-evolution-chip__action--trailing:not(.mdc-ripple-upgraded) .mdc-evolution-chip__ripple::after {
transition: opacity 150ms linear;
}
.mdc-evolution-chip__action--trailing:not(.mdc-ripple-upgraded):active .mdc-evolution-chip__ripple::after {
transition-duration: 75ms;
opacity: 0.12;
/* @alternate */
opacity: var(--mdc-ripple-press-opacity, 0.12);
}
.mdc-evolution-chip__action--trailing.mdc-ripple-upgraded {
--mdc-ripple-fg-opacity: var(--mdc-ripple-press-opacity, 0.12);
}
.mdc-evolution-chip__ripple--trailing {
height: 18px;
width: 18px;
}
.mdc-evolution-chip__action {
--mdc-ripple-fg-size: 0;
--mdc-ripple-left: 0;
--mdc-ripple-top: 0;
--mdc-ripple-fg-scale: 1;
--mdc-ripple-fg-translate-end: 0;
--mdc-ripple-fg-translate-start: 0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::before,
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::after {
position: absolute;
border-radius: 50%;
opacity: 0;
pointer-events: none;
content: "";
}
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::before {
transition: opacity 15ms linear, background-color 15ms linear;
z-index: 1;
/* @alternate */
z-index: var(--mdc-ripple-z-index, 1);
}
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::after {
z-index: 0;
/* @alternate */
z-index: var(--mdc-ripple-z-index, 0);
}
.mdc-evolution-chip__action.mdc-ripple-upgraded .mdc-evolution-chip__ripple::before {
transform: scale(var(--mdc-ripple-fg-scale, 1));
}
.mdc-evolution-chip__action.mdc-ripple-upgraded .mdc-evolution-chip__ripple::after {
top: 0;
/* @noflip */
/*rtl:ignore*/
left: 0;
transform: scale(0);
transform-origin: center center;
}
.mdc-evolution-chip__action.mdc-ripple-upgraded--unbounded .mdc-evolution-chip__ripple::after {
top: var(--mdc-ripple-top, 0);
/* @noflip */
/*rtl:ignore*/
left: var(--mdc-ripple-left, 0);
}
.mdc-evolution-chip__action.mdc-ripple-upgraded--foreground-activation .mdc-evolution-chip__ripple::after {
animation: mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards;
}
.mdc-evolution-chip__action.mdc-ripple-upgraded--foreground-deactivation .mdc-evolution-chip__ripple::after {
animation: mdc-ripple-fg-opacity-out 150ms;
transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
}
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::before,
.mdc-evolution-chip__action .mdc-evolution-chip__ripple::after {
top: calc(50% - 100%);
/* @noflip */
/*rtl:ignore*/
left: calc(50% - 100%);
width: 200%;
height: 200%;
}
.mdc-evolution-chip__action.mdc-ripple-upgraded .mdc-evolution-chip__ripple::after {
width: var(--mdc-ripple-fg-size, 100%);
height: var(--mdc-ripple-fg-size, 100%);
}
.mdc-evolution-chip__ripple {
position: absolute;
box-sizing: content-box;
overflow: hidden;
pointer-events: none;
}
.mdc-evolution-chip__ripple--primary {
height: 100%;
width: 100%;
top: 0;
/* @noflip */
/*rtl:ignore*/
left: 0;
}
.mdc-evolution-chip__ripple--trailing {
top: 50%;
transform: translateY(-50%);
}
.mdc-evolution-chip-set {
display: flex;
}
.mdc-evolution-chip-set:focus {
outline: none;
}
.mdc-evolution-chip-set__chips {
display: flex;
flex-flow: wrap;
min-width: 0;
}
.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips {
flex-flow: nowrap;
}
.mdc-evolution-chip-set .mdc-evolution-chip-set__chips {
/* @noflip */
/*rtl:ignore*/
margin-left: -8px;
/* @noflip */
/*rtl:ignore*/
margin-right: 0;
}
[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips, .mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
margin-left: 0;
/* @noflip */
/*rtl:ignore*/
margin-right: -8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip-set .mdc-evolution-chip {
/* @noflip */
/*rtl:ignore*/
margin-left: 8px;
/* @noflip */
/*rtl:ignore*/
margin-right: 0;
}
[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip, .mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl] {
/*rtl:begin:ignore*/
/* @noflip */
/*rtl:ignore*/
margin-left: 0;
/* @noflip */
/*rtl:ignore*/
margin-right: 8px;
/*rtl:end:ignore*/
}
.mdc-evolution-chip-set .mdc-evolution-chip {
margin-top: 4px;
margin-bottom: 4px;
}
.mdc-top-app-bar {
background-color: #ff6e40;
/* @alternate */
@@ -1626,6 +2552,7 @@ body main {
display: flex;
flex: 1;
flex-direction: column;
padding: 1rem;
}
@keyframes mdc-linear-progress-primary-indeterminate-translate {
0% {
@@ -1951,6 +2878,19 @@ body main article #play_space .cel-image {
visibility: hidden;
position: absolute;
}
body main .visually-hidden {
position: absolute !important;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
body main .visually-hidden:focus + label {
outline: thin dotted;
}
body main .visually-hidden:focus-within + label {
outline: thin dotted;
}
body footer {
background-color: #ff6e40;
font-size: smaller;
+46 -3
View File
@@ -190,13 +190,23 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
/***/ }),
/***/ "./Styles/main.scss":
/*!**************************!*\
!*** ./Styles/main.scss ***!
\**************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (__webpack_require__.p + \"css/main.css\");\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Styles/main.scss?");
/***/ }),
/***/ "./Scripts/main.ts":
/*!*************************!*\
!*** ./Scripts/main.ts ***!
\*************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _material_linear_progress__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @material/linear-progress */ \"./node_modules/@material/linear-progress/component.js\");\n/* harmony import */ var _material_ripple__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @material/ripple */ \"./node_modules/@material/ripple/component.js\");\n/* harmony import */ var _material_top_app_bar__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @material/top-app-bar */ \"./node_modules/@material/top-app-bar/component.js\");\n/* harmony import */ var _tracker__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tracker */ \"./Scripts/tracker.ts\");\n/* harmony import */ var _utility__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utility */ \"./Scripts/utility.ts\");\n\n\n\n\n\nvar Main = (function () {\n function Main() {\n var _this = this;\n this.ripples = [];\n this.appBar = _material_top_app_bar__WEBPACK_IMPORTED_MODULE_2__.MDCTopAppBar.attachTo(document.querySelector(\".mdc-top-app-bar\"));\n document.querySelectorAll(\".mdc-button\").forEach(function (button) {\n _this.ripples.push(_material_ripple__WEBPACK_IMPORTED_MODULE_3__.MDCRipple.attachTo(button));\n });\n this.linearProgress = _material_linear_progress__WEBPACK_IMPORTED_MODULE_4__.MDCLinearProgress.attachTo(document.querySelector(\".mdc-linear-progress\"));\n this.init();\n }\n Main.prototype.load = function (containerId, headerId, playset, set) {\n if (set === void 0) { set = 0; }\n var container = document.getElementById(containerId);\n var menu = document.getElementById(headerId).querySelector(\"ul\");\n var tracker = new _tracker__WEBPACK_IMPORTED_MODULE_0__[\"default\"](playset, menu, container);\n tracker.setPlayArea(set);\n };\n Main.prototype.init = function () {\n var _this = this;\n this.linearProgress.open();\n var main = document.querySelector(\"main\");\n var directories = main.querySelector(\"ul\");\n if (!directories)\n return;\n var links = directories.querySelectorAll(\"a\");\n links.forEach(function (link) {\n link.addEventListener(\"click\", function () {\n _this.linearProgress.determinate = false;\n _this.linearProgress.open();\n var directory = link.attributes.getNamedItem(\"data-directory\");\n var form = new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"form\")\n .addAttributes({ \"method\": \"post\", \"action\": \"/Home/Select\" })\n .addChildren(new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"input\").addAttributes({\n \"type\": \"hidden\",\n \"name\": \"directory\",\n \"value\": directory.value\n }), new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"input\").addAttributes({\n \"type\": \"hidden\",\n \"name\": \"file\",\n \"value\": link.textContent\n })).build();\n link.appendChild(form);\n form.submit();\n });\n });\n };\n return Main;\n}());\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Main);\ndocument.kisekae = new Main();\n\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Scripts/main.ts?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _material_linear_progress__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @material/linear-progress */ \"./node_modules/@material/linear-progress/component.js\");\n/* harmony import */ var _material_ripple__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @material/ripple */ \"./node_modules/@material/ripple/component.js\");\n/* harmony import */ var _material_top_app_bar__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @material/top-app-bar */ \"./node_modules/@material/top-app-bar/component.js\");\n/* harmony import */ var _tracker__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./tracker */ \"./Scripts/tracker.ts\");\n/* harmony import */ var _utility__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utility */ \"./Scripts/utility.ts\");\n\n\n\n\n\nvar Main = (function () {\n function Main() {\n var _this = this;\n this.ripples = [];\n this.appBar = _material_top_app_bar__WEBPACK_IMPORTED_MODULE_2__.MDCTopAppBar.attachTo(document.querySelector(\".mdc-top-app-bar\"));\n document.querySelectorAll(\".mdc-button\").forEach(function (button) {\n _this.ripples.push(_material_ripple__WEBPACK_IMPORTED_MODULE_3__.MDCRipple.attachTo(button));\n });\n this.linearProgress = _material_linear_progress__WEBPACK_IMPORTED_MODULE_4__.MDCLinearProgress.attachTo(document.querySelector(\".mdc-linear-progress\"));\n this.init();\n }\n Main.prototype.load = function (containerId, headerId, playset, set) {\n if (set === void 0) { set = 0; }\n var container = document.getElementById(containerId);\n var menu = document.getElementById(headerId).querySelector(\"ul\");\n var tracker = new _tracker__WEBPACK_IMPORTED_MODULE_0__[\"default\"](playset, menu, container);\n tracker.setPlayArea(set);\n };\n Main.prototype.init = function () {\n var _this = this;\n var main = document.querySelector(\"main\");\n var directories = main.querySelector(\"ul\");\n if (!directories)\n return;\n var links = directories.querySelectorAll(\"a\");\n links.forEach(function (link) {\n link.addEventListener(\"click\", function () {\n _this.linearProgress.determinate = false;\n _this.linearProgress.open();\n var directory = link.attributes.getNamedItem(\"data-directory\");\n var form = new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"form\")\n .addAttributes({ \"method\": \"post\", \"action\": \"/Home/Select\" })\n .addChildren(new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"input\").addAttributes({\n \"type\": \"hidden\",\n \"name\": \"directory\",\n \"value\": directory.value\n }), new _utility__WEBPACK_IMPORTED_MODULE_1__[\"default\"](\"input\").addAttributes({\n \"type\": \"hidden\",\n \"name\": \"file\",\n \"value\": link.textContent\n })).build();\n link.appendChild(form);\n form.submit();\n });\n });\n };\n return Main;\n}());\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Main);\ndocument.kisekae = new Main();\n\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Scripts/main.ts?");
/***/ }),
@@ -226,7 +236,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
\****************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nvar Builder = (function () {\n function Builder(tag) {\n this.element = document.createElement(tag);\n }\n Builder.prototype.addAttributes = function (attributes) {\n for (var _i = 0, _a = Object.keys(attributes); _i < _a.length; _i++) {\n var key = _a[_i];\n this.addAttribute(key, attributes[key]);\n }\n return this;\n };\n Builder.prototype.addAttribute = function (name, value) {\n var attribute = document.createAttribute(name);\n attribute.value = value.toString();\n this.element.attributes.setNamedItem(attribute);\n return this;\n };\n Builder.prototype.addClass = function () {\n var _a;\n var classes = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n classes[_i] = arguments[_i];\n }\n (_a = this.element.classList).add.apply(_a, classes);\n return this;\n };\n Builder.prototype.addChildren = function () {\n var _this = this;\n var children = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n children[_i] = arguments[_i];\n }\n children.forEach(function (child) {\n if (child instanceof HTMLElement) {\n _this.element.appendChild(child);\n }\n else {\n _this.element.appendChild(child.build());\n }\n });\n return this;\n };\n Builder.prototype.setText = function (text) {\n this.element.textContent = text;\n return this;\n };\n Builder.prototype.build = function () {\n return this.element;\n };\n return Builder;\n}());\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Builder);\n\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Scripts/utility.ts?");
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\nvar Builder = (function () {\n function Builder(tag) {\n this.element = document.createElement(tag);\n }\n Builder.prototype.addAttributes = function (attributes) {\n for (var _i = 0, _a = Object.keys(attributes); _i < _a.length; _i++) {\n var key = _a[_i];\n this.addAttribute(key, attributes[key]);\n }\n return this;\n };\n Builder.prototype.addAttribute = function (name, value) {\n var attribute = document.createAttribute(name);\n attribute.value = value.toString();\n this.element.attributes.setNamedItem(attribute);\n return this;\n };\n Builder.prototype.addClass = function () {\n var _a;\n var classes = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n classes[_i] = arguments[_i];\n }\n (_a = this.element.classList).add.apply(_a, classes);\n return this;\n };\n Builder.prototype.addChildren = function () {\n var _this = this;\n var children = [];\n for (var _i = 0; _i < arguments.length; _i++) {\n children[_i] = arguments[_i];\n }\n children.forEach(function (child) {\n if (child instanceof HTMLElement) {\n _this.element.appendChild(child);\n }\n else {\n _this.element.appendChild(child.build());\n }\n });\n return this;\n };\n Builder.prototype.setText = function (text) {\n this.element.textContent = text;\n return this;\n };\n Builder.prototype.build = function () {\n return this.element;\n };\n Builder.element = function (tag, attributes) {\n var _a;\n var classes = [];\n for (var _i = 2; _i < arguments.length; _i++) {\n classes[_i - 2] = arguments[_i];\n }\n return (_a = new Builder(tag).addAttributes(attributes)).addClass.apply(_a, classes);\n };\n return Builder;\n}());\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Builder);\n\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Scripts/utility.ts?");
/***/ }),
@@ -279,6 +289,18 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/global */
/******/ (() => {
/******/ __webpack_require__.g = (function() {
/******/ if (typeof globalThis === 'object') return globalThis;
/******/ try {
/******/ return this || new Function('return this')();
/******/ } catch (e) {
/******/ if (typeof window === 'object') return window;
/******/ }
/******/ })();
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
@@ -295,12 +317,33 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/publicPath */
/******/ (() => {
/******/ var scriptUrl;
/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
/******/ var document = __webpack_require__.g.document;
/******/ if (!scriptUrl && document) {
/******/ if (document.currentScript)
/******/ scriptUrl = document.currentScript.src
/******/ if (!scriptUrl) {
/******/ var scripts = document.getElementsByTagName("script");
/******/ if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
/******/ }
/******/ }
/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
/******/ __webpack_require__.p = scriptUrl + "../";
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = __webpack_require__("./Scripts/main.ts");
/******/ __webpack_require__("./Scripts/main.ts");
/******/ var __webpack_exports__ = __webpack_require__("./Styles/main.scss");
/******/
/******/ })()
;
-98
View File
@@ -1,98 +0,0 @@
/*
* ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development").
* This devtool is neither made for production nor for readable output files.
* It uses "eval()" calls to create a separate source file in the browser devtools.
* If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/)
* or disable the default devtool with "devtool: false".
* If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/).
*/
/******/ (() => { // webpackBootstrap
/******/ "use strict";
/******/ var __webpack_modules__ = ({
/***/ "./Styles/main.scss":
/*!**************************!*\
!*** ./Styles/main.scss ***!
\**************************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (__webpack_require__.p + \"css/main.css\");\n\n//# sourceURL=webpack://fxl.codes.kisekae/./Styles/main.scss?");
/***/ })
/******/ });
/************************************************************************/
/******/ // The require scope
/******/ var __webpack_require__ = {};
/******/
/************************************************************************/
/******/ /* webpack/runtime/define property getters */
/******/ (() => {
/******/ // define getter functions for harmony exports
/******/ __webpack_require__.d = (exports, definition) => {
/******/ for(var key in definition) {
/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
/******/ }
/******/ }
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/global */
/******/ (() => {
/******/ __webpack_require__.g = (function() {
/******/ if (typeof globalThis === 'object') return globalThis;
/******/ try {
/******/ return this || new Function('return this')();
/******/ } catch (e) {
/******/ if (typeof window === 'object') return window;
/******/ }
/******/ })();
/******/ })();
/******/
/******/ /* webpack/runtime/hasOwnProperty shorthand */
/******/ (() => {
/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
/******/ })();
/******/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/******/ /* webpack/runtime/publicPath */
/******/ (() => {
/******/ var scriptUrl;
/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
/******/ var document = __webpack_require__.g.document;
/******/ if (!scriptUrl && document) {
/******/ if (document.currentScript)
/******/ scriptUrl = document.currentScript.src
/******/ if (!scriptUrl) {
/******/ var scripts = document.getElementsByTagName("script");
/******/ if(scripts.length) scriptUrl = scripts[scripts.length - 1].src
/******/ }
/******/ }
/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
/******/ __webpack_require__.p = scriptUrl + "../";
/******/ })();
/******/
/************************************************************************/
/******/
/******/ // startup
/******/ // Load entry module and return exports
/******/ // This entry module can't be inlined because the eval devtool is used.
/******/ var __webpack_exports__ = {};
/******/ __webpack_modules__["./Styles/main.scss"](0, __webpack_exports__, __webpack_require__);
/******/
/******/ })()
;
File diff suppressed because one or more lines are too long