Skip to content

Instantly share code, notes, and snippets.

View sulco's full-sized avatar
💭
compiling or woodworking

Tomek Sułkowski sulco

💭
compiling or woodworking
View GitHub Profile
@sulco
sulco / hidden-actions.css
Created December 13, 2023 14:54
hide vscode action icons – only show them on hover
.title-actions,
.global-actions,
.editor-actions {
opacity: 0 !important;
transition: opacity 0.2s;
}
.title-actions:hover,
.editor-actions:hover {
opacity: 1 !important;
@sulco
sulco / example.js
Created February 1, 2022 20:47
StackBlitz Guide: Example of `files` payload
{
files: {
src: {
name: 'src',
type: 'folder',
contents: '',
fullPath: 'src',
lastModified: 1525387210297
},
'src/app': {
@sulco
sulco / clown-formatter.js
Created December 10, 2018 19:11
A clown formatter
window.devtoolsFormatters = [{
header: function(obj){
if (!obj.__clown) {
return null;
}
delete obj.__clown;
const style = `
color: red;
border: dotted 2px gray;
border-radius: 4px;
@sulco
sulco / theme.directive.ts
Created November 4, 2018 16:12
Angular theme directive
import { Directive, ElementRef, Input, OnChanges } from '@angular/core';
/**
* Usage:
* <mycomponent [dtTheme]="{'color-main': '#bada55'}"></mycomponent>
*/
@Directive({
selector: '[dtTheme]'
})
export class ThemeDirective implements OnChanges {
@sulco
sulco / index.ts
Created April 30, 2018 21:04
Bootstrapping Angular module, with custom-elements shim
import 'zone.js/dist/zone';
import '@webcomponents/custom-elements/src/native-shim';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { ButtonModule } from './button.module';
platformBrowserDynamic().bootstrapModule(ButtonModule);
@sulco
sulco / button.module.ts
Created April 30, 2018 20:57
Sample module that defines an Angular custom element
import { NgModule, Injector } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { createCustomElement } from '@angular/elements';
import { ButtonComponent } from './button.component';
@NgModule({
imports: [BrowserModule],
declarations: [ButtonComponent],
entryComponents: [ButtonComponent]
})
@sulco
sulco / one-file-component-native-encapsulation.ts
Created April 30, 2018 20:44
Simple one-file Angular component with `ViewEncapsulation.Native`
import { Input, Component, ViewEncapsulation, EventEmitter, Output } from '@angular/core';
@Component({
selector: 'custom-button',
template: `<button (click)="handleClick()">{{label}}</button>`,
styles: [`
button {
border: solid 3px;
padding: 8px 10px;
background: #bada55;
@sulco
sulco / if-role.directive.ts
Last active November 28, 2017 20:57
tsIfRole structural directive
import { Directive, Input, OnInit, TemplateRef, ViewContainerRef } from '@angular/core';
import { UserService } from './user.service';
import { UserRole } from '../shared/models/user-role';
@Directive({
selector: '[tsIfRole]'
})
export class IfRoleDirective implements OnInit {
role: UserRole;
@sulco
sulco / .bashrc
Last active December 17, 2016 17:21
ngapp() {
ng new $1 --style=sass --skip-npm && cd $1 && yarn \
&& open http://localhost:4200 \
&& code . \
&& yarn start
}