sandkasten
/
sandkasten-web
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Avancée composant header

Browse Source
wip-monaco
Hugo Pradier 2 years ago
parent e52bd70f11
commit 781568ccdf
9 changed files with 49 additions and 17 deletions
Show Stats Download Patch File Download Diff File

1
.gitignore → sandkasten/.gitignore vendored
Unescape View File

@ -28,6 +28,7 @@ yarn-error.log
!.vscode/extensions.json !.vscode/extensions.json
.history/* .history/*
# Miscellaneous # Miscellaneous
/.angular/cache /.angular/cache
.sass-cache/ .sass-cache/

9
sandkasten/src/app/code-input/code-input.component.html
Unescape View File

@ -1,3 +1,10 @@
<div class="code_input"> <div class="code_input">
<textarea class="code_input_textarea" id="code_input" name="code_input" placeholder="Enter your code here..."></textarea> <textarea
class="code_input_textarea"
id="code_input"
name="code_input"
placeholder="Enter your code here..."
></textarea>
<button (click)="onRunButtonClicked()">Run</button>
<p>{{ reponse }}</p>
</div> </div>

6
sandkasten/src/app/code-input/code-input.component.ts
Unescape View File

@ -6,5 +6,9 @@ import { Component } from '@angular/core';
styleUrls: ['./code-input.component.css'] styleUrls: ['./code-input.component.css']
}) })
export class CodeInputComponent { export class CodeInputComponent {
reponse!: string;
onRunButtonClicked() {
this.reponse = 'Run button clicked';
console.log('Run button clicked');
}
} }

7
sandkasten/src/app/header/header.component.css
Unescape View File

@ -0,0 +1,7 @@
.header-card {
width: 35%;
img {
width: 10%;
}
}

7
sandkasten/src/app/header/header.component.html
Unescape View File

@ -1 +1,6 @@
<p>header works!</p> <div class="header-card">
<h2>{{ title }}</h2>
<p>{{ description }}</p>
<p>Version : {{ version }}</p>
<img [src]="imgSrc" alt="imgSrc" />
</div>

4
sandkasten/src/app/header/header.component.ts
Unescape View File

@ -9,13 +9,13 @@ export class HeaderComponent implements OnInit {
title!: string; title!: string;
description!: string; description!: string;
version!: number; version!: number;
logo!: string; imgSrc!: string;
ngOnInit(): void { ngOnInit(): void {
this.title = 'Sandkasten'; this.title = 'Sandkasten';
this.description = 'Ein Angular-Sandkasten'; this.description = 'Ein Angular-Sandkasten';
this.version = 1.0; this.version = 1.0;
this.logo = 'logo.svg'; this.imgSrc = 'assets/img/logo.png';
} }
} }

BIN
sandkasten/src/assets/img/logo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 24 KiB

16
sandkasten/src/index.html
Unescape View File

@ -1,11 +1,17 @@
<!doctype html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8" />
<title>Sandkasten</title> <title>Sandkasten</title>
<base href="/"> <base href="/" />
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="icon" type="image/x-icon" href="favicon.ico"> <link rel="icon" type="image/x-icon" href="assets/img/logo.png" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap"
rel="stylesheet"
/>
</head> </head>
<body> <body>
<app-root></app-root> <app-root></app-root>

4
sandkasten/src/styles.css
Unescape View File

@ -1 +1,3 @@
/* You can add global styles to this file, and also import other style files */ * {
font-family: Roboto, Helvetica, sans-serif;
}
Write Preview
Loading…
Cancel
Save