Skip to content

Instantly share code, notes, and snippets.

View MurhafSousli's full-sized avatar

Murhaf Sousli MurhafSousli

View GitHub Profile
@MurhafSousli
MurhafSousli / safe.pipe.ts
Created September 29, 2018 16:04
Safe sanitizer for Angular
import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer, SafeHtml, SafeStyle, SafeScript, SafeUrl, SafeResourceUrl } from '@angular/platform-browser';
@Pipe({
name: 'safe'
})
export class SafePipe implements PipeTransform {
constructor(protected sanitizer: DomSanitizer) {}
@MurhafSousli
MurhafSousli / index.html
Created March 25, 2019 11:32
kasim-murhaf
<!DOCTYPE html>
<html>
<head>
<title>Reputation Ranking</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css" />
<link rel="stylesheet" href="style.css">
</head>
@MurhafSousli
MurhafSousli / index.html
Created March 29, 2019 08:00
Practice on JS
<!DOCTYPE html>
<html>
<head>
<title>Javascript TODO list</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="header">
function add(a, b) {
return parseInt(a) + parseInt(b);
}
if (!process.argv[2] || !process.argv[3]) {
console.log('Insufficient number of arguments! Give two numbers please!');
}
else {
console.log('The sum of', process.argv[2], 'and', process.argv[3],
'is', add(process.argv[2], process.argv[3]));
}
/**
* - Add a button that fetches data from WordPress API when clicked, "Fetch posts"
* - Get WordPress posts using the fetch API
* - Display loading icon before calling fetch
* - Display the posts in a list (display title) once the response is loaded and remove the loading icon
*/
/**
* Hints:
*
@MurhafSousli
MurhafSousli / hide-native-scrollbars.scss
Created July 9, 2019 22:16
Hide native scrollbars on all desktop browsers
.hide-native-scrollbar {
scrollbar-width: none; /* Firefox 64 */
-ms-overflow-style: none; /* IE 11 */
&::-webkit-scrollbar { /** Webkit */
display: none;
}
}
@MurhafSousli
MurhafSousli / ng-scrollbar.html
Created October 31, 2019 14:56
Test ng-scrollbar auto-height with root DOM
Remove `ngStyle` from `.ng-scrollbar-wrapper` in the template
<div class="ng-scrollbar-wrapper" [ngAttr]="state" [ngStyle]="autoHeightStyles">
To
<div class="ng-scrollbar-wrapper" [ngAttr]="state">
@MurhafSousli
MurhafSousli / gist-file.ts
Last active January 4, 2025 01:43
ngx-highlightjs code examples
import { HighlightPlusModule } from 'ngx-highlightjs';
@Component({
selector: 'app-root',
template: `
<pre [gist]="gistId" (gistLoaded)="gist = $event">
<code [highlight]="gist | gistContent: 'main.js'"></code>
</pre>
`,
imports: [HighlightPlusModule]
npm install ngx-highlightjs
import { Injectable, PLATFORM_ID } from '@angular/core';
import { DOCUMENT, isPlatformBrowser } from '@angular/common';
import { BehaviorSubject, Observable, from, EMPTY } from 'rxjs';
import { catchError, tap, map, filter, take } from 'rxjs/operators';
import { ExternalLibrary, ExternalLibraryOptions, EXTERNAL_LIBRARY_OPTIONS } from './models';
// @dynamic
@Injectable({
providedIn: 'root'