Skip to content

Instantly share code, notes, and snippets.

@faustobdls
Created August 31, 2018 14:54
Show Gist options
  • Save faustobdls/a545c24a96f633939b4c26c2a4dd32e0 to your computer and use it in GitHub Desktop.
Save faustobdls/a545c24a96f633939b4c26c2a4dd32e0 to your computer and use it in GitHub Desktop.
display user in menu
<ion-header>
<ion-toolbar color="primary" class="header">
<ion-thumbnail class="picture"><img src="https://lh5.googleusercontent.com/-N8HUIRLHmcE/AAAAAAAAAAI/AAAAAAAAAnQ/TTC_nt5UYvw/photo.jpg"></ion-thumbnail>
<ion-title>Fausto Blanco</ion-title>
<ion-label>fausto.level@gmail.com</ion-label>
<ion-button color="secondary" routerLink="/profile">
Editar Perfil
<ion-icon slot="end" name="create"></ion-icon>
</ion-button>
</ion-toolbar>
</ion-header>
$nav-width: 250px;
ion-header{
& ion-toolbar{
& .picture{
margin: 10px auto;
width: (.4 * $nav-width);
height: (.4 * $nav-width);
border-radius: 100px;
overflow: hidden;
background-color:transparent;
& ion-thumbnail{
width: 100%;
height: 100%;
}
}
& ion-title{
text-align: center;
}
& ion-label{
text-align: center;
}
& ion-button{
margin: 1px auto;
display: block;
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment