Update Wwws_project
166
Wwws_project.md
166
Wwws_project.md
@@ -56,8 +56,6 @@ $ tribe=adminapi webapp=admin yarn dist:jscss
|
|||||||
|
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Then the webapp can get context data with the endpoint http://appname.tribename.townname.nationname/api/adminapi/wwws/updatelocaldbanonymous/tribename/appname/pagename/versionnumber this will return in data a set of data parameter into tribename/objects/wwws/itm/appname.json
|
Then the webapp can get context data with the endpoint http://appname.tribename.townname.nationname/api/adminapi/wwws/updatelocaldbanonymous/tribename/appname/pagename/versionnumber this will return in data a set of data parameter into tribename/objects/wwws/itm/appname.json
|
||||||
|
|
||||||
|
|
||||||
@@ -225,105 +223,85 @@ This will generate /src/static/css/twstyle.css
|
|||||||
$ tribe=tribename webapp=appname yarn src:css
|
$ tribe=tribename webapp=appname yarn src:css
|
||||||
```
|
```
|
||||||
|
|
||||||
To customize webpage and wco, all is set into tailwindcss.config.js. The file tribename/objects/wwws/itm/webappname.json contain a property tailwindcsscontent updated with the list of wco to watch for tailwindcss.
|
The tailwindcss conf is store in /wwws/appname/src/static/css/input.css
|
||||||
|
|
||||||
|
|
||||||
```
|
```
|
||||||
** @type {import('tailwindcss').Config} */
|
/*
|
||||||
const colors = require('tailwindcss/colors');
|
//start with if need a google font
|
||||||
const confwww= require('../itm/webappname.json');
|
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
|
||||||
// content: ["../adminapi/objects/wwws/admin/src/**/*.{html,js,mustache}","../adminapi/objects/wco/apxid/*.{html,js,mustache}"],
|
*/
|
||||||
|
@font-face{
|
||||||
module.exports = {
|
font-family: 'Questrial';
|
||||||
content: confwww.tailwindcsscontent,
|
/*font-style: normal;
|
||||||
theme: {
|
font-weight: 400;*/
|
||||||
fontFamily: {
|
font-display: swap;
|
||||||
sans: ["questrial", "sans-serif"],
|
src: url(../fonts/questrial-regular-webfont.woff2) format('woff2');
|
||||||
serif: ["quicksand", "serif"],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
plugins: [require("@tailwindcss/typography"), require("daisyui")],
|
|
||||||
daisyui: {
|
|
||||||
themes: ["dark", "light", "apxtri"], // false: only light + dark | true: all themes | array: specific themes like this ["light", "dark", "cupcake"]
|
|
||||||
darkTheme: "dark", // name of one of the included themes for dark mode
|
|
||||||
base: true, // applies background color and foreground color for root element by default
|
|
||||||
styled: true, // include daisyUI colors and design decisions for all components
|
|
||||||
utils: true, // adds responsive and modifier utility classes
|
|
||||||
prefix: "", // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors)
|
|
||||||
logs: true, // Shows info about daisyUI version and used config in the console when building your CSS
|
|
||||||
themeRoot: ":root", // The element that receives theme color CSS variables
|
|
||||||
themes: [
|
|
||||||
{
|
|
||||||
//check https://daisyui.com/theme-generator/ to customize
|
|
||||||
apxtri: {
|
|
||||||
primary: "#2e7fc8",
|
|
||||||
"primary-focus": "#218787",
|
|
||||||
"primary-content": "#ffffff",
|
|
||||||
secondary: "#ffc332",
|
|
||||||
"secondary-focus": "#fa6a31",
|
|
||||||
"secondary-content": "#ffffff",
|
|
||||||
accent: "#6aa84f",
|
|
||||||
"accent-focus": "#218787",
|
|
||||||
"accent-content": "#ffffff",
|
|
||||||
neutral: colors.gray[800],
|
|
||||||
"neutral-focus": colors.gray[600],
|
|
||||||
"neutral-content": "#ffffff",
|
|
||||||
"base-100": "#ffffff", // Fond principal
|
|
||||||
"base-200": "#f9fafb", // Fond secondaire
|
|
||||||
"base-300": "#d1d5db", // Fond tertiaire
|
|
||||||
"base-content": "#1f2937", // Texte principal
|
|
||||||
info: "#2e7fc8",
|
|
||||||
success: "#6aa84f",
|
|
||||||
warning: "#ffc332",
|
|
||||||
error: "#fa6a31",
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
```
|
|
||||||
|
|
||||||
The dev tailwindcss is store in /wwws/appname/src/static/css/twdevstyle.css
|
|
||||||
|
|
||||||
```
|
|
||||||
@tailwind base;
|
|
||||||
@tailwind components;
|
|
||||||
@tailwind utilities;
|
|
||||||
@import 'daisyui';
|
|
||||||
|
|
||||||
@Layer base {
|
|
||||||
@font-face{
|
|
||||||
font-family: 'questrial';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
font-display: swap;
|
|
||||||
src: url(../fonts/questrial-regular-webfont.woff2) format('woff2');
|
|
||||||
}
|
|
||||||
font-family:"questrial", system-ui, sans-serif;
|
|
||||||
@font-face{
|
|
||||||
font-family:'quicksand';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: 400;
|
|
||||||
font-display: swap;
|
|
||||||
src: url(../fonts/Quicksand-Light.woff2) format('woff2');
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
::-webkit-scrollbar {
|
@font-face{
|
||||||
width: 8px;
|
font-family:'Quicksand';
|
||||||
}
|
/*font-style: normal;
|
||||||
::-webkit-scrollbar-track {
|
font-weight: 400;*/
|
||||||
background: #2d3748;
|
font-display: swap;
|
||||||
}
|
src: url(../fonts/Quicksand-Light.ttf) format('ttf');
|
||||||
::-webkit-scrollbar-thumb {
|
}
|
||||||
background: #4a5568;
|
@import "tailwindcss" source("../../../src/**/*.{html,js,mustache}");
|
||||||
border-radius: 4px;
|
@import "./sourcetw.css";
|
||||||
|
|
||||||
|
@plugin "daisyui";
|
||||||
|
|
||||||
|
@theme {
|
||||||
|
--font-display: "Questrial", "sans-serif";
|
||||||
|
--font-display--font-feature-settings: "cv02", "cv03", "cv04", "cv11";
|
||||||
|
--font-display--font-variation-settings: "opsz" 32;
|
||||||
|
--font-heading:"Quicksand","system-ui";
|
||||||
|
--font-body:"Questrial";
|
||||||
|
}
|
||||||
|
@layer base {
|
||||||
|
html {
|
||||||
|
font-family: var(--font-body);
|
||||||
|
font-weight: 300; /* Si nécessaire */
|
||||||
}
|
}
|
||||||
|
|
||||||
.transition-width {
|
h1, h2, h3, h4, h5, h6 {
|
||||||
transition: width 0.3s ease;
|
font-family: var(--font-heading);
|
||||||
|
font-weight: 500; /* Ajuster selon besoin */
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@plugin "daisyui/theme" {
|
||||||
|
name: "apxtridark";
|
||||||
|
default: true;
|
||||||
|
prefersdark: true;
|
||||||
|
color-scheme: "dark";
|
||||||
|
--color-base-100: oklch(37% 0.044 257.287);
|
||||||
|
--color-base-200: oklch(20% 0.042 265.755);
|
||||||
|
--color-base-300: oklch(12% 0.042 264.695);
|
||||||
|
--color-base-content: oklch(100% 0 0);
|
||||||
|
--color-primary: oklch(58.34% 0.136 249.54);
|
||||||
|
--color-primary-content: oklch(98% 0.019 200.873);
|
||||||
|
--color-secondary: oklch(84.93% 0.162 84.01);
|
||||||
|
--color-secondary-content: oklch(0% 0 0);
|
||||||
|
--color-accent: oklch(66.88% 0.138 137.06);
|
||||||
|
--color-accent-content: oklch(98% 0.002 247.839);
|
||||||
|
--color-neutral: oklch(27% 0.041 260.031);
|
||||||
|
--color-neutral-content: oklch(100% 0 0);
|
||||||
|
--color-info: oklch(82% 0.111 230.318);
|
||||||
|
--color-info-content: oklch(30% 0.056 229.695);
|
||||||
|
--color-success: oklch(66.88% 0.138 137.06);
|
||||||
|
--color-success-content: oklch(26% 0.051 172.552);
|
||||||
|
--color-warning: oklch(84.93% 0.162 84.01);
|
||||||
|
--color-warning-content: oklch(27% 0.077 45.635);
|
||||||
|
--color-error: oklch(69.54% 0.189 40.23);
|
||||||
|
--color-error-content: oklch(27% 0.105 12.094);
|
||||||
|
--radius-selector: 0.5rem;
|
||||||
|
--radius-field: 0.5rem;
|
||||||
|
--radius-box: 0.5rem;
|
||||||
|
--size-selector: 0.25rem;
|
||||||
|
--size-field: 0.25rem;
|
||||||
|
--border: 1px;
|
||||||
|
--depth: 1;
|
||||||
|
--noise: 0;
|
||||||
|
}
|
||||||
```
|
```
|
||||||
## Build
|
## Build
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user