Skip to content

Instantly share code, notes, and snippets.

Avatar
🍰
Where is the cake?

Tomas Trajan tomastrajan

🍰
Where is the cake?
View GitHub Profile
@tomastrajan
tomastrajan / element.ts
Last active Jul 25, 2019
Angular elements change detection problem
View element.ts
/*
This is then built as Angualr element
with
ngDoBootstrap() {
const ElementExample = createCustomElement(ElementExampleComponent, { injector: this.injector });
customElements.define('element-example', ElementExample);
}
@tomastrajan
tomastrajan / change-mac.sh
Created May 20, 2019
BASH CHANGE MAC by Minko
View change-mac.sh
function changeMac() {
local mac=$(openssl rand -hex 6 | sed 's/\(..\)/\1:/g; s/.$//')
sudo ifconfig en0 ether $mac
sudo ifconfig en0 down
sudo ifconfig en0 up
echo "Your new physical address is $mac"
}
@tomastrajan
tomastrajan / some-lib.js
Created May 10, 2019
Angular Library Build Output
View some-lib.js
import { Injectable, Component, NgModule, defineInjectable } from '@angular/core';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var SomeLibService = /** @class */ (function () {
function SomeLibService() {
}
SomeLibService.decorators = [
@tomastrajan
tomastrajan / app.component.ts
Last active Feb 1, 2021
Angular Material Theming - overlay handling
View app.component.ts
import { OverlayContainer } from '@angular/cdk/overlay';
export class AppComponent implements OnInit {
// use this to set correct theme class on app holder
// eg: <div [class]="themeClass">...</div>
themeClass: string;
constructor(
private overlayContainer: OverlayContainer
@tomastrajan
tomastrajan / big-input-component.scss-theme.scss
Last active Nov 29, 2018
Angular Material Theming - custom component theme
View big-input-component.scss-theme.scss
@import '~@angular/material/theming';
// mixin name will be used in main style.scss
@mixin big-input-component-theme($theme) {
// retrieve variables from theme
// (all possible variables, use only what you really need)
$primary: map-get($theme, primary);
$accent: map-get($theme, accent);
$warn: map-get($theme, accent);
@tomastrajan
tomastrajan / style.scss
Last active May 31, 2017
Angular Material Theming - custom components
View style.scss
@import '~@angular/material/theming';
@include mat-core();
@import 'my-theme.scss';
// import custom componenet themes
// unofficial naming convention to support nice ordering of files in IDE
// to see theme under the original style file of the componenent
@import 'app/shared/big-input/big-input.component.scss-theme';
@tomastrajan
tomastrajan / style.scss
Last active Feb 1, 2021
Angular Material Theming - multiple themes
View style.scss
@import '~@angular/material/theming';
// always include only once per project
@include mat-core();
// import our custom themes
@import 'my-theme.scss';
@import 'my-light-theme.scss';
@import 'my-dark-theme.scss';
@tomastrajan
tomastrajan / style.scss
Created May 31, 2017
Angular Material Theming - include theme
View style.scss
@import '~@angular/material/theming';
// always include only once per project
@include mat-core();
// import our custom theme
@import 'my-theme.scss';
// specify theme class eg: <body class="my-theme"> ... </body>
.my-theme {
@tomastrajan
tomastrajan / theme.scss
Last active Sep 16, 2019
Angular Material Theming - theme
View theme.scss
// define 3 theme color
// mat-palette accepts $palette-name, main, lighter and darker variants
$my-theme-primary: mat-palette($mat-indigo, 700, 300, 900);
$my-theme-accent: mat-palette($mat-light-blue);
$my-theme-warn: mat-palette($mat-deep-orange, A200);
// create theme (use mat-dark-theme for themes with dark backgrounds)
$my-theme: mat-light-theme(
$my-theme-primary,
$my-theme-accent,
View cancelable.decorator.ts
export function cancelable() : MethodDecorator {
return function ( target : any, propertyKey : string, descriptor : PropertyDescriptor ) {
const originalFn = descriptor.value;
const subject = new BehaviorSubject(undefined);
const result$ = subject.asObservable().switchMap(args => originalFn(...args));
descriptor.value = (...args) => {
subject.next(args);