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

No more dependency with bootstrap and some comments in less file

Browse Source
This commit is contained in:
antoine
2014-09-30 21:39:51 +02:00
parent 2733dc3129
commit 4021b680f8
2 changed files with 60 additions and 230 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/Umbraco.Web.UI.Client/src/canvasdesigner/index.html
View File

@@ -1,11 +1,10 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!--<link href="/Umbraco/lib/bootstrap/css/bootstrap.min.3.0.1.css" type="text/css" rel="stylesheet" />-->
<title>Umbraco Canvas Designer</title>
<link href="/Umbraco/assets/css/canvasdesigner.css" type="text/css" rel="stylesheet" />
<link href="/Umbraco/lib/spectrum/spectrum.css" type="text/css" rel="stylesheet" />
<link href="/Umbraco/lib/jquery/jquery-ui-1.10.4.custom.min.css" type="text/css" rel="stylesheet" />
</head>
<body id="canvasdesignerPanel" ng-mouseover="outlinePositionHide()" ng-class="{ leftOpen: (showStyleEditor || showPalettePicker) && !showDevicesPreview }" ng-controller="Umbraco.canvasdesignerController">
@@ -49,10 +48,6 @@
</li>
</ul>
<!--<div class="help">
<div class="display-i"><i class="icon icon-help-alt"></i><span></span></div>
</div>-->
</div>
<div class="main-panel" ng-class="{selected: !showDevicesPreview && ( showPalettePicker || showStyleEditor )}">
@@ -86,7 +81,7 @@
<ul class="dropdown-menu" ng-init="opendropdown = false" ng-show="opendropdown">
<li><a ng-click="createStyle();opendropdown = false">Create Page Style</a></li>
<li><a ng-click="deleteCanvasdesigner();opendropdown = false">Reset page style</a></li>
<!--<li><a ng-click="makePreset();opendropdown = false">Make preset</a></li>-->
<li><a ng-click="makePreset();opendropdown = false">Make preset</a></li>
</ul>
</div>
@@ -107,7 +102,8 @@
</div>
</div>
<div ng-repeat="configItem in canvasdesignerModel.configs" ng-show="currentSelected && currentSelected.name.toLowerCase() == configItem.name.toLowerCase()" on-finish-render-filters>
<div ng-repeat="configItem in canvasdesignerModel.configs" ng-show="currentSelected && currentSelected.name.toLowerCase() == configItem.name.toLowerCase()
&& currentSelected.schema.toLowerCase() == configItem.schema.toLowerCase()" on-finish-render-filters>
<div class="header">
<h3><i class="icon icon-list" ng-click="outlineSelectedHide()"></i> {{configItem.name}}</h3>
</div>
@@ -136,7 +132,7 @@
<ul class="dropdown-menu" ng-init="opendropdown = false" ng-show="opendropdown">
<li><a ng-click="createStyle();opendropdown = false">Create Page Style</a></li>
<li><a ng-click="deleteCanvasdesigner();opendropdown = false">Reset page style</a></li>
<!--<li><a ng-click="makePreset();opendropdown = false">Make preset</a></li>-->
<li><a ng-click="makePreset();opendropdown = false">Make preset</a></li>
</ul>
</div>
@@ -153,7 +149,6 @@
<script src="/umbraco/lib/lazyload/lazyload.min.js"></script>
<script src="/umbraco/js/canvasdesigner.loader.js"></script>
</body>
</html>

275
src/Umbraco.Web.UI.Client/src/less/canvasdesigner.less
View File

@@ -6,6 +6,8 @@
src: url('/Umbraco/assets/fonts/helveticons/helveticons.eot?#iefix') format('embedded-opentype'), url('/Umbraco/assets/fonts/helveticons/helveticons.ttf') format('truetype'), url('/Umbraco/assets/fonts/helveticons/helveticons.svg#icomoon') format('svg') !important;
}
/****************************/
/* General style */
/****************************/
body {
@@ -18,6 +20,10 @@ body {
line-height: 20px;
color: #343434;
background-color: #F5F5F5;
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
padding-left:80px;
}
h4 {
@@ -50,27 +56,10 @@ a, a:hover{
text-decoration:none;
}
body {
-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
padding-left:80px;
}
body.rightOpen {
padding-right: 250px
}
body.leftOpen {
padding-left: 330px
}
.wait {
display: block;
height: 280px;
width: 100%;
background: center center url(../img/loader.gif) no-repeat;
}
/****************************/
/* General class */
/****************************/
.right {
float:right;
@@ -82,15 +71,20 @@ body.leftOpen {
display:inline-block;
}
.leftOpen {
padding-left: 330px
}
.wait {
display: block;
height: 280px;
width: 100%;
background: center center url(../img/loader.gif) no-repeat;
}
/****************************/
/* Group button */
/****************************/
.btn-group {
float: right;
@@ -219,13 +213,9 @@ body.leftOpen {
background: #f8f8f8;
}
/****************************/
/* Speech bubble */
/****************************/
#speechbubble {
position: absolute;
@@ -258,25 +248,9 @@ body.leftOpen {
}
/****************************/
/* Main section menu */
/****************************/
.more-options i {
display: inline-block;
@@ -287,8 +261,6 @@ body.leftOpen {
border-radius: 20px;
}
.fix-left-menu {
position: fixed;
top: 0;
@@ -399,12 +371,6 @@ ul.sections li.current, ul.sections li:hover {
margin-left:0px;
}
/*************************************************/
/* Main panel */
/*************************************************/
@@ -493,22 +459,9 @@ ul.sections li.current, ul.sections li:hover {
margin-left: 0px;
}
/*************************************************/
/* sample palette color */
/*************************************************/
.samples h4 {
position: initial;
@@ -540,30 +493,19 @@ ul.sections li.current, ul.sections li:hover {
padding: 0;
}
/*************************************************/
/* canvas designer panel */
/*************************************************/
h4.panel-title {
cursor:pointer;
background-color: #f8f8f8;
color: #767676;
}
.editor-category{
margin: 5px 10px;
border: 1px solid #535353;
border: 1px solid #D9D9D9;
}
.canvasdesigner-panel-container {
@@ -576,13 +518,6 @@ h4.panel-title {
margin: 0 0 10px 0;
}
.canvasdesigner .box-slider {
padding: 0px 0px 6px 0px;
overflow: hidden;
@@ -602,13 +537,9 @@ h4.panel-title {
clear: both;
}
/*************************************************/
/* font family picker */
/*************************************************/
.fontFamilyPickerPreview {
float: left;
@@ -670,31 +601,9 @@ h4.panel-title {
margin-bottom:40px;
}
/*************************************************/
/* slider */
/*************************************************/
.canvasdesigner .ui-widget-content {
background: rgba(0, 0, 0, 0.27) !important;
@@ -703,23 +612,8 @@ h4.panel-title {
}
.canvasdesigner .ui-slider-horizontal {
/* float: left; */
/* width: 155px; */
/* height: .3em !important; */
margin: 14px 11px 0 11px;
/* padding: 10px; */
}
/*.canvasdesigner .ui-slider .ui-slider-handle {
margin-left: 0;
color: #d9d9d9 !important;
cursor: pointer;
border-top-right-radius: 1px;
border-bottom-right-radius: 1px;
border-bottom-left-radius: 1px;
border-top-left-radius: 1px;
}*/
.ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default,
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover,
@@ -759,13 +653,6 @@ h4.panel-title {
}
/*.canvasdesigner .slider-span {
float: right;
margin: -9px 0 0 0;
font-size: 11px;
color: #d9d9d9;
}*/
@-moz-document url-prefix() {
.canvasdesigner .slider-input {
margin-top: -6px;
@@ -820,29 +707,9 @@ h4.panel-title {
height: 28px;
}
/******* IFRAME *******/
/*************************************************/
/* IFrame size */
/*************************************************/
.desktop {
width: 100%;
@@ -903,17 +770,9 @@ iframe {
-o-transform: rotate(90deg);
}
/* image picker */
/*************************************************/
/* Image picker */
/*************************************************/
.imagePickerPreview {
height: 20px;
@@ -1005,10 +864,6 @@ iframe {
border: 2px solid #84B8F0;
}
/*.bodyCanvasdesignerImagePicker {
padding: 10px 20px 0 15px;
}*/
.canvasdesignerImagePicker .modal-dialog {
width: 618px;
font-weight: normal;
@@ -1070,25 +925,9 @@ iframe {
color: #555555;
}
/******* BORDER *******/
/*************************************************/
/* Border editor */
/*************************************************/
.box-preview {
display:inline-block;
@@ -1147,6 +986,10 @@ iframe {
float: left;
}
/*************************************************/
/* Radius editor */
/*************************************************/
.radius-top-left, .radius-top-right, .radius-bottom-left, .radius-bottom-right {
display: block;
position: absolute;
@@ -1178,11 +1021,3 @@ iframe {
bottom:0;
right:0
}