Skip to content

Instantly share code, notes, and snippets.

View yokoishioka's full-sized avatar

yoko ishioka yokoishioka

1 follower · 0 following
View GitHub Profile
@yokoishioka
yokoishioka / footer.component.html
Last active April 2, 2021 13:57
Social Media component in Angular
@yokoishioka
yokoishioka / footer.component.html
Created February 6, 2020 01:14
footer for social media component
@yokoishioka
yokoishioka / social-media.component.html
Created February 6, 2020 01:17
social media component
<div class="social-media" [ngClass]="{'vertical':vertical}">
<div *ngIf="facebook" class="social-media-icon">
<a [href]="facebookLink + facebook.link" target="_blank" rel="noopener" title="view {{ facebook.user }} on facebook"><ces-svg-facebook></ces-svg-facebook></a>
</div>
<div *ngIf="twitter" class="social-media-icon">
<a [href]="twitterLink + twitter.link" target="_blank" rel="noopener" title="view {{ twitter.user }} on twitter"><ces-svg-twitter></ces-svg-twitter></a>
</div>
<div *ngIf="linkedIn" class="social-media-icon">
<a *ngIf="linkedIn.company; else altLinkedIn" [href]="linkedInLinkCompany + linkedIn.link" target="_blank" rel="noopener" title="view {{ linkedIn.user }} on twitter"><ces-svg-linkedin></ces-svg-linkedin></a>
<ng-template #altLinkedIn>
@yokoishioka
yokoishioka / social-media.component.ts
Last active February 6, 2020 01:20
social media component
import { Component, Input } from '@angular/core';
import { SocialMedia } from './social-media';
@Component({
selector: 'ces-social-media',
templateUrl: './social-media.component.html',
styleUrls: ['./social-media.component.scss']
})
export class SocialMediaComponent {
@Input() facebook:SocialMedia;
@yokoishioka
yokoishioka / button.component.html
Created February 25, 2020 02:46
<button [ngClass]="class" [disabled]="disabled">
<ng-content></ng-content>
<ces-svg *ngIf="icon" [type]="icon"></ces-svg>
<span *ngIf="label">{{ label }}</span>
</button>
@yokoishioka
yokoishioka / button-hide-parent.ts
Last active March 4, 2020 06:49
button that hides any parent
import { Component, Input, Renderer2, ElementRef, Output, EventEmitter } from '@angular/core';
@Component({
selector: 'ces-button-hide-parent',
templateUrl: './button-hide-parent.component.html',
styleUrls: ['./button-hide-parent.component.scss']
})
export class ButtonHideParentComponent {
@Input() showIcon: boolean;
@Input() label:string;
@yokoishioka
yokoishioka / button-hide-parent.component.html
Last active March 4, 2020 06:48
<ces-button type="button" class="no-border no-padding" (click)="onClose()">
<span *ngIf="label" class="label">{{ label }}</span>
<img *ngIf="showIcon" src="/assets/svgs/button-close.png" alt="button that hides its parent">
<ng-content></ng-content>
</ces-button>
@yokoishioka
yokoishioka / button.component.ts
Created March 4, 2020 06:41
import { Component, Input } from '@angular/core';
@Component({
selector: 'ces-button',
templateUrl: './button.component.html',
styleUrls: [
'./button.component.scss'
]
})
@yokoishioka
yokoishioka / button.component.scss
Created March 4, 2020 07:32
@import "src/assets/styles/variables.scss";
button {
font-size: inherit;
background: inherit;
color: inherit;
text-align: center;
padding: 0.5em 1.0em;
border: 1px solid;
border-radius: $border-radius;
@yokoishioka
yokoishioka / svg-astronaut.component.ts
Created March 10, 2020 05:53
import { Component } from '@angular/core';
@Component({
selector: 'ces-svg-astronaut',
templateUrl: '../../../../../../src/assets/images/svgs/astronaut.svg',
styleUrls: ['../../svg.component.scss']
})
export class SvgAstronautComponent {
constructor() { }