Skip to content
Snippets Groups Projects
Commit 87cd9740 authored by OZGCloud's avatar OZGCloud
Browse files

OZG-4897 add demoapp, alfa add tailwind

parent b8b41683
No related branches found
No related tags found
No related merge requests found
Showing
with 377 additions and 1 deletion
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
<ozgcloud-spinner [stateResource]="apiRoot"> <ozgcloud-spinner [stateResource]="apiRoot">
<alfa-header-container [apiRootStateResource]="apiRoot"></alfa-header-container> <alfa-header-container [apiRootStateResource]="apiRoot"></alfa-header-container>
<div class="container"> <div class="relative ml-4 mt-16 flex flex-grow items-start justify-between">
<main class="mat-app-background"><router-outlet></router-outlet></main> <main class="mat-app-background"><router-outlet></router-outlet></main>
<section class="mat-app-background right-nav"> <section class="mat-app-background right-nav">
......
...@@ -22,6 +22,11 @@ ...@@ -22,6 +22,11 @@
* unter der Lizenz sind dem Lizenztext zu entnehmen. * unter der Lizenz sind dem Lizenztext zu entnehmen.
*/ */
@use '@angular/material' as mat; @use '@angular/material' as mat;
@tailwind base;
@tailwind components;
@tailwind utilities;
@import 'libs/ui/src/lib/font/font_material'; @import 'libs/ui/src/lib/font/font_material';
@import 'typeface-roboto/index.css'; @import 'typeface-roboto/index.css';
......
const { createGlobPatternsForDependencies } = require('@nx/angular/tailwind');
const { join } = require('path');
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html}'),
...createGlobPatternsForDependencies(__dirname),
],
corePlugins: {
preflight: false,
},
//prefix: 'tw-',
theme: {
extend: {},
},
plugins: [],
};
{
"extends": ["plugin:cypress/recommended", "../../.eslintrc.json"],
"ignorePatterns": ["!**/*"],
"overrides": [
{
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
"rules": {}
},
{
"files": ["*.ts", "*.tsx"],
"rules": {}
},
{
"files": ["*.js", "*.jsx"],
"rules": {}
},
{
"files": ["*.cy.{ts,js,tsx,jsx}", "src/**/*.{ts,js,tsx,jsx}"],
"rules": {}
}
]
}
import { nxE2EPreset } from '@nx/cypress/plugins/cypress-preset';
import { defineConfig } from 'cypress';
export default defineConfig({
e2e: nxE2EPreset(__filename, { cypressDir: 'src' }),
});
{
"name": "demo-e2e",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "application",
"sourceRoot": "apps/demo-e2e/src",
"targets": {
"e2e": {
"executor": "@nx/cypress:cypress",
"options": {
"cypressConfig": "apps/demo-e2e/cypress.config.ts",
"testingType": "e2e",
"devServerTarget": "demo:serve:development"
},
"configurations": {
"production": {
"devServerTarget": "demo:serve:production"
},
"ci": {
"devServerTarget": "demo:serve-static"
}
}
},
"lint": {
"executor": "@nx/eslint:lint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": ["apps/demo-e2e/**/*.{js,ts}"]
}
}
},
"tags": [],
"implicitDependencies": ["demo"]
}
import { getGreeting } from '../support/app.po';
describe('demo-e2e', () => {
beforeEach(() => cy.visit('/'));
it('should display welcome message', () => {
// Custom command example, see `../support/commands.ts` file
cy.login('my-email@something.com', 'myPassword');
// Function helper example, see `../support/app.po.ts` file
getGreeting().contains(/Welcome/);
});
});
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
export const getGreeting = () => cy.get('h1');
/// <reference types="cypress" />
// ***********************************************
// This example commands.ts shows you how to
// create various custom commands and overwrite
// existing commands.
//
// For more comprehensive examples of custom
// commands please read more here:
// https://on.cypress.io/custom-commands
// ***********************************************
// eslint-disable-next-line @typescript-eslint/no-namespace
declare namespace Cypress {
// eslint-disable-next-line @typescript-eslint/no-unused-vars
interface Chainable<Subject> {
login(email: string, password: string): void;
}
}
// -- This is a parent command --
Cypress.Commands.add('login', (email, password) => {
console.log('Custom command example: Login', email, password);
});
//
// -- This is a child command --
// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... })
//
//
// -- This is a dual command --
// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... })
//
//
// -- This will overwrite an existing command --
// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
// ***********************************************************
// This example support/e2e.ts is processed and
// loaded automatically before your test files.
//
// This is a great place to put global configuration and
// behavior that modifies Cypress.
//
// You can change the location of this file or turn off
// automatically serving support files with the
// 'supportFile' configuration option.
//
// You can read more here:
// https://on.cypress.io/configuration
// ***********************************************************
// Import commands.ts using ES2015 syntax:
import './commands';
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"allowJs": true,
"outDir": "../../dist/out-tsc",
"module": "commonjs",
"types": ["cypress", "node"],
"sourceMap": false,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true
},
"include": ["**/*.ts", "**/*.js", "cypress.config.ts", "**/*.cy.ts", "**/*.cy.js", "**/*.d.ts"]
}
{
"extends": ["../../.eslintrc.json"],
"ignorePatterns": ["!**/*"],
"overrides": [
{
"files": ["*.ts"],
"extends": ["plugin:@nx/angular", "plugin:@angular-eslint/template/process-inline-templates"],
"rules": {
"@angular-eslint/directive-selector": [
"error",
{
"type": "attribute",
"prefix": "app",
"style": "camelCase"
}
],
"@angular-eslint/component-selector": [
"error",
{
"type": "element",
"prefix": "app",
"style": "kebab-case"
}
]
}
},
{
"files": ["*.html"],
"extends": ["plugin:@nx/angular-template"],
"rules": {}
}
]
}
/* eslint-disable */
export default {
displayName: 'demo',
preset: '../../jest.preset.js',
setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
coverageDirectory: '../../coverage/apps/demo',
transform: {
'^.+\\.(ts|mjs|js|html)$': [
'jest-preset-angular',
{
tsconfig: '<rootDir>/tsconfig.spec.json',
stringifyContentPathRegex: '\\.(html|svg)$',
},
],
},
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
snapshotSerializers: [
'jest-preset-angular/build/serializers/no-ng-attributes',
'jest-preset-angular/build/serializers/ng-snapshot',
'jest-preset-angular/build/serializers/html-comment',
],
};
{
"name": "demo",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "application",
"prefix": "app",
"sourceRoot": "apps/demo/src",
"tags": [],
"targets": {
"build": {
"executor": "@angular-devkit/build-angular:browser",
"outputs": ["{options.outputPath}"],
"options": {
"outputPath": "dist/apps/demo",
"index": "apps/demo/src/index.html",
"main": "apps/demo/src/main.ts",
"polyfills": ["zone.js"],
"tsConfig": "apps/demo/tsconfig.app.json",
"assets": ["apps/demo/src/favicon.ico", "apps/demo/src/assets"],
"styles": ["apps/demo/src/styles.scss"],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"outputHashing": "all"
},
"development": {
"buildOptimizer": false,
"optimization": false,
"vendorChunk": true,
"extractLicenses": false,
"sourceMap": true,
"namedChunks": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"executor": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"browserTarget": "demo:build:production"
},
"development": {
"browserTarget": "demo:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"executor": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "demo:build"
}
},
"lint": {
"executor": "@nx/eslint:lint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": ["apps/demo/**/*.ts", "apps/demo/**/*.html"]
}
},
"test": {
"executor": "@nx/jest:jest",
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
"options": {
"jestConfig": "apps/demo/jest.config.ts",
"passWithNoTests": true
},
"configurations": {
"ci": {
"ci": true,
"codeCoverage": true
}
}
},
"serve-static": {
"executor": "@nx/web:file-server",
"options": {
"buildTarget": "demo:build"
}
}
}
}
<ng-container>
<header class="flex items-center justify-between bg-white p-6">
<div class="text-ozgblue font-extrabold">OZG-Cloud Demoapp</div>
</header>
<div class="relative flex w-full flex-auto justify-center">
<div class="w-96 bg-slate-300 p-6">
<nav>NAV</nav>
</div>
<main class="flex-auto bg-slate-200 p-6">
<ozg-testbtn />
<router-outlet></router-outlet>
</main>
</div>
</ng-container>
import { TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';
import { RouterTestingModule } from '@angular/router/testing';
describe('AppComponent', () => {
beforeEach(async () => {
await TestBed.configureTestingModule({
imports: [AppComponent, RouterTestingModule],
}).compileComponents();
});
it(`should have as title 'demo'`, () => {
const fixture = TestBed.createComponent(AppComponent);
const app = fixture.componentInstance;
expect(app.title).toEqual('demo');
});
});
import { Component } from '@angular/core';
import { RouterModule } from '@angular/router';
import { TestbtnComponent } from 'design-system';
@Component({
standalone: true,
imports: [TestbtnComponent, RouterModule],
selector: 'app-root',
templateUrl: './app.component.html',
})
export class AppComponent {
title = 'demo';
}
import { ApplicationConfig } from '@angular/core';
import { provideRouter, withEnabledBlockingInitialNavigation } from '@angular/router';
import { appRoutes } from './app.routes';
export const appConfig: ApplicationConfig = {
providers: [provideRouter(appRoutes, withEnabledBlockingInitialNavigation())],
};
import { Route } from '@angular/router';
export const appRoutes: Route[] = [];
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment