3.0 source code
This commit is contained in:
@@ -0,0 +1,77 @@
|
||||
.btn-borders-large {
|
||||
.background-ximage('@{app-image-path}/right-panels/LargeBorders.png', '@{app-image-path}/right-panels/LargeBorders@2x.png', 124px);
|
||||
}
|
||||
|
||||
.options-btn-icon(btn-adv-paragraph-all, 0, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-bottom, 1, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-left, 2, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-inner-hor, 3, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-none, 4, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-outer, 5, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-right, 6, 31px);
|
||||
.options-btn-icon(btn-adv-paragraph-top, 7, 31px);
|
||||
|
||||
.options-btn-icon(btn-adv-position-all-none, 8, 31px);
|
||||
.options-btn-icon(btn-adv-position-all-table, 9, 31px);
|
||||
.options-btn-icon(btn-adv-position-all, 10, 31px);
|
||||
.options-btn-icon(btn-adv-position-inner-none, 11, 31px);
|
||||
.options-btn-icon(btn-adv-position-inner-table, 12, 31px);
|
||||
.options-btn-icon(btn-adv-position-inner, 13, 31px);
|
||||
.options-btn-icon(btn-adv-position-none, 14, 31px);
|
||||
.options-btn-icon(btn-adv-position-none-table, 15, 31px);
|
||||
.options-btn-icon(btn-adv-position-none-none, 16, 31px);
|
||||
.options-btn-icon(btn-adv-position-outer-none, 17, 31px);
|
||||
.options-btn-icon(btn-adv-position-outer-table, 18, 31px);
|
||||
.options-btn-icon(btn-adv-position-outer, 19, 31px);
|
||||
|
||||
.toolbar-btn-icon(advanced-btn-ratio, 52, 20px);
|
||||
|
||||
.icon-advanced-wrap {
|
||||
.background-ximage('@{app-image-path}/right-panels/right_panel_wrap_btns.png', '@{app-image-path}/right-panels/right_panel_wrap_btns@2x.png', 180px);
|
||||
}
|
||||
|
||||
.options-btn-icon(btn-wrap-inline, 0, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-square, 1, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-tight, 2, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-through, 3, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-topbottom, 4, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-infront, 5, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-behind, 6, @x-huge-icon-size);
|
||||
|
||||
.options-btn-icon(btn-drop-none, 7, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-drop-text, 8, @x-huge-icon-size);
|
||||
.options-btn-icon(btn-drop-margin, 9, @x-huge-icon-size);
|
||||
|
||||
.combo-arrow-style {
|
||||
.form-control {
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
|
||||
&.image {
|
||||
.background-ximage('@{app-image-path}/right-panels/Begin-EndStyle.png', '@{app-image-path}/right-panels/Begin-EndStyle@2x.png', 480px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 10px 0;
|
||||
background-attachment: scroll;
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
&:active:not(.disabled),
|
||||
&.active:not(.disabled){
|
||||
.caret {
|
||||
background-position: @arrow-small-offset-x @arrow-small-offset-y;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-arrow {
|
||||
.background-ximage('@{app-image-path}/right-panels/Begin-EndStyle.png', '@{app-image-path}/right-panels/Begin-EndStyle@2x.png', 480px);
|
||||
width:44px;
|
||||
height:20px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
136
OfficeWeb/apps/documenteditor/main/resources/less/app.less
Normal file
136
OfficeWeb/apps/documenteditor/main/resources/less/app.less
Normal file
@@ -0,0 +1,136 @@
|
||||
//
|
||||
// Common
|
||||
// --------------------------------------------------
|
||||
|
||||
// App variables
|
||||
@import "variables.less";
|
||||
|
||||
@import "../../../../common/main/resources/less/asc-mixins.less";
|
||||
|
||||
// Bootstrap overwrite
|
||||
@import "../../../../common/main/resources/less/variables.less";
|
||||
|
||||
//
|
||||
// Bootstrap
|
||||
// --------------------------------------------------
|
||||
|
||||
// Core variables and mixins
|
||||
//@import "../../../../vendor/bootstrap/less/variables.less";
|
||||
@import "../../../../../vendor/bootstrap/less/mixins.less";
|
||||
|
||||
// Reset
|
||||
@import "../../../../../vendor/bootstrap/less/normalize.less";
|
||||
//@import "print.less";
|
||||
|
||||
// Core CSS
|
||||
@import "../../../../../vendor/bootstrap/less/scaffolding.less";
|
||||
@import "../../../../../vendor/bootstrap/less/type.less";
|
||||
//@import "code.less";
|
||||
//@import "grid.less";
|
||||
//@import "tables.less";
|
||||
@import "../../../../../vendor/bootstrap/less/forms.less";
|
||||
@import "../../../../../vendor/bootstrap/less/buttons.less";
|
||||
|
||||
// Components
|
||||
@import "../../../../../vendor/bootstrap/less/component-animations.less";
|
||||
//@import "glyphicons.less";
|
||||
@import "../../../../../vendor/bootstrap/less/dropdowns.less";
|
||||
@import "../../../../../vendor/bootstrap/less/button-groups.less";
|
||||
@import "../../../../../vendor/bootstrap/less/input-groups.less";
|
||||
//@import "navs.less";
|
||||
//@import "navbar.less";
|
||||
//@import "breadcrumbs.less";
|
||||
//@import "pagination.less";
|
||||
//@import "pager.less";
|
||||
//@import "labels.less";
|
||||
//@import "badges.less";
|
||||
//@import "jumbotron.less";
|
||||
//@import "thumbnails.less";
|
||||
//@import "alerts.less";
|
||||
//@import "progress-bars.less";
|
||||
//@import "media.less";
|
||||
//@import "list-group.less";
|
||||
//@import "panels.less";
|
||||
//@import "wells.less";
|
||||
//@import "close.less";
|
||||
|
||||
// Components w/ JavaScript
|
||||
//@import "modals.less";
|
||||
@import "../../../../../vendor/bootstrap/less/tooltip.less";
|
||||
//@import "popovers.less";
|
||||
//@import "carousel.less";
|
||||
|
||||
// Utility classes
|
||||
@import "../../../../../vendor/bootstrap/less/utilities.less";
|
||||
@import "../../../../../vendor/bootstrap/less/responsive-utilities.less";
|
||||
|
||||
//
|
||||
// Perfect scrollbar
|
||||
// --------------------------------------------------
|
||||
|
||||
@import (inline) "../../../../../vendor/perfect-scrollbar/src/perfect-scrollbar.css";
|
||||
|
||||
//
|
||||
// Common
|
||||
// --------------------------------------------------
|
||||
|
||||
@import "../../../../common/main/resources/less/header.less";
|
||||
@import "../../../../common/main/resources/less/buttons.less";
|
||||
@import "../../../../common/main/resources/less/dropdown-menu.less";
|
||||
@import "../../../../common/main/resources/less/dropdown-submenu.less";
|
||||
@import "../../../../common/main/resources/less/separator.less";
|
||||
@import "../../../../common/main/resources/less/input.less";
|
||||
@import "../../../../common/main/resources/less/combobox.less";
|
||||
@import "../../../../common/main/resources/less/window.less";
|
||||
@import "../../../../common/main/resources/less/spinner.less";
|
||||
@import "../../../../common/main/resources/less/loadmask.less";
|
||||
@import "../../../../common/main/resources/less/checkbox.less";
|
||||
@import "../../../../common/main/resources/less/radiobox.less";
|
||||
@import "../../../../common/main/resources/less/dataview.less";
|
||||
@import "../../../../common/main/resources/less/listview.less";
|
||||
@import "../../../../common/main/resources/less/colorpalette.less";
|
||||
@import "../../../../common/main/resources/less/theme-colorpalette.less";
|
||||
@import "../../../../common/main/resources/less/dimension-picker.less";
|
||||
@import "../../../../common/main/resources/less/hsb-colorpicker.less";
|
||||
@import "../../../../common/main/resources/less/table-styler.less";
|
||||
@import "../../../../common/main/resources/less/masked-field.less";
|
||||
@import "../../../../common/main/resources/less/extended-color-picker.less";
|
||||
@import "../../../../common/main/resources/less/layout.less";
|
||||
@import "../../../../common/main/resources/less/combo-border-size.less";
|
||||
@import "../../../../common/main/resources/less/combo-dataview.less";
|
||||
@import "../../../../common/main/resources/less/slider.less";
|
||||
@import "../../../../common/main/resources/less/multislider-gradient.less";
|
||||
@import "../../../../common/main/resources/less/advanced-settings-window.less";
|
||||
@import "../../../../common/main/resources/less/chat.less";
|
||||
@import "../../../../common/main/resources/less/comments.less";
|
||||
@import "../../../../common/main/resources/less/searchdialog.less";
|
||||
@import "../../../../common/main/resources/less/about.less";
|
||||
@import "../../../../common/main/resources/less/tooltip.less";
|
||||
@import "../../../../common/main/resources/less/scroller.less";
|
||||
@import "../../../../common/main/resources/less/synchronize-tip.less";
|
||||
@import "../../../../common/main/resources/less/common.less";
|
||||
|
||||
// App
|
||||
// --------------------------------------------------
|
||||
|
||||
@import "layout.less";
|
||||
@import "toolbar.less";
|
||||
@import "statusbar.less";
|
||||
@import "leftmenu.less";
|
||||
@import "rightmenu.less";
|
||||
@import "advanced-settings.less";
|
||||
|
||||
.font-size-small {
|
||||
.fontsize(@font-size-small);
|
||||
}
|
||||
|
||||
.font-size-normal {
|
||||
.fontsize(@font-size-base);
|
||||
}
|
||||
|
||||
.font-size-large {
|
||||
.fontsize(@font-size-large);
|
||||
}
|
||||
|
||||
@huge-icon-size: 37px;
|
||||
@x-huge-icon-size: 45px;
|
||||
@@ -0,0 +1,71 @@
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.user-select(none);
|
||||
color: @gray-deep;
|
||||
|
||||
&.safari {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
#viewport {
|
||||
overflow: scroll;
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
width: 0;
|
||||
height: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
margin-bottom: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
#viewport {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top:0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #f4f4f4;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.layout-region {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
|
||||
.row {
|
||||
display: table-row;
|
||||
}
|
||||
|
||||
.cell {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
.layout-resizer {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.tooltip.main-info {
|
||||
z-index: @zindex-popover;
|
||||
|
||||
.tooltip-inner {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
440
OfficeWeb/apps/documenteditor/main/resources/less/leftmenu.less
Normal file
440
OfficeWeb/apps/documenteditor/main/resources/less/leftmenu.less
Normal file
@@ -0,0 +1,440 @@
|
||||
.tool-menu {
|
||||
height: 100%;
|
||||
display: block;
|
||||
|
||||
&.left {
|
||||
overflow: hidden;
|
||||
|
||||
.tool-menu-btns {
|
||||
border-right: 1px solid @gray-dark;
|
||||
|
||||
.toolbar-btn-icon(btn-menu-file, 66, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-menu-search, 64, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-menu-comments, 65, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-menu-chat, 62, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-menu-about, 68, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-menu-support, 70, @toolbar-icon-size);
|
||||
|
||||
button.notify .btn-menu-chat,
|
||||
button.notify.over > .btn-menu-chat {background-position: -0*@toolbar-icon-size -63*@toolbar-icon-size;}
|
||||
button.notify:active > .btn-menu-chat {background-position: -1*@toolbar-icon-size -63*@toolbar-icon-size;}
|
||||
button.notify.disabled > .btn-menu-chat {background-position: -2*@toolbar-icon-size -63*@toolbar-icon-size;}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#left-menu {
|
||||
&+.layout-resizer {
|
||||
border-left: 0 none;
|
||||
border-right: 0 none;
|
||||
|
||||
&.move {
|
||||
border-left: 1px solid @gray-dark;
|
||||
border-right: 1px solid @gray-dark;
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tool-menu-btns {
|
||||
width: 40px;
|
||||
height: 100%;
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
padding-top: 15px;
|
||||
|
||||
button {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.left-panel {
|
||||
padding-left: 40px;
|
||||
height: 100%;
|
||||
border-right: 1px solid @gray-dark;
|
||||
|
||||
#left-panel-chat {
|
||||
height: 100%;
|
||||
}
|
||||
#left-panel-comments {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.left-menu-full-ct {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
left: 40px;
|
||||
padding-right: 40px;
|
||||
top: 0;
|
||||
position: absolute;
|
||||
z-index: @zindex-dropdown - 5;
|
||||
background-color: @gray-light;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#file-menu-panel {
|
||||
> div {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.panel-menu {
|
||||
width: 260px;
|
||||
float: left;
|
||||
border-right: 1px solid @gray-dark;
|
||||
background-color: @gray-light;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
position: relative;
|
||||
|
||||
&.fm-btn {
|
||||
height: 27px;
|
||||
margin-bottom: 3px;
|
||||
|
||||
&:hover {
|
||||
background-color: @secondary;
|
||||
}
|
||||
|
||||
&.active {
|
||||
outline: 0;
|
||||
background-color: @primary;
|
||||
|
||||
> a {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.devider {
|
||||
.dropdown-menu .divider;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
> a {
|
||||
&:extend(.dropdown-menu > li > a);
|
||||
padding-top: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 13px;
|
||||
|
||||
&:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.panel-context {
|
||||
width: 100%;
|
||||
padding-left: 260px;
|
||||
background-color: #fff;
|
||||
|
||||
.content-box {
|
||||
height: 100%;
|
||||
padding: 0 20px;
|
||||
|
||||
label.empty {
|
||||
position: absolute;
|
||||
top: 45%;
|
||||
left: 50%;
|
||||
}
|
||||
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#panel-saveas {
|
||||
table {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 65px;
|
||||
|
||||
.btn-doc-format {
|
||||
display: block;
|
||||
width: 98px;
|
||||
height: 125px;
|
||||
cursor: pointer;
|
||||
margin: 65px 25px 0px;
|
||||
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
.background-ximage('@{app-image-path}/docformat.png', '@{app-image-path}/docformat@2x.png', 816px);
|
||||
|
||||
.icon-document-format(@shift-x, @shift-y: 0) {
|
||||
background-position: @shift-x @shift-y;
|
||||
|
||||
&:hover {
|
||||
background-position: @shift-x+102 @shift-y;
|
||||
}
|
||||
}
|
||||
|
||||
&.docx {.icon-document-format(-306px);}
|
||||
&.doc {.icon-document-format(-102px);}
|
||||
&.odt {.icon-document-format(-102px,-129px);}
|
||||
&.rtf {.icon-document-format(-510px,-129px);}
|
||||
&.txt {.icon-document-format(-714px,-129px);}
|
||||
&.html {.icon-document-format(-714px);}
|
||||
&.epub {.icon-document-format(-510px);}
|
||||
&.pdf {.icon-document-format(-306px,-129px);}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panel-settings {
|
||||
padding: 0 30px;
|
||||
table {
|
||||
margin: 30px 0;
|
||||
width: 100%;
|
||||
|
||||
tr {
|
||||
td {
|
||||
padding: 5px 10px;
|
||||
|
||||
&.left {
|
||||
text-align: right;
|
||||
width: 30%;
|
||||
|
||||
label {
|
||||
font-family: tahoma, arial, verdana, sans-serif;
|
||||
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
&.divider {
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panel-createnew {
|
||||
h3 {
|
||||
margin: 0;
|
||||
font-size: 10pt;
|
||||
color: #665;
|
||||
font-weight: bold;
|
||||
padding: 0 0 10px 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.blank-document {
|
||||
min-width: 650px;
|
||||
}
|
||||
|
||||
.blank-document-info {
|
||||
vertical-align: top;
|
||||
width: 445px;
|
||||
display: inline-block;
|
||||
|
||||
h3 {
|
||||
padding-left: 0;
|
||||
padding-top: 40px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.blank-document-btn {
|
||||
display: inline-block;
|
||||
margin: 25px 20px 65px;
|
||||
.background-ximage('@{app-image-path}/file-templates-blank.png', '@{app-image-path}/file-templates-blank@2x.png', 256px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background-position: -128px 0;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
margin: 0;
|
||||
border-bottom: none;
|
||||
border-color: #e1e1e1;
|
||||
}
|
||||
|
||||
.thumb-list {
|
||||
.thumb-wrap {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
padding: 30px 20px;
|
||||
cursor: pointer;
|
||||
|
||||
.thumb {
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
.background-ximage('@{app-image-path}/file-template-default.png', '@{app-image-path}/file-template-default@2x.png', 128px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panel-recentfiles {
|
||||
.dataview {
|
||||
& > div:not(.ps-scrollbar-x-rail):not(.ps-scrollbar-y-rail) {
|
||||
border: none;
|
||||
width: 100%;
|
||||
.box-shadow(none);
|
||||
}
|
||||
}
|
||||
|
||||
.recent-wrap {
|
||||
height: 65px;
|
||||
padding: 10px;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
|
||||
&:hover,
|
||||
&.over {
|
||||
background-color: @gray-light;
|
||||
}
|
||||
|
||||
.recent-icon {
|
||||
float: left;
|
||||
width: 35px;
|
||||
height: 45px;
|
||||
margin-right: 10px;
|
||||
.background-ximage('@{app-image-path}/file-recent.png', '@{app-image-path}/file-recent@2x.png', 72px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.file-name {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin: 5px 0;
|
||||
}
|
||||
|
||||
.file-info {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panel-help {
|
||||
padding: 0;
|
||||
overflow-y: hidden;
|
||||
|
||||
.no-padding {
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.dataview {
|
||||
border-right: 1px solid @gray-dark;
|
||||
|
||||
& > div:not(.ps-scrollbar-x-rail):not(.ps-scrollbar-y-rail) {
|
||||
display: block;
|
||||
border: none;
|
||||
width: 100%;
|
||||
.box-shadow(none);
|
||||
margin: 0;
|
||||
font-size: 12px;
|
||||
|
||||
&:not(.header-name) {
|
||||
&:hover,
|
||||
&.over {
|
||||
background-color: @gray-light;
|
||||
}
|
||||
|
||||
&.selected {
|
||||
background-color: @primary;
|
||||
color: @dropdown-link-active-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.help-item-wrap {
|
||||
padding: 7px 2px 7px 20px;
|
||||
}
|
||||
|
||||
.header-name {
|
||||
padding: 7px 2px 7px 10px;
|
||||
font-weight: bold;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#panel-info {
|
||||
padding: 0 30px;
|
||||
table {
|
||||
tr {
|
||||
td {
|
||||
padding: 0 20px 5px 0;
|
||||
|
||||
&.left {
|
||||
padding: 5px 10px;
|
||||
text-align: right;
|
||||
width: 30%;
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
&.right {
|
||||
padding: 5px 10px;
|
||||
width: 70%;
|
||||
}
|
||||
}
|
||||
|
||||
&.divider {
|
||||
height: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
&.main {
|
||||
width: 100%;
|
||||
margin: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.userLink {
|
||||
.background-ximage('@{app-image-path}/profile.png', '@{app-image-path}/profile@2x.png', 12px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: left center;
|
||||
background-attachment: scroll;
|
||||
background-color: transparent;
|
||||
display: inline-block;
|
||||
padding: 0 0 0 17px;
|
||||
}
|
||||
|
||||
label, span {
|
||||
font-family: tahoma, arial, verdana, sans-serif;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
236
OfficeWeb/apps/documenteditor/main/resources/less/rightmenu.less
Normal file
236
OfficeWeb/apps/documenteditor/main/resources/less/rightmenu.less
Normal file
@@ -0,0 +1,236 @@
|
||||
|
||||
.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, 37, @toolbar-icon-size);
|
||||
|
||||
/*menuImage*/
|
||||
.toolbar-btn-icon(btn-menu-image, 17, @toolbar-icon-size);
|
||||
|
||||
/*menuTable*/
|
||||
.toolbar-btn-icon(btn-menu-table, 18, @toolbar-icon-size);
|
||||
|
||||
/*menuChart*/
|
||||
.toolbar-btn-icon(btn-menu-chart, 45, @toolbar-icon-size);
|
||||
|
||||
/*menuHeader*/
|
||||
.toolbar-btn-icon(btn-menu-header, 39, @toolbar-icon-size);
|
||||
|
||||
/*menuShape*/
|
||||
.toolbar-btn-icon(btn-menu-shape, 43, @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;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-right-panel {
|
||||
.background-ximage('@{app-image-path}/right-panels/RightPanelBigBtns.png', '@{app-image-path}/right-panels/RightPanelBigBtns@2x.png', 148px);
|
||||
}
|
||||
|
||||
.options-btn-icon(btn-colontitul-tl, 3, @huge-icon-size);
|
||||
.options-btn-icon(btn-colontitul-tc, 4, @huge-icon-size);
|
||||
.options-btn-icon(btn-colontitul-tr, 5, @huge-icon-size);
|
||||
.options-btn-icon(btn-colontitul-bl, 6, @huge-icon-size);
|
||||
.options-btn-icon(btn-colontitul-bc, 7, @huge-icon-size);
|
||||
.options-btn-icon(btn-colontitul-br, 8, @huge-icon-size);
|
||||
|
||||
.options-btn-icon(btn-wrap-none, 9, @huge-icon-size);
|
||||
.options-btn-icon(btn-wrap-parallel, 10, @huge-icon-size);
|
||||
|
||||
.options-btn-icon(btn-table-align-left, 0, @huge-icon-size);
|
||||
.options-btn-icon(btn-table-align-center, 1, @huge-icon-size);
|
||||
.options-btn-icon(btn-table-align-right, 2, @huge-icon-size);
|
||||
|
||||
.options-btn-icon(btn-frame-inline, 9, @huge-icon-size);
|
||||
.options-btn-icon(btn-frame-flow, 10, @huge-icon-size);
|
||||
.options-btn-icon(btn-frame-none, 11, @huge-icon-size);
|
||||
|
||||
.item-wrap {
|
||||
.background-ximage('@{app-image-path}/right-panels/right_panel_wrap_icons.png', '@{app-image-path}/right-panels/right_panel_wrap_icons@2x.png', 350px);
|
||||
width:50px;
|
||||
height:50px;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.wrap-inline {
|
||||
background-position: 0 0;
|
||||
}
|
||||
|
||||
.wrap-square {
|
||||
background-position: -50px 0;
|
||||
}
|
||||
|
||||
.wrap-tight {
|
||||
background-position: -100px 0;
|
||||
}
|
||||
|
||||
.wrap-through {
|
||||
background-position: -150px 0;
|
||||
}
|
||||
|
||||
.wrap-topAndBottom {
|
||||
background-position: -200px 0;
|
||||
}
|
||||
|
||||
.wrap-behind {
|
||||
background-position: -300px 0;
|
||||
}
|
||||
|
||||
.wrap-inFront {
|
||||
background-position: -250px 0;
|
||||
}
|
||||
|
||||
.btn-toolbar .btn-icon.btn-borders-small {
|
||||
.background-ximage('@{app-image-path}/right-panels/SmallBorders.png', '@{app-image-path}/right-panels/SmallBorders@2x.png', 84px);
|
||||
}
|
||||
|
||||
.options-btn-icon(btn-position-all, 0, 21px);
|
||||
.options-btn-icon(btn-position-inner, 1, 21px);
|
||||
.options-btn-icon(btn-position-bottom, 2, 21px);
|
||||
.options-btn-icon(btn-position-inner-hor, 3, 21px);
|
||||
.options-btn-icon(btn-position-top, 4, 21px);
|
||||
.options-btn-icon(btn-position-none, 5, 21px);
|
||||
.options-btn-icon(btn-position-outer, 6, 21px);
|
||||
.options-btn-icon(btn-position-left, 7, 21px);
|
||||
.options-btn-icon(btn-position-inner-vert, 8, 21px);
|
||||
.options-btn-icon(btn-position-right, 9, 21px);
|
||||
|
||||
.btn-edit-table,
|
||||
.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-edit-table {background-position: 0 0;}
|
||||
button.over .btn-edit-table {background-position: -28px 0;}
|
||||
.btn-group.open .btn-edit-table,
|
||||
button.active .btn-edit-table,
|
||||
button:active .btn-edit-table {background-position: -56px 0;}
|
||||
|
||||
.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;
|
||||
}
|
||||
257
OfficeWeb/apps/documenteditor/main/resources/less/statusbar.less
Normal file
257
OfficeWeb/apps/documenteditor/main/resources/less/statusbar.less
Normal file
@@ -0,0 +1,257 @@
|
||||
.statusbar {
|
||||
display: table;
|
||||
padding: 2px;
|
||||
height: 25px;
|
||||
background-color: @gray-light;
|
||||
.box-inner-shadow(0 1px 0 @gray-dark);
|
||||
|
||||
.status-label {
|
||||
font-weight: bold;
|
||||
color: @gray-deep;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
#status-label-pages, #status-label-zoom {
|
||||
cursor: pointer;
|
||||
}
|
||||
#status-label-pages, #status-label-action {
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
#status-users-icon,#status-users-count {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#status-users-icon {
|
||||
.background-ximage('@{app-image-path}/toolbar-menu.png', '@{app-image-path}/toolbar-menu@2x.png', 60px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 -1220px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
#status-label-zoom {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btn-tpl(@top-position) {
|
||||
.btn-icon {
|
||||
background-position: 0 @top-position;
|
||||
|
||||
&:active {
|
||||
background-position: -20px @top-position;
|
||||
}
|
||||
}
|
||||
|
||||
&[disabled] .btn-icon {
|
||||
background-position: -60px @top-position;
|
||||
}
|
||||
|
||||
&.active {
|
||||
.btn-icon {
|
||||
background-position: -20px @top-position;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#btn-doc-lang {
|
||||
.btn-tpl(-1340px);
|
||||
margin-right: 9px;
|
||||
}
|
||||
|
||||
#btn-doc-spell {
|
||||
.btn-tpl(-1380px);
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
#btn-zoom-topage {
|
||||
.btn-tpl(-1120px);
|
||||
margin-right: 9px;
|
||||
margin-left: 6px;
|
||||
}
|
||||
|
||||
#btn-zoom-towidth {
|
||||
.btn-tpl(-1100px);
|
||||
margin-right: 9px;
|
||||
}
|
||||
|
||||
#btn-zoom-down {
|
||||
.btn-tpl(-1160px);
|
||||
}
|
||||
|
||||
#btn-zoom-up {
|
||||
.btn-tpl(-1140px);
|
||||
}
|
||||
|
||||
.status-group {
|
||||
display: table-cell;
|
||||
white-space: nowrap;
|
||||
padding-top: 3px;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.separator {
|
||||
margin: 0px 3px 0 4px;
|
||||
|
||||
&.short {
|
||||
height: 25px;
|
||||
margin-top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
.cnt-lang {
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #000;
|
||||
margin-left: 6px;
|
||||
|
||||
.icon-lang-flag {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
margin-left: 3px;
|
||||
margin-right: 2px;
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
display: inline-block;
|
||||
|
||||
/* languages */
|
||||
.apply-language-flag();
|
||||
}
|
||||
|
||||
.caret.up {
|
||||
.background-ximage('@{common-image-path}/@{common-controls}', '@{common-image-path}/@{common-controls2x}', 100px);
|
||||
background-repeat: no-repeat;
|
||||
background-position: @arrow-up-small-offset-x @arrow-up-small-offset-y;
|
||||
|
||||
border: none;
|
||||
width: 7px;
|
||||
height: 7px;
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
li .menu-item-icon {
|
||||
margin-left: 2px;
|
||||
margin-top: 1px;
|
||||
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
.apply-language-flag();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cnt-zoom {
|
||||
display: inline-block;
|
||||
|
||||
.dropdown-menu {
|
||||
min-width: 80px;
|
||||
margin-left: -4px;
|
||||
|
||||
li {
|
||||
text-align: center;
|
||||
|
||||
> a {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown-menu {
|
||||
margin-bottom: 6px;
|
||||
|
||||
li {
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
#status-goto-box {
|
||||
padding: 10px;
|
||||
margin-left: 40px;
|
||||
margin-bottom: 2px;
|
||||
min-width: 130px;
|
||||
|
||||
> label {
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
> input[type=text] {
|
||||
width: 50px;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.combo-langs {
|
||||
.dropdown-menu {
|
||||
li .menu-item-icon {
|
||||
margin-top: 1px;
|
||||
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
.apply-language-flag();
|
||||
}
|
||||
}
|
||||
|
||||
.input-lang-icon {
|
||||
position: absolute;
|
||||
width: 16px;
|
||||
height: 12px;
|
||||
left: 5px;
|
||||
top: 5px;
|
||||
|
||||
.apply-language-flag();
|
||||
}
|
||||
|
||||
input {
|
||||
padding-left: 25px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.apply-language-flag() {
|
||||
.background-ximage('@{app-image-path}/toolbar-menu.png', '@{app-image-path}/toolbar-menu@2x.png', 60px);
|
||||
background-position: -16px -1608px;
|
||||
background-repeat: no-repeat;
|
||||
|
||||
&.ca, &.ca-ES {background-position: 0 -1499px;}
|
||||
&.cs, &.cs-CZ {background-position: -16px -1500px;}
|
||||
&.da, &.da-DK {background-position: -32px -1500px;}
|
||||
&.de, &.de-DE {background-position: 0 -1512px;}
|
||||
&.el, &.el-GR {background-position: -16px -1512px;}
|
||||
&.en, &.en-US {background-position: -32px -1512px;}
|
||||
&.fr, &.fr-FR {background-position: 0 -1524px;}
|
||||
&.hu, &.hu-HU {background-position: -16px -1524px;}
|
||||
&.it, &.it-IT {background-position: -32px -1524px;}
|
||||
&.ko, &.ko-KR {background-position: 0 -1536px;}
|
||||
&.nl, &.nl-NL {background-position: -16px -1536px;}
|
||||
&.nb, &.nb-NO {background-position: -32px -1536px;}
|
||||
&.pl, &.pl-PL {background-position: 0 -1548px;}
|
||||
&.pt, &.pt-BR {background-position: -16px -1548px;}
|
||||
&.ro, &.ro-RO {background-position: -32px -1548px;}
|
||||
&.ru, &.ru-RU {background-position: 0 -1560px;}
|
||||
&.sk, &.sk-SK {background-position: -16px -1560px;}
|
||||
&.sv, &.sv-SE {background-position: -32px -1560px;}
|
||||
&.tr, &.tr-TR {background-position: 0 -1572px;}
|
||||
&.uk, &.uk-UA {background-position: -16px -1572px;}
|
||||
&.lv, &.lv-LV {background-position: -32px -1572px;}
|
||||
&.lt, &.lt-LT {background-position: 0 -1584px;}
|
||||
&.vi, &.vi-VN {background-position: -16px -1584px;}
|
||||
&.de-CH {background-position: -32px -1584px;}
|
||||
&.nn, &.nn-NO {background-position: 0 -1596px;}
|
||||
&.pt-PT {background-position: -16px -1596px;}
|
||||
&.de-AT {background-position: -32px -1596px;}
|
||||
&.es, &.es-ES {background-position: 0 -1608px;}
|
||||
&.en-GB {background-position: -32px -1608px;}
|
||||
&.en-AU {background-position: 0 -1620px;}
|
||||
&.az-Latn-AZ {background-position: -16px -1620px;}
|
||||
}
|
||||
353
OfficeWeb/apps/documenteditor/main/resources/less/toolbar.less
Normal file
353
OfficeWeb/apps/documenteditor/main/resources/less/toolbar.less
Normal file
@@ -0,0 +1,353 @@
|
||||
.toolbar {
|
||||
padding: 10px 0;
|
||||
background-color: @gray-light;
|
||||
.box-inner-shadow(0 -1px 0 @gray-dark);
|
||||
|
||||
.toolbar-group {
|
||||
display: table-cell;
|
||||
vertical-align: top;
|
||||
white-space: nowrap;
|
||||
padding-left: 12px;
|
||||
|
||||
&:last-child {
|
||||
padding-right: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar-row {
|
||||
height: 20px;
|
||||
font-size: 0;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.separator {
|
||||
margin-left: 12px;
|
||||
|
||||
&.long {
|
||||
height: 46px;
|
||||
}
|
||||
|
||||
&.short {
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-placeholder {
|
||||
// background-color: red;
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
&.split {
|
||||
width: 28px;
|
||||
}
|
||||
|
||||
&.border {
|
||||
border: 1px solid @gray;
|
||||
.border-radius(1px);
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
&.masked {
|
||||
button.disabled .btn-icon:not(.btn-print):not(.btn-save):not(.btn-save-coauth):not(.btn-settings):not(.btn-hidebars) {
|
||||
background-position-x: 0px !important;
|
||||
}
|
||||
.toolbar-group:not(.no-mask) {
|
||||
opacity: 0.4;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.toolbar-mask {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 48px;
|
||||
right: 45px;
|
||||
height: 100%;
|
||||
opacity: 0;
|
||||
background-color: @gray-light;
|
||||
z-index: @zindex-modal - 1;
|
||||
}
|
||||
|
||||
.menu-markers,
|
||||
.menu-numbers {
|
||||
//
|
||||
}
|
||||
|
||||
.item-markerlist {
|
||||
.background-ximage('@{app-image-path}/toolbar/bullets.png', '@{app-image-path}/toolbar/bullets@2x.png', 38px);
|
||||
width: 38px;
|
||||
height: 38px;
|
||||
}
|
||||
|
||||
.item-numberlist,
|
||||
.item-multilevellist {
|
||||
.background-ximage('@{app-image-path}/toolbar/multilevels-numbering.png', '@{app-image-path}/toolbar/multilevels-numbering@2x.png', 74px);
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
}
|
||||
|
||||
|
||||
.color-schemas-menu {
|
||||
span {
|
||||
&.colors {
|
||||
display: inline-block;
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
&.color {
|
||||
display: inline-block;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
margin-right: 2px;
|
||||
border: 1px solid rgba(0, 0, 0, 0.2);
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
&.text {
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
// page number position
|
||||
.menu-pageposition {
|
||||
.dataview {
|
||||
width: 125px;
|
||||
height: 85px;
|
||||
margin: 0 auto;
|
||||
|
||||
&.disabled {
|
||||
> div:not(.grouped-data):not(.ps-scrollbar-x-rail):not(.ps-scrollbar-y-rail) {
|
||||
cursor: default;
|
||||
opacity: 0.5;
|
||||
|
||||
&:hover {
|
||||
.box-shadow(0 0 0 1px @gray);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-pagenumber {
|
||||
.background-ximage('@{app-image-path}/toolbar/colontitules.png', '@{app-image-path}/toolbar/colontitules@2x.png', 33px);
|
||||
width: 33px;
|
||||
height: 33px;
|
||||
}
|
||||
}
|
||||
|
||||
// menu zoom
|
||||
.menu-zoom {
|
||||
.title {
|
||||
padding: 5px 0 5px 20px;
|
||||
float: left;
|
||||
max-width: 95px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.zoom {
|
||||
padding: 5px 3px;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
// charts
|
||||
.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}/toolbar/charttypes.png', '@{app-image-path}/toolbar/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;
|
||||
}
|
||||
|
||||
|
||||
@toolbar-icon-size: 20px;
|
||||
.toolbar-btn-icon(btn-align-center, 0, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-align-just, 1, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-align-left, 2, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-align-right, 3, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-bold, 5, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-pagebreak, 6, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-clearstyle, 7, @toolbar-icon-size);
|
||||
//.toolbar-btn-icon(btn-editheader, 8, @toolbar-icon-size); // dublicate !!! index-39
|
||||
.toolbar-btn-icon(btn-copy, 9, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-copystyle, 10, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-decoffset, 11, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-decfont, 12, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-paracolor, 13, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-fontcolor, 14, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-incoffset, 15, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-incfont, 16, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-insertimage, 17, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-inserttable, 18, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-italic, 19, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-linespace, 20, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-setmarkers, 21, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-multilevels, 22, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-numbering, 23, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-pageorient, 24, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-pagesize, 25, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-paste, 26, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-print, 27, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-redo, 28, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-save, 29, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-highlight, 31, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-strikeout, 32, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-subscript, 33, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-superscript, 34, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-underline, 35, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-undo, 36, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-hidenchars, 37, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-inserthyperlink, 38, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-editheader, 39, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-synch, 42, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-save-coauth, 41, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-insertshape, 43, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-colorschemas, 44, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-insertchart, 45, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-text, 46, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-hidebars, 47, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-settings, 48, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-dropcap, 50, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-insertequation, 53, @toolbar-icon-size);
|
||||
//.toolbar-btn-icon(btn-bold, 5, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-zoomin, 57, @toolbar-icon-size);
|
||||
.toolbar-btn-icon(btn-zoomout, 58, @toolbar-icon-size);
|
||||
|
||||
@menu-icon-size: 22px;
|
||||
.menu-btn-icon(mnu-wrap-inline, 0, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-square, 1, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-tight, 2, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-through, 3, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-topAndBottom, 4, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-inFront, 5, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-wrap-behind, 6, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-front, 7, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-back, 8, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-forward, 9, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-backward, 10, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-group, 11, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-arrange-ungroup, 12, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-left, 13, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-center, 14, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-right, 15, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-top, 16, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-middle, 17, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-img-align-bottom, 18, @menu-icon-size);
|
||||
//.menu-btn-icon(mnu-, 19, @menu-icon-size);
|
||||
//.menu-btn-icon(mnu-, 20, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-align-center, 21, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-align-just, 22, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-align-left, 23, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-align-right, 24, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-dropcap-none, 25, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-dropcap-intext, 26, @menu-icon-size);
|
||||
.menu-btn-icon(mnu-dropcap-inmargin, 27, @menu-icon-size);
|
||||
|
||||
.username-tip {
|
||||
background-color: #ee3525;
|
||||
border: none;
|
||||
border-radius: 0;
|
||||
padding: 2px 10px;
|
||||
color: #ffffff;
|
||||
font-family: arial;
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#id-toolbar-menu-auto-fontcolor > a.selected {
|
||||
span {
|
||||
outline: 1px solid #000;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.item-equation {
|
||||
border: 1px solid @gray;
|
||||
.background-ximage('@{app-image-path}/toolbar/math.png', '@{app-image-path}/toolbar/math@2x.png', 1500px);
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
//
|
||||
// Variables
|
||||
// --------------------------------------------------
|
||||
|
||||
// Active color
|
||||
// -------------------------
|
||||
@blue-darker: #00f;
|
||||
@blue-dark: #5170b5;
|
||||
@blue: #5a7dc9;
|
||||
@blue-light: #6b8acf;
|
||||
@blue-lighter: #00f;
|
||||
|
||||
@brand-active: @blue-dark;
|
||||
@brand-active-light: @blue-light;
|
||||
|
||||
// Header
|
||||
// -------------------------
|
||||
@app-header-height: 20px;
|
||||
@app-header-bg-color: @blue;
|
||||
@app-header-bg-color-dark: @blue-dark;
|
||||
@app-header-bg-color-light: @blue-light;
|
||||
Reference in New Issue
Block a user