bring dashboards back to life
This commit is contained in:
Mads Rasmussen
@@ -86,6 +86,7 @@
|
||||
@import "components/application/umb-backdrop.less";
|
||||
@import "components/application/umb-drawer.less";
|
||||
@import "components/application/umb-language-picker.less";
|
||||
@import "components/application/umb-dashboard.less";
|
||||
|
||||
@import "components/html/umb-expansion-panel.less";
|
||||
@import "components/html/umb-alert.less";
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
.umb-dashboard {
|
||||
position: absolute;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.umb-dashboard__header {
|
||||
padding: 20px 20px 0 20px;
|
||||
border-bottom: 1px solid @gray-9;
|
||||
}
|
||||
|
||||
.umb-dashboard__content {
|
||||
padding: 20px;
|
||||
overflow: auto;
|
||||
}
|
||||
@@ -1,15 +1,3 @@
|
||||
.umb-nav-tabs {
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.umb-nav-tabs.-padding-left {
|
||||
padding-left: 20px;
|
||||
}
|
||||
|
||||
.umb-tab-content {
|
||||
padding-top: 20px;
|
||||
position: relative;
|
||||
top: 22px;
|
||||
border-top: 1px solid @purple-l3;
|
||||
}
|
||||
|
||||
@@ -109,11 +109,7 @@
|
||||
}
|
||||
.nav-tabs > li > a,
|
||||
.nav-pills > li > a {
|
||||
padding-right: 8px;
|
||||
padding-left: 8px;
|
||||
margin-right: 2px;
|
||||
line-height: 14px; // keeps the overall height an even number
|
||||
border-radius: 3px 3px 0 0;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
// TABS
|
||||
@@ -121,26 +117,24 @@
|
||||
|
||||
// Give the tabs something to sit on
|
||||
.nav-tabs {
|
||||
border-bottom: 1px solid @purple-l3;
|
||||
// border-bottom: 1px solid @gray-9;
|
||||
}
|
||||
// Make the list-items overlay the bottom border
|
||||
.nav-tabs > li {
|
||||
margin-bottom: -1px;
|
||||
// margin-bottom: -1px;
|
||||
}
|
||||
// Actual tabs (as links)
|
||||
.nav-tabs > li > a {
|
||||
color: @gray-3;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 4px;
|
||||
line-height: @baseLineHeight;
|
||||
border: 1px solid transparent;
|
||||
border-bottom: 2px solid transparent;
|
||||
padding-bottom: 15px;
|
||||
|
||||
&:hover {
|
||||
color: @black;
|
||||
}
|
||||
&:hover,
|
||||
&:focus {
|
||||
border-color: transparent transparent @purple-l3;
|
||||
// border-color: transparent transparent @purple-l3;
|
||||
}
|
||||
}
|
||||
// Active state, and it's :hover/:focus to override normal :hover/:focus
|
||||
@@ -148,9 +142,7 @@
|
||||
.nav-tabs > .active > a:hover,
|
||||
.nav-tabs > .active > a:focus {
|
||||
color: @black;
|
||||
background-color: @bodyBackground;
|
||||
border: 1px solid @purple-l3;
|
||||
border-bottom-color: transparent;
|
||||
border-bottom-color: @turquoise;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@@ -175,10 +167,6 @@
|
||||
.show-validation .nav-tabs > li.active.error > a:focus {
|
||||
}
|
||||
|
||||
.umb-nav-tabs {
|
||||
margin: -8px 0 0 0;
|
||||
}
|
||||
|
||||
// PILLS
|
||||
// -----
|
||||
|
||||
|
||||
@@ -428,10 +428,6 @@
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.umb-panel-header .umb-nav-tabs {
|
||||
bottom: -1px;
|
||||
}
|
||||
|
||||
input.umb-panel-header-name-input.name-is-empty {
|
||||
border: 1px dashed @gray-8;
|
||||
background: @white;
|
||||
|
||||
@@ -1,51 +1,41 @@
|
||||
<div ng-controller="Umbraco.DashboardController">
|
||||
|
||||
<umb-load-indicator ng-if="page.loading"></umb-load-indicator>
|
||||
<form name="dashboardForm" val-form-manager>
|
||||
|
||||
<form
|
||||
ng-show="!page.loading"
|
||||
class="umb-dashboard"
|
||||
val-form-manager>
|
||||
<umb-load-indicator ng-show="page.loading"></umb-load-indicator>
|
||||
|
||||
<umb-editor-view
|
||||
footer="false"
|
||||
umb-tabs>
|
||||
<div class="umb-dashboard" ng-if="!page.loading">
|
||||
|
||||
<umb-editor-header
|
||||
name="dashboard.name"
|
||||
name-locked="page.nameLocked"
|
||||
tabs="dashboard.tabs"
|
||||
hide-icon="true"
|
||||
hide-description="true"
|
||||
hide-alias="true">
|
||||
</umb-editor-header>
|
||||
<div class="umb-dashboard__header" ng-show="dashboard.tabs.length > 1">
|
||||
<umb-tabs-nav ng-if="dashboard.tabs" model="dashboard.tabs" style="margin-bottom: 0;"></umb-tabs-nav>
|
||||
</div>
|
||||
|
||||
<umb-editor-container>
|
||||
<div class="umb-dashboard__content">
|
||||
|
||||
<umb-tabs-content view="true">
|
||||
<umb-tab id="tab{{tab.id}}" ng-repeat="tab in dashboard.tabs" rel="{{tab.id}}">
|
||||
<umb-tabs-content view="true">
|
||||
<umb-tab id="tab{{tab.id}}" ng-repeat="tab in dashboard.tabs" rel="{{tab.id}}">
|
||||
|
||||
<div ng-repeat="property in tab.properties" ng-switch on="property.serverSide">
|
||||
|
||||
<div class="clearfix" ng-switch-when="false">
|
||||
<h3 ng-show="property.caption">{{property.caption}}</h3>
|
||||
<div ng-include="property.path"></div>
|
||||
</div>
|
||||
|
||||
<div class="umb-dashboard-control clearfix" ng-switch-when="true">
|
||||
<h3 ng-show="property.caption">{{property.caption}}</h3>
|
||||
<iframe ng-src="dashboard/usercontrolproxy.aspx?ctrl={{ property.path}}"></iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</umb-tab>
|
||||
</umb-tabs-content>
|
||||
|
||||
<div ng-repeat="property in tab.properties" ng-switch on="property.serverSide">
|
||||
</div>
|
||||
|
||||
<div class="span12 clearfix" ng-switch-when="false">
|
||||
<h3 ng-show="property.caption">{{property.caption}}</h3>
|
||||
<div ng-include="property.path"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="span12 umb-dashboard-control clearfix" ng-switch-when="true">
|
||||
<h3 ng-show="property.caption">{{property.caption}}</h3>
|
||||
|
||||
<iframe ng-src="dashboard/usercontrolproxy.aspx?ctrl={{ property.path}}"></iframe>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</umb-tab>
|
||||
</umb-tabs-content>
|
||||
|
||||
</umb-editor-container>
|
||||
|
||||
</umb-editor-view>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
Reference in New Issue
Block a user