3.0 source code

OfficeWeb/apps/spreadsheeteditor/main/resources/less/rightmenu.less

@@ -0,0 +1,243 @@
+
+.tool-menu.right {
+    .tool-menu-btns {
+        position: absolute;
+        border-left: 1px solid @gray-dark;
+        background-color: @gray-light;
+        right: 0;
+
+        /*menuText*/
+        .toolbar-btn-icon(btn-menu-text,    64, @toolbar-icon-size);
+
+        /*menuImage*/
+        .toolbar-btn-icon(btn-menu-image,   34, @toolbar-icon-size);
+
+        /*menuChart*/
+        .toolbar-btn-icon(btn-menu-chart,   36, @toolbar-icon-size);
+
+        /*menuShape*/
+        .toolbar-btn-icon(btn-menu-shape,   47, @toolbar-icon-size);
+    }
+}
+
+.right-panel {
+    width: 220px;
+    height: 100%;
+    display: none;
+    padding: 0 10px 0 15px;
+    position: relative;
+    overflow: hidden;
+    border-left: 1px solid @gray-dark;
+}
+
+.settings-panel {
+    display: none;
+    overflow: visible;
+    margin-top: 7px;
+
+    & > table {
+        width: 100%;
+    }
+
+    &.active {
+        display: block;
+    }
+
+    .padding-small {
+        padding-bottom: 8px;
+    }
+
+    .padding-large {
+        padding-bottom: 16px;
+    }
+
+    .finish-cell {
+        height: 15px;
+    }
+
+    label {
+        .font-size-normal();
+        font-weight: normal;
+
+        &.input-label{
+            margin-bottom: 0;
+            vertical-align: middle;
+        }
+
+        &.header {
+            font-weight: bold;
+        }
+    }
+
+    .separator { width: 100%;}
+
+    .settings-hidden {
+        display: none;
+    }
+}
+
+.btn-change-shape {
+    .background-ximage('@{app-image-path}/right-panels/rowscols_icon.png', '@{app-image-path}/right-panels/rowscols_icon@2x.png', 84px);
+    margin-right: 2px !important;
+    margin-bottom: 1px !important;
+}
+
+.btn-change-shape                  {background-position: 0      -16px;}
+button.over .btn-change-shape      {background-position: -28px  -16px;}
+.btn-group.open .btn-change-shape,
+button.active .btn-change-shape,
+button:active .btn-change-shape    {background-position: -56px  -16px;}
+
+.combo-pattern-item {
+    .background-ximage('@{app-image-path}/right-panels/patterns.png', '@{app-image-path}/right-panels/patterns@2x.png', 112px);
+}
+
+.combo-dataview-menu {
+    .form-control {
+        cursor: pointer;
+        background-color: white;
+
+        &.text {
+            background: white;
+            vertical-align: bottom;
+        }
+    }
+}
+
+.item-gradient {
+    .background-ximage('@{app-image-path}/right-panels/gradients.png', '@{app-image-path}/right-panels/gradients@2x.png', 150px);
+    width:50px;
+    height:50px;
+}
+
+.item-gradient-separator {
+    margin-right: 62px !important;
+}
+
+.gradient-left-top {
+    background-position: 0 0;
+}
+
+.gradient-top {
+    background-position: -50px 0;
+}
+
+.gradient-right-top {
+    background-position: -100px 0;
+}
+
+.gradient-left {
+    background-position: 0 -50px;
+}
+
+.gradient-right {
+    background-position: -100px -50px;
+}
+
+.gradient-left-bottom {
+    background-position: 0 -100px;
+}
+
+.gradient-bottom {
+    background-position: -50px -100px;
+}
+
+.gradient-right-bottom {
+    background-position: -100px -100px;
+}
+
+.gradient-radial-center {
+    background-position: -100px -150px;
+}
+
+// charts
+.item-wrap {
+    width:50px;
+    height:50px;
+    background-size: cover;
+}
+
+.menu-insertchart {
+    .group-description {
+        float: left;
+        width: 125px;
+        line-height: 58px;
+        padding-left: 6px;
+    }
+
+    .group-items-container {
+        float: left;
+        position: relative;
+
+        & > div {
+            float: left;
+            margin: 0 0 0 14px;
+        }
+    }
+}
+
+.item-chartlist {
+    .background-ximage('@{app-image-path}/charttypes.png', '@{app-image-path}/charttypes@2x.png', 150px);
+    width: 50px;
+    height: 50px;
+}
+
+.line-stack {
+    background-position: -50px 0;
+}
+
+.line-pstack {
+    background-position: -100px 0;
+}
+
+.column-normal {
+    background-position: 0 -50px;
+}
+
+.column-stack{
+    background-position: -50px -50px;
+}
+
+.column-pstack{
+    background-position: -100px -50px;
+}
+
+.bar-normal {
+    background-position: 0 -100px;
+}
+
+.bar-stack{
+    background-position: -50px -100px;
+}
+
+.bar-pstack{
+    background-position: -100px -100px;
+}
+
+.area-normal {
+    background-position: 0 -150px;
+}
+
+.area-stack{
+    background-position: -50px -150px;
+}
+
+.area-pstack{
+    background-position: -100px -150px;
+}
+
+.pie-normal {
+    background-position: 0 -200px;
+}
+
+.point-normal{
+    background-position: -50px -200px;
+}
+
+.stock-normal{
+    background-position: -100px -200px;
+}
+
+.pie-doughnut{
+    background-position: 0 -250px;
+}