Refactored css classes to match flyonui. Switched to postgres arrays for permissions. Migrated file manager. Adjusted everything to work with the latest mooncore version
This commit is contained in:
@@ -12,8 +12,8 @@
|
||||
</ItemGroup>
|
||||
|
||||
<ItemGroup>
|
||||
<PackageReference Include="MoonCore.PluginFramework" Version="1.0.7"/>
|
||||
<PackageReference Include="MoonCore.PluginFramework.Generator" Version="1.0.1"/>
|
||||
<PackageReference Include="MoonCore.PluginFramework" Version="1.0.8" />
|
||||
<PackageReference Include="MoonCore.PluginFramework.Generator" Version="1.0.2" />
|
||||
|
||||
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="9.0.5"/>
|
||||
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="9.0.5" PrivateAssets="all"/>
|
||||
@@ -50,6 +50,11 @@
|
||||
<PackagePath>styles</PackagePath>
|
||||
<CopyToOutputDirectory>Never</CopyToOutputDirectory>
|
||||
</None>
|
||||
<None Update="Styles\mappings\mooncore.map">
|
||||
<Pack>true</Pack>
|
||||
<PackagePath>styles</PackagePath>
|
||||
<CopyToOutputDirectory>Never</CopyToOutputDirectory>
|
||||
</None>
|
||||
</ItemGroup>
|
||||
|
||||
<ItemGroup>
|
||||
|
||||
@@ -1,9 +0,0 @@
|
||||
@keyframes shimmer {
|
||||
0% {
|
||||
background-position: 0 0
|
||||
}
|
||||
|
||||
to {
|
||||
background-position: -200% 0
|
||||
}
|
||||
}
|
||||
@@ -1,93 +0,0 @@
|
||||
/* Buttons */
|
||||
|
||||
.btn,
|
||||
.btn-lg,
|
||||
.btn-sm,
|
||||
.btn-xs {
|
||||
@apply cursor-pointer font-medium text-sm inline-flex items-center justify-center border border-transparent rounded-lg leading-5 shadow-sm transition active:scale-95;
|
||||
}
|
||||
|
||||
.btn {
|
||||
@apply px-3 py-2;
|
||||
}
|
||||
|
||||
.btn-lg {
|
||||
@apply px-4 py-3;
|
||||
}
|
||||
|
||||
.btn-sm {
|
||||
@apply px-2.5 py-1.5;
|
||||
}
|
||||
|
||||
.btn-xs {
|
||||
@apply px-2 py-0.5;
|
||||
}
|
||||
|
||||
/* Colors */
|
||||
|
||||
.btn-primary {
|
||||
@apply bg-primary hover:bg-primary/90 focus-visible:outline-primary text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
@apply bg-secondary hover:bg-secondary/90 focus-visible:outline-secondary text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-tertiary {
|
||||
@apply bg-tertiary hover:bg-tertiary/90 focus-visible:outline-tertiary text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-danger {
|
||||
@apply bg-danger hover:bg-danger/90 focus-visible:outline-danger text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-warning {
|
||||
@apply bg-warning hover:bg-warning/90 focus-visible:outline-warning text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-info {
|
||||
@apply bg-info hover:bg-info/90 focus-visible:outline-info text-diffcolor;
|
||||
}
|
||||
|
||||
.btn-success {
|
||||
@apply bg-success hover:bg-success/90 focus-visible:outline-success text-diffcolor;
|
||||
}
|
||||
|
||||
/* Disabled Buttons */
|
||||
|
||||
.btn:disabled,
|
||||
.btn-lg:disabled,
|
||||
.btn-sm:disabled,
|
||||
.btn-xs:disabled {
|
||||
@apply opacity-50 cursor-not-allowed pointer-events-none;
|
||||
}
|
||||
|
||||
/* Colors for Disabled States */
|
||||
|
||||
.btn-primary:disabled {
|
||||
@apply bg-primary/80 text-gray-300;
|
||||
}
|
||||
|
||||
.btn-secondary:disabled {
|
||||
@apply bg-secondary/80 text-gray-400;
|
||||
}
|
||||
|
||||
.btn-tertiary:disabled {
|
||||
@apply bg-tertiary/80 text-gray-300;
|
||||
}
|
||||
|
||||
.btn-danger:disabled {
|
||||
@apply bg-danger/80 text-gray-300;
|
||||
}
|
||||
|
||||
.btn-warning:disabled {
|
||||
@apply bg-warning/80 text-gray-400;
|
||||
}
|
||||
|
||||
.btn-info:disabled {
|
||||
@apply bg-info/80 text-gray-300;
|
||||
}
|
||||
|
||||
.btn-success:disabled {
|
||||
@apply bg-success/80 text-gray-300;
|
||||
}
|
||||
@@ -1,23 +0,0 @@
|
||||
.card {
|
||||
@apply flex flex-col bg-gray-800 shadow-sm rounded-xl;
|
||||
}
|
||||
|
||||
.card-header {
|
||||
@apply p-5;
|
||||
}
|
||||
|
||||
.card-header:has(+ .card-body) {
|
||||
@apply pb-0;
|
||||
}
|
||||
|
||||
.card-title {
|
||||
@apply text-2xl font-semibold text-white;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
@apply p-5 text-gray-200;
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
@apply p-5;
|
||||
}
|
||||
@@ -1,8 +0,0 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=fallback') layer(base);
|
||||
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap') layer(base);
|
||||
@import url("https://cdn.jsdelivr.net/npm/lucide-static/font/lucide.css") layer(base);
|
||||
|
||||
@theme {
|
||||
--font-inter: "Inter", var(--font-sans);
|
||||
--font-scp: "Source Code Pro", var(--font-mono);
|
||||
}
|
||||
@@ -1,77 +0,0 @@
|
||||
/* Forms */
|
||||
input[type="search"]::-webkit-search-decoration,
|
||||
input[type="search"]::-webkit-search-cancel-button,
|
||||
input[type="search"]::-webkit-search-results-button,
|
||||
input[type="search"]::-webkit-search-results-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.form-input,
|
||||
.form-textarea,
|
||||
.form-multiselect,
|
||||
.form-select,
|
||||
.form-checkbox,
|
||||
.form-radio {
|
||||
@apply bg-gray-700/60 border-2 focus:ring-0 focus:ring-offset-0 disabled:bg-gray-700/30 disabled:border-gray-700 disabled:hover:border-gray-700;
|
||||
}
|
||||
|
||||
.form-checkbox {
|
||||
@apply rounded;
|
||||
}
|
||||
|
||||
.form-input,
|
||||
.form-textarea,
|
||||
.form-multiselect,
|
||||
.form-select {
|
||||
@apply text-sm text-gray-100 leading-5 py-2 px-3 border-gray-700 focus:border-primary shadow-sm rounded-lg;
|
||||
}
|
||||
|
||||
.form-input,
|
||||
.form-textarea {
|
||||
@apply placeholder-gray-700;
|
||||
}
|
||||
|
||||
.form-select {
|
||||
@apply pr-10;
|
||||
}
|
||||
|
||||
.form-checkbox,
|
||||
.form-radio {
|
||||
@apply text-primary checked:bg-primary checked:border-transparent border border-gray-700/60 focus:border-primary/50;
|
||||
}
|
||||
|
||||
/* Switch element */
|
||||
.form-switch {
|
||||
@apply relative select-none;
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.form-switch label {
|
||||
@apply block overflow-hidden cursor-pointer h-6 rounded-full;
|
||||
}
|
||||
|
||||
.form-switch label > span:first-child {
|
||||
@apply absolute block rounded-full;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
right: 50%;
|
||||
transition: all .15s ease-out;
|
||||
}
|
||||
|
||||
.form-switch input[type="checkbox"]:checked + label {
|
||||
@apply bg-primary;
|
||||
}
|
||||
|
||||
.form-switch input[type="checkbox"]:checked + label > span:first-child {
|
||||
left: 22px;
|
||||
}
|
||||
|
||||
.form-switch input[type="checkbox"]:disabled + label {
|
||||
@apply cursor-not-allowed bg-gray-700/20 border border-gray-700/60;
|
||||
}
|
||||
|
||||
.form-switch input[type="checkbox"]:disabled + label > span:first-child {
|
||||
@apply bg-gray-600;
|
||||
}
|
||||
@@ -1,28 +0,0 @@
|
||||
.loader-spinner {
|
||||
width: 2.5rem;
|
||||
height: 2.5rem;
|
||||
border-radius: 50%;
|
||||
position: relative;
|
||||
animation: loader-spinner-rotate 1s linear infinite
|
||||
}
|
||||
.loader-spinner::before {
|
||||
content: "";
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
inset: 0px;
|
||||
border-radius: 50%;
|
||||
border: 3px solid #FFF;
|
||||
animation: loader-spinner-prixClipFix 2s linear infinite ;
|
||||
}
|
||||
|
||||
@keyframes loader-spinner-rotate {
|
||||
100% {transform: rotate(360deg)}
|
||||
}
|
||||
|
||||
@keyframes loader-spinner-prixClipFix {
|
||||
0% {clip-path:polygon(50% 50%,0 0,0 0,0 0,0 0,0 0)}
|
||||
25% {clip-path:polygon(50% 50%,0 0,100% 0,100% 0,100% 0,100% 0)}
|
||||
50% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,100% 100%,100% 100%)}
|
||||
75% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 100%)}
|
||||
100% {clip-path:polygon(50% 50%,0 0,100% 0,100% 100%,0 100%,0 0)}
|
||||
}
|
||||
@@ -1,25 +0,0 @@
|
||||
.progress {
|
||||
@apply bg-gray-800 rounded-full overflow-hidden;
|
||||
}
|
||||
|
||||
.progress-bar {
|
||||
@apply bg-primary rounded-full h-3;
|
||||
transition: width 0.6s ease;
|
||||
}
|
||||
|
||||
.progress-bar.progress-intermediate {
|
||||
animation: progress-animation 1s infinite linear;
|
||||
transform-origin: 0 50%
|
||||
}
|
||||
|
||||
@keyframes progress-animation {
|
||||
0% {
|
||||
transform: translateX(0) scaleX(0);
|
||||
}
|
||||
40% {
|
||||
transform: translateX(0) scaleX(0.4);
|
||||
}
|
||||
100% {
|
||||
transform: translateX(100%) scaleX(0.5);
|
||||
}
|
||||
}
|
||||
@@ -1,9 +0,0 @@
|
||||
* {
|
||||
scrollbar-width: thin;
|
||||
scrollbar-color: #64748b transparent;
|
||||
}
|
||||
|
||||
.no-scrollbar {
|
||||
scrollbar-width: none;
|
||||
scrollbar-color: transparent transparent;
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
.tabs {
|
||||
@apply flex gap-x-1 bg-gray-800 rounded-lg transition p-1;
|
||||
}
|
||||
|
||||
.tabs .tabs-segment {
|
||||
@apply cursor-pointer font-medium text-sm inline-flex items-center justify-center border border-transparent rounded-lg leading-5 text-gray-300 hover:text-primary py-1.5 px-3.5;
|
||||
}
|
||||
|
||||
.tabs .tabs-segment-active {
|
||||
@apply bg-primary hover:bg-primary/90 focus-visible:outline-primary text-diffcolor hover:text-diffcolor;
|
||||
}
|
||||
@@ -1,46 +0,0 @@
|
||||
@theme {
|
||||
/* Color Variables */
|
||||
|
||||
--color-primary: oklch(.511 .262 276.966);
|
||||
--color-secondary: rgb(31, 41, 55);
|
||||
--color-tertiary: oklch(.627 .265 303.9);
|
||||
--color-warning: oklch(.828 .189 84.429);
|
||||
--color-danger: oklch(.586 .253 17.585);
|
||||
--color-success: oklch(.627 .194 149.214);
|
||||
--color-info: oklch(.546 .245 262.881);
|
||||
|
||||
/* Gray */
|
||||
|
||||
--color-gray-50: #e8eefc;
|
||||
--color-gray-100: rgb(249 249 249);
|
||||
--color-gray-200: rgb(241 241 242);
|
||||
--color-gray-300: rgb(219 223 233);
|
||||
--color-gray-400: rgb(181 181 195);
|
||||
--color-gray-500: rgb(153 161 183);
|
||||
--color-gray-600: rgb(112 121 147);
|
||||
--color-gray-700: rgb(68 78 107);
|
||||
--color-gray-750: rgb(41 50 73);
|
||||
--color-gray-800: rgb(28 36 56);
|
||||
--color-gray-900: rgb(17 23 33);
|
||||
--color-gray-950: rgb(14 18 28);
|
||||
|
||||
/*
|
||||
--color-gray-50: #e8eefc;
|
||||
--color-gray-100: #ccd6ee;
|
||||
--color-gray-200: #bec9e1;
|
||||
--color-gray-300: #a3b2d5;
|
||||
--color-gray-400: #7d91bb;
|
||||
--color-gray-500: #5f719d;
|
||||
--color-gray-600: #1a2640;
|
||||
--color-gray-700: #101a2e;
|
||||
--color-gray-750: #0f1729;
|
||||
--color-gray-800: #0c1221;
|
||||
--color-gray-900: #050a16;
|
||||
--color-gray-950: #03060e;
|
||||
*/
|
||||
/* Full Colors */
|
||||
|
||||
--color-white: rgb(255 255 255);
|
||||
--color-black: rgb(0 0 0);
|
||||
--color-diffcolor: rgb(var(--color-white));
|
||||
}
|
||||
@@ -1,23 +0,0 @@
|
||||
@theme {
|
||||
/* Gray (Inverted for White Mode) */
|
||||
|
||||
--color-gray-100: rgb(14 18 28); /* Formerly gray-950 */
|
||||
--color-gray-200: rgb(17 23 33); /* Formerly gray-900 */
|
||||
--color-gray-300: rgb(28 36 56); /* Formerly gray-800 */
|
||||
--color-gray-400: rgb(41 50 73); /* Formerly gray-750 */
|
||||
--color-gray-500: rgb(68 78 107); /* Formerly gray-700 */
|
||||
--color-gray-600: rgb(112 121 147); /* Formerly gray-600 */
|
||||
--color-gray-700: rgb(153 161 183); /* Formerly gray-500 */
|
||||
--color-gray-750: rgb(181 181 195); /* Formerly gray-400 */
|
||||
--color-gray-800: rgb(219 223 233); /* Formerly gray-300 */
|
||||
--color-gray-900: rgb(241 241 242); /* Formerly gray-200 */
|
||||
--color-gray-950: rgb(249 249 249); /* Formerly gray-100 */
|
||||
|
||||
/* Full Colors (Inverted) */
|
||||
|
||||
--color-white: rgb(0 0 0); /* Inverted to black */
|
||||
--color-black: rgb(255 255 255); /* Inverted to white */
|
||||
|
||||
/* Special light mode stuff */
|
||||
--color-diffcolor: rgb(255 255 255);
|
||||
}
|
||||
@@ -1,26 +0,0 @@
|
||||
@import "./additions/fonts.css";
|
||||
@import "./additions/theme.css" layer(theme);
|
||||
|
||||
/* @import "./additions/theme.white.css"; */
|
||||
|
||||
@import "./additions/buttons.css" layer(components);
|
||||
@import "./additions/cards.css" layer(components);
|
||||
@import "./additions/forms.css" layer(components);
|
||||
@import "./additions/progress.css" layer(components);
|
||||
@import "./additions/scrollbar.css" layer(components);
|
||||
@import "./additions/loaders.css" layer(components);
|
||||
@import "./additions/tabs.css" layer(components);
|
||||
|
||||
@source "./mappings/*.map";
|
||||
|
||||
#blazor-error-ui {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#blazor-loader-label:after {
|
||||
content: var(--blazor-load-percentage-text, "Loading");
|
||||
}
|
||||
|
||||
#blazor-loader-progress {
|
||||
width: var(--blazor-load-percentage, 0%);
|
||||
}
|
||||
30
Moonlight.Client.Runtime/Styles/extract-classes.js
Normal file
30
Moonlight.Client.Runtime/Styles/extract-classes.js
Normal file
@@ -0,0 +1,30 @@
|
||||
// extract-classes.js
|
||||
const fs = require('fs');
|
||||
|
||||
module.exports = (opts = {}) => {
|
||||
const classSet = new Set();
|
||||
|
||||
return {
|
||||
postcssPlugin: 'extract-tailwind-classes',
|
||||
Rule(rule) {
|
||||
const selectorParser = require('postcss-selector-parser');
|
||||
selectorParser(selectors => {
|
||||
selectors.walkClasses(node => {
|
||||
classSet.add(node.value);
|
||||
});
|
||||
}).processSync(rule.selector);
|
||||
},
|
||||
OnceExit() {
|
||||
const classArray = Array.from(classSet).sort();
|
||||
|
||||
if (!fs.existsSync("./mappings")){
|
||||
fs.mkdirSync("./mappings");
|
||||
}
|
||||
|
||||
fs.writeFileSync('./mappings/mooncore.map', classArray.join('\n'));
|
||||
console.log(`✅ Extracted ${classArray.length} Tailwind classes to tailwind-classes.txt`);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
module.exports.postcss = true;
|
||||
1093
Moonlight.Client.Runtime/Styles/mappings/mooncore.map
Normal file → Executable file
1093
Moonlight.Client.Runtime/Styles/mappings/mooncore.map
Normal file → Executable file
File diff suppressed because it is too large
Load Diff
1317
Moonlight.Client.Runtime/Styles/package-lock.json
generated
1317
Moonlight.Client.Runtime/Styles/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -1,14 +1,23 @@
|
||||
{
|
||||
"dependencies": {
|
||||
"@tailwindcss/cli": "^4.1.4",
|
||||
"@tailwindcss/forms": "^0.5.10",
|
||||
"tailwindcss": "^4.1.4",
|
||||
"xml2js": "^0.6.2"
|
||||
},
|
||||
"name": "styles",
|
||||
"version": "1.0.0",
|
||||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"pretailwind-build": "node resolveNuget.js ../Moonlight.Client.Runtime.csproj",
|
||||
"tailwind-build": "npx tailwindcss -i style.css -o ../wwwroot/css/style.min.css",
|
||||
"pretailwind": "node resolveNuget.js ../Moonlight.Client.Runtime.csproj",
|
||||
"tailwind": "npx tailwindcss -i style.css -o ../wwwroot/css/style.min.css --watch"
|
||||
"tailwind": "npx postcss styles.css -o ../wwwroot/css/style.min.css --watch",
|
||||
"tailwind-build": "npx postcss styles.css -o ../wwwroot/css/style.min.css",
|
||||
"mappings": "EXTRACT_CLASSES=true npx postcss styles.css -o ../wwwroot/css/style.min.css "
|
||||
},
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"dependencies": {
|
||||
"@tailwindcss/postcss": "^4.1.11",
|
||||
"flyonui": "^2.2.0",
|
||||
"tailwindcss": "^4.1.11",
|
||||
"postcss": "^8.5.6",
|
||||
"postcss-cli": "^11.0.1",
|
||||
"postcss-selector-parser": "^7.1.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
}
|
||||
}
|
||||
|
||||
11
Moonlight.Client.Runtime/Styles/postcss.config.js
Normal file
11
Moonlight.Client.Runtime/Styles/postcss.config.js
Normal file
@@ -0,0 +1,11 @@
|
||||
const tailwindcss = require('@tailwindcss/postcss');
|
||||
const extractClasses = require('./extract-classes');
|
||||
|
||||
module.exports = {
|
||||
plugins: [
|
||||
tailwindcss
|
||||
],
|
||||
};
|
||||
|
||||
if(process.env.EXTRACT_CLASSES === "true")
|
||||
module.exports.plugins.push(extractClasses);
|
||||
@@ -1 +0,0 @@
|
||||
@import "./additions/fonts.css";
|
||||
@@ -1,80 +0,0 @@
|
||||
const fs = require('fs');
|
||||
const path = require('path');
|
||||
const os = require('os');
|
||||
const xml2js = require('xml2js');
|
||||
|
||||
// Helpers
|
||||
function getPackageRefs(csprojPath) {
|
||||
const xml = fs.readFileSync(csprojPath, 'utf8');
|
||||
const parser = new xml2js.Parser();
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
parser.parseString(xml, (err, result) => {
|
||||
if (err) return reject(err);
|
||||
|
||||
const itemGroups = result.Project.ItemGroup || [];
|
||||
const refs = [];
|
||||
|
||||
for (const group of itemGroups) {
|
||||
const packages = group.PackageReference || [];
|
||||
for (const pkg of packages) {
|
||||
const name = pkg.$.Include;
|
||||
const version = pkg.$.Version || (pkg.Version && pkg.Version[0]);
|
||||
if (name && version) {
|
||||
refs.push({ name: name.toLowerCase(), version });
|
||||
}
|
||||
}
|
||||
}
|
||||
resolve(refs);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
async function main() {
|
||||
const csprojPath = process.argv[2];
|
||||
if (!csprojPath || !fs.existsSync(csprojPath)) {
|
||||
console.error('Usage: Missing csproj path');
|
||||
process.exit(1);
|
||||
}
|
||||
|
||||
const nugetPath = path.join(os.homedir(), '.nuget', 'packages');
|
||||
const moonlightDir = path.join(__dirname, 'node_modules', 'moonlight');
|
||||
fs.mkdirSync(moonlightDir, { recursive: true });
|
||||
|
||||
const refs = await getPackageRefs(csprojPath);
|
||||
|
||||
var outputCss = "";
|
||||
var preOutputCss = "";
|
||||
|
||||
for (const { name, version } of refs) {
|
||||
const packagePath = path.join(nugetPath, name, version);
|
||||
const exportsFile = path.join(packagePath, 'styles', 'exports.css');
|
||||
const preTailwindFile = path.join(packagePath, 'styles', 'preTailwind.css');
|
||||
const sourceFolder = path.join(packagePath, 'src');
|
||||
|
||||
const rel = (p) => p.replace(/\\/g, '/');
|
||||
|
||||
if (fs.existsSync(exportsFile)) {
|
||||
outputCss += `@import "${rel(exportsFile)}";\n`;
|
||||
}
|
||||
|
||||
if (fs.existsSync(preTailwindFile)) {
|
||||
preOutputCss += `@import "${rel(preTailwindFile)}";\n`;
|
||||
}
|
||||
|
||||
if (fs.existsSync(sourceFolder)) {
|
||||
outputCss += `@source "${rel(path.join(sourceFolder, "**", "*.razor"))}";\n`;
|
||||
outputCss += `@source "${rel(path.join(sourceFolder, "**", "*.cs"))}";\n`;
|
||||
outputCss += `@source "${rel(path.join(sourceFolder, "**", "*.html"))}";\n`;
|
||||
}
|
||||
}
|
||||
|
||||
fs.writeFileSync(path.join(moonlightDir, 'nuget.css'), outputCss);
|
||||
fs.writeFileSync(path.join(moonlightDir, 'preTailwind.nuget.css'), preOutputCss);
|
||||
console.log(`Generated nuget.css in ${moonlightDir}`);
|
||||
}
|
||||
|
||||
main().catch(err => {
|
||||
console.error(err);
|
||||
process.exit(1);
|
||||
});
|
||||
@@ -1,21 +0,0 @@
|
||||
@import "./preTailwind.css";
|
||||
@import "moonlight/preTailwind.nuget.css";
|
||||
|
||||
@import "tailwindcss";
|
||||
|
||||
@import "./exports.css";
|
||||
@import "moonlight/nuget.css";
|
||||
|
||||
@plugin "@tailwindcss/forms" {
|
||||
strategy: "base";
|
||||
}
|
||||
|
||||
@source "../**/*.razor";
|
||||
@source "../**/*.cs";
|
||||
@source "../**/*.html";
|
||||
|
||||
@source "../../Moonlight.Client/**/*.razor";
|
||||
@source "../../Moonlight.Client/**/*.cs";
|
||||
@source "../../Moonlight.Client/**/*.html";
|
||||
|
||||
@source "./mappings/*.map";
|
||||
112
Moonlight.Client.Runtime/Styles/styles.css
Normal file
112
Moonlight.Client.Runtime/Styles/styles.css
Normal file
@@ -0,0 +1,112 @@
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=fallback') layer(base);
|
||||
@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap') layer()base;
|
||||
@import url("https://cdn.jsdelivr.net/npm/lucide-static/font/lucide.css") layer(base);
|
||||
|
||||
@import "tailwindcss";
|
||||
@import "./node_modules/flyonui/variants.css";
|
||||
@import "./theme.css";
|
||||
|
||||
@theme {
|
||||
--font-inter: "Inter", var(--font-sans);
|
||||
--font-scp: "Source Code Pro", var(--font-mono);
|
||||
|
||||
--color-background: var(--mooncore-color-background);
|
||||
--color-base-150: var(--mooncore-color-base-150);
|
||||
--color-base-250: var(--mooncore-color-base-250);
|
||||
}
|
||||
|
||||
@plugin "flyonui" {
|
||||
themes: mooncore --default;
|
||||
}
|
||||
|
||||
@source "./node_modules/flyonui/dist/index.js";
|
||||
|
||||
@source "../**/*.razor";
|
||||
@source "../**/*.cs";
|
||||
@source "../**/*.html";
|
||||
|
||||
@source "../../Moonlight.Client/**/*.cs";
|
||||
@source "../../Moonlight.Client/**/*.html";
|
||||
@source "../../Moonlight.Client/**/*.razor";
|
||||
@source "../../Moonlight.Client/Styles/mappings/*.map";
|
||||
|
||||
@source "../../Moonlight.ApiServer/**/*.razor";
|
||||
|
||||
#blazor-error-ui {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#blazor-loader-label:after {
|
||||
content: var(--blazor-load-percentage-text, "Loading");
|
||||
}
|
||||
|
||||
#blazor-loader-progress {
|
||||
width: var(--blazor-load-percentage, 0%);
|
||||
}
|
||||
|
||||
@plugin "flyonui/theme" {
|
||||
name: "mooncore";
|
||||
default: true;
|
||||
prefersdark: true;
|
||||
color-scheme: "dark";
|
||||
--color-base-100: var(--mooncore-color-base-100);
|
||||
--color-base-200: var(--mooncore-color-base-200);
|
||||
--color-base-300: var(--mooncore-color-base-300);
|
||||
--color-base-content: var(--mooncore-color-base-content);
|
||||
--color-primary: var(--mooncore-color-primary);
|
||||
--color-primary-content: var(--mooncore-color-primary-content);
|
||||
--color-secondary: var(--mooncore-color-secondary);
|
||||
--color-secondary-content: var(--mooncore-color-secondary-content);
|
||||
--color-accent: var(--mooncore-color-accent);
|
||||
--color-accent-content: var(--mooncore-color-accent-content);
|
||||
--color-neutral: var(--mooncore-color-neutral);
|
||||
--color-neutral-content: var(--mooncore-color-neutral-content);
|
||||
--color-info: var(--mooncore-color-info);
|
||||
--color-info-content: var(--mooncore-color-info-content);
|
||||
--color-success: var(--mooncore-color-success);
|
||||
--color-success-content: var(--mooncore-color-success-content);
|
||||
--color-warning: var(--mooncore-color-warning);
|
||||
--color-warning-content: var(--mooncore-color-warning-content);
|
||||
--color-error: var(--mooncore-color-error);
|
||||
--color-error-content: var(--mooncore-color-error-content);
|
||||
--radius-selector: var(--mooncore-radius-selector);
|
||||
--radius-field: var(--mooncore-radius-field);
|
||||
--radius-box: var(--mooncore-radius-box);
|
||||
--size-selector: var(--mooncore-size-selector);
|
||||
--size-field: var(--mooncore-size-field);
|
||||
--border: var(--mooncore-border);
|
||||
--depth: var(--mooncore-depth);
|
||||
--noise: var(--mooncore-noise);
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
.btn {
|
||||
@apply text-sm font-medium inline-flex items-center justify-center;
|
||||
}
|
||||
|
||||
.checkbox {
|
||||
@apply border-base-content/30 bg-base-100;
|
||||
}
|
||||
|
||||
.input {
|
||||
@apply !border-base-content/20 border-2 ring-0! outline-0! focus:border-primary! focus-within:border-primary! bg-base-200/50;
|
||||
}
|
||||
|
||||
.advance-select-toggle {
|
||||
@apply !border-base-content/20 border-2 ring-0! outline-0! focus:border-primary! focus-within:border-primary! bg-base-200/50;
|
||||
}
|
||||
|
||||
.table {
|
||||
:where(th, td) {
|
||||
@apply py-1.5;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-item {
|
||||
@apply px-2.5 py-1.5 text-sm;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
@apply bg-base-150;
|
||||
}
|
||||
}
|
||||
33
Moonlight.Client.Runtime/Styles/theme.css
Normal file
33
Moonlight.Client.Runtime/Styles/theme.css
Normal file
@@ -0,0 +1,33 @@
|
||||
@theme {
|
||||
--mooncore-color-background: #0c0f18;
|
||||
--mooncore-color-base-100: #1e2b47;
|
||||
--mooncore-color-base-150: #1a2640;
|
||||
--mooncore-color-base-200: #101a2e;
|
||||
--mooncore-color-base-250: #0f1729;
|
||||
--mooncore-color-base-300: #0c1221;
|
||||
--mooncore-color-base-content: #dde5f5;
|
||||
--mooncore-color-primary: oklch(.511 .262 276.966);
|
||||
--mooncore-color-primary-content: #dde5f5;
|
||||
--mooncore-color-secondary: oklch(37% 0.034 259.733);
|
||||
--mooncore-color-secondary-content: #dde5f5;
|
||||
--mooncore-color-accent: oklch(.627 .265 303.9);
|
||||
--mooncore-color-accent-content: #dde5f5;
|
||||
--mooncore-color-neutral: #dde5f5;
|
||||
--mooncore-color-neutral-content: oklch(14% 0.005 285.823);
|
||||
--mooncore-color-info: oklch(.546 .245 262.881);
|
||||
--mooncore-color-info-content: #dde5f5;
|
||||
--mooncore-color-success: oklch(.627 .194 149.214);
|
||||
--mooncore-color-success-content: #dde5f5;
|
||||
--mooncore-color-warning: oklch(.828 .189 84.429);
|
||||
--mooncore-color-warning-content: #dde5f5;
|
||||
--mooncore-color-error: oklch(.586 .253 17.585);
|
||||
--mooncore-color-error-content: #dde5f5;
|
||||
--mooncore-radius-selector: 0.25rem;
|
||||
--mooncore-radius-field: 0.5rem;
|
||||
--mooncore-radius-box: 0.5rem;
|
||||
--mooncore-size-selector: 0.25rem;
|
||||
--mooncore-size-field: 0.25rem;
|
||||
--mooncore-border: 1px;
|
||||
--mooncore-depth: 0;
|
||||
--mooncore-noise: 0;
|
||||
}
|
||||
Reference in New Issue
Block a user