cloudron-box/webadmin/src/views/setup/step1.html

<div class="row">
    <div class="col-md-12 text-center">
        <h1>Welcome to your Cloudron!</h1>
        <hr/>
        <h3 class="">
                Choose an avatar
        </h3>
    </div>
</div>

<br/>

<div class="row">
    <div class="col-md-4 col-md-offset-4 text-center">
        <img id="previewAvatar" width="98" height="98" ng-src="{{wizard.avatar.data || wizard.avatar.url}}"/>
    </div>
</div>

<br/>
<br/>

<div class="row">
    <div class="col-md-12 settings-avatar-selector">
        <input type="file" id="avatarFileInput" style="display: none" accept="image/png"/>

        <br/>

        <div class="grid">
            <div class="item" ng-repeat="avatar in wizard.availableAvatars" style="background-image: url('{{avatar.data || avatar.url}}');" ng-click="wizard.setPreviewAvatar(avatar)"></div>
            <div class="item add" ng-click="showCustomAvatarSelector()"></div>
        </div>
    </div>
</div>

<br/>
<br/>


<div class="row">
    <div class="col-md-12 text-center">
        <button class="btn btn-primary" ng-click="next()">Next</button>
    </div>
</div>