PairDrop/app/elements/buddy-finder/personal-avatar.html
2015-12-31 01:33:59 +01:00

56 lines
1.4 KiB
HTML

<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">
<link rel="import" href="../../styles/icons.html">
<dom-module id="personal-avatar">
<template>
<style>
:host {
@apply(--layout-vertical);
@apply(--layout-center);
width: 360px;
position: absolute;
bottom: 24px;
left: 50%;
margin-left: -180px;
}
iron-icon {
width: 80px;
height: 80px;
color: #4285f4;
margin-bottom: 6px;
}
.paper-font-body1 {
font-size: 13px;
}
.discover {
color: #4285f4;
}
@media all and (max-height: 370px) {
:host {
bottom: 8px;
}
iron-icon {
width: 32px;
height: 32px;
margin-bottom: 2px;
}
}
</style>
<iron-icon icon="chat:wifi-tethering"></iron-icon>
<div class="paper-font-body1">
The easiest way to transfer files across devices.
</div>
<div class="paper-font-body1 discover">
Allow me to be discovered by: Everyone in this network.
</div>
</template>
<script>
'use strict';
Polymer({
is: 'personal-avatar'
});
</script>
</dom-module>