yv01p/Umbraco-CMS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

header: add wrapper to limit input width. Rename some styles

Browse Source
This commit is contained in:
Mads Rasmussen
2015-08-27 14:25:01 +02:00
parent 42ae182c2b
commit e330c63034
2 changed files with 26 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/Umbraco.Web.UI.Client/src/less/panel.less
View File

@@ -346,28 +346,33 @@
/* --------- UMB PANEL HEADER ---------- */
.umb-panel-content {
.umb-panel-header-content-wrapper {
display: flex;
flex-direction: column;
height: 100px;
padding: 0 20px;
}
.umb-panel-meta {
.umb-panel-header-content {
display: flex;
align-items: center;
flex: 1;
}
.umb-panel-meta.-top-position {
.umb-panel-header-content.-top-position {
position: relative;
top: -20px;
}
.umb-panel-header-meta {
display: flex;
flex: 1;
flex-direction: row;
}
.umb-panel-header-icon {
cursor: pointer;
margin-right: 5px;
//width: 50px;
height: 55px;
display: flex;
justify-content: center;
@@ -380,9 +385,8 @@
}
.umb-panel-header-title-wrapper {
flex: 1;
//margin-right: 70px;
position: relative;
position: relative;
width: 80%;
}
.umb-panel-header-alias {

32
src/Umbraco.Web.UI.Client/src/views/components/editor/umb-editor-header.html
View File

@@ -1,27 +1,25 @@
<div class="umb-panel-header">
<div class="umb-panel-content">
<div class="umb-panel-header-content-wrapper">
<div class="umb-panel-meta" ng-class="{'-top-position': tabs }">
<div class="umb-panel-header-content" ng-class="{'-top-position': tabs }">
<div class="umb-panel-header-icon" ng-if="icon!==undefined" ng-click="openIconPicker()" ng-class="{'-placeholder': $parent.icon==='' || $parent.icon===null}">
<i class="icon {{$parent.icon}}" ng-if="$parent.icon!=='' && $parent.icon!==null"></i>
<div class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">Add icon</div>
</div>
<div class="umb-panel-header-meta">
<div class="umb-panel-header-title-wrapper">
<!--
<umb-content-name
ng-disabled="content.isSystem == 1"
placeholder="@placeholders_entername"
ng-model="name">
</umb-content-name>
-->
<input type="text" class="umb-panel-header-name" placeholder="Enter name..." ng-if="name!==undefined" ng-disabled="content.isSystem == 1" ng-model="$parent.name" ng-class="{'name-is-empty': $parent.name===null || $parent.name===''}" umb-auto-focus focus-on-filled="true" />
<div class="umb-panel-header-icon" ng-if="icon!==undefined" ng-click="openIconPicker()" ng-class="{'-placeholder': $parent.icon==='' || $parent.icon===null}">
<i class="icon {{$parent.icon}}" ng-if="$parent.icon!=='' && $parent.icon!==null"></i>
<div class="umb-panel-header-icon-text" ng-if="$parent.icon==='' || $parent.icon===null">Add icon</div>
</div>
<umb-generate-alias class="umb-panel-header-alias" ng-if="alias!==undefined" alias="$parent.alias" alias-from="$parent.name" enable-lock="true"></umb-generate-alias>
<div class="umb-panel-header-title-wrapper">
<input type="text" class="umb-panel-header-description" placeholder="Enter description..." ng-if="description!==undefined" ng-model="$parent.description" />
<input type="text" class="umb-panel-header-name" placeholder="Enter name..." ng-if="name!==undefined" ng-disabled="content.isSystem == 1" ng-model="$parent.name" ng-class="{'name-is-empty': $parent.name===null || $parent.name===''}" umb-auto-focus focus-on-filled="true" />
<umb-generate-alias class="umb-panel-header-alias" ng-if="alias!==undefined" alias="$parent.alias" alias-from="$parent.name" enable-lock="true"></umb-generate-alias>
<input type="text" class="umb-panel-header-description" placeholder="Enter description..." ng-if="description!==undefined" ng-model="$parent.description" />
</div>
</div>