<div class="two-columns">
    
    <div class="column-one">
        <div class="toolbar-on-left__container">
            <div class="toolbar-on-left">
                <a class="button2" href="#/">Go back</a>
            </div>
        </div>
    </div>
    
    <div class="column-two">
    <div class="text scroll">
        
        <h1>Tags</h1>
        
        <p ng-show="allTags.length == 0">
            No tags so far.
        </p>
        
        <div ng-repeat="tag in allTags" class="tags__entry  layout-justify  table-row">
            
            <div class="tags__name">
                <span ng-hide="showRename">{{tag.name}}</span>
                <span ng-show="showRename">
                    <input type="text" ng-model="newName"
                        ng-init="newName = tag.name"/>
                    <button ng-click="changeTagName(tag, newName); showRename = !showRename;">save</button>
                </span>
            </div>
            <a class="button2" ng-click="showRename = !showRename">
                <span ng-hide="showRename">rename</span>
                <span ng-show="showRename">cancel</span>
            </a>
            <div class="layout-justify__last">
                <span ng-show="showDelete">
                    Delete this tag?
                    <a class="button2  tags__yes-btn" ng-click="removeTag(tag);">yes</a>
                </span>
                <a class="button2" ng-click="showDelete = !showDelete">
                    <span ng-hide="showDelete">delete</span>
                    <span ng-show="showDelete">no</span>
                </a>
            </div>
        </div>
        
    </div>
    </div>
    
</div>