forked from x/volcanos
opt css
This commit is contained in:
harveyshao
parent
6014ea052e
commit
258cfff654
2
frame.js
2
frame.js
@ -235,7 +235,7 @@ Volcanos("onappend", {help: "渲染引擎", list: [], _init: function(can, meta,
|
||||
can.base.isUndefined(can._daemon) && can.ondaemon._list[0] && (can._daemon = can.ondaemon._list.push(can)-1)
|
||||
if (can._daemon) { msg._daemon = can._daemon }
|
||||
}
|
||||
if (meta.index.indexOf("can.") == 0) {
|
||||
if (meta && meta.index && meta.index.indexOf("can.") == 0) {
|
||||
can.onengine._plugin(event, can, msg, can, can.misc.concat(can, [meta.index], cmds), function(msg) {
|
||||
if (can.base.isFunc(cb)) { can.core.CallFunc(cb, {can: can, msg: msg}); return }
|
||||
!silent && can.onappend._output(can, msg, msg.Option(ice.MSG_DISPLAY)||meta.display||meta.feature.display)
|
||||
|
||||
@ -33,7 +33,7 @@ td>input[type=button][name=remove] { background-color:red; }
|
||||
td>input[type=button][name=start] { background-color:blue; }
|
||||
td>input[type=button][name=stop] { background-color:red; }
|
||||
|
||||
div.tabs { background-color:#00000038; color:white; padding:4px; margin:0 1px; }
|
||||
div.tabs { background-color:#00000038; color:white; padding:5px; margin:0 1px; }
|
||||
div.code { background-color:#343a3445; color:white; padding:10px; border:solid 3px green; }
|
||||
div.story[data-type=spark] { background-color:#2169a9a6; color:white; padding:4px 10px; border-left:solid 4px blue; margin:10px 0px; }
|
||||
|
||||
@ -61,11 +61,11 @@ div.output td.project div.project div.list { margin-left:10px; }
|
||||
div.output td.profile { background-color:#71909c91; }
|
||||
div.status>div.item { padding:4px; height:18px; }
|
||||
|
||||
fieldset.plugin { background-color:#061c3c9e; padding:10px; margin:10px; }
|
||||
fieldset.Action>div.output>fieldset.plugin { background-color:#061c3c9e; padding:10px; margin:10px; }
|
||||
fieldset.plugin div.status { border-top:1px solid darkcyan; }
|
||||
fieldset.story div.status { border-top:1px solid darkcyan; }
|
||||
fieldset.float { background-color:#023531cf; padding:0px; margin:0px; }
|
||||
fieldset.float>div.action { display:block; height:2.3rem; }
|
||||
fieldset.float { background-color:#023531cf; }
|
||||
/* fieldset.float>div.action { display:block; height:2.3rem; } */
|
||||
fieldset.float table { color:white; }
|
||||
|
||||
fieldset.output>form.option { display:none; }
|
||||
@ -172,7 +172,7 @@ form.option, div.action { display:contents; }
|
||||
.hide, .hidden, form.option>div.item>label, div.action>div.item>label, fieldset.panel>legend, fieldset.output>legend, fieldset.input>legend { display:none; }
|
||||
div.output, div.status, div.content, div.project div.item, div.item.textarea, div.code, div.story[data-type=spark], p.story, h1, h2, h3 { clear:both; }
|
||||
form.option, form.option>div.item, div.action, div.action>div.item, div.action>div.tabs, div.project, div.status>div.item, fieldset.float>legend { float:left; }
|
||||
div.code, div.story, div.action, div.output, div.project, div.content, div.profile, div.display, table.content, table.content td, body>div.toast { overflow:auto; }
|
||||
div.code, div.story, div.action, div.output, div.status, div.project, div.content, div.profile, div.display, table.content, table.content td, body>div.toast { overflow:auto; }
|
||||
div.code, div.story, div.item, div.content, table.content, textarea { white-space:pre; }
|
||||
div.code, div.story, div.item { text-align:left; }
|
||||
|
||||
@ -184,7 +184,7 @@ div.title, div.story[data-type=spark] { cursor:copy; }
|
||||
/* box-shadow */
|
||||
fieldset.plugin { box-shadow:2px 2px 10px 4px #626bd0; }
|
||||
fieldset.plugin:hover { box-shadow:4px 4px 12px 6px #626bd0; }
|
||||
fieldset.story { border:0; margin:10px; clear:both; float:left; box-shadow:4px 4px 10px 1px #626bd0; }
|
||||
fieldset.story { clear:both; float:left; box-shadow:4px 4px 10px 1px #626bd0; }
|
||||
fieldset.story:hover { box-shadow:12px 12px 12px 6px #5764efd1; }
|
||||
div.story[data-type=spark] { box-shadow:4px 4px 10px 1px #626bd0; }
|
||||
div.story[data-type=spark] span:hover { background-color:deepskyblue; box-shadow:4px 4px 20px 4px #29318e; }
|
||||
|
||||
@ -1,28 +1,8 @@
|
||||
fieldset.div div.output td {
|
||||
vertical-align:top;
|
||||
}
|
||||
fieldset.div div.output fieldset.span>fieldset {
|
||||
float:left; overflow:auto;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div {
|
||||
padding:0;
|
||||
margin:0;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div>legend {
|
||||
display:none;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div>form.option {
|
||||
display:none;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div>div.action {
|
||||
display:none;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div div.project {
|
||||
display:none;
|
||||
}
|
||||
fieldset.panel.cmd.main fieldset.div div.profile {
|
||||
display:none;
|
||||
}
|
||||
fieldset.word>div.output fieldset.span>fieldset {
|
||||
float:left; overflow:auto;
|
||||
}
|
||||
fieldset.div div.output td { vertical-align:top; }
|
||||
fieldset.div div.output fieldset.span>fieldset { overflow:auto; float:left; }
|
||||
fieldset.panel.cmd.main fieldset.div>legend { display:none; }
|
||||
fieldset.panel.cmd.main fieldset.div>form.option { display:none; }
|
||||
fieldset.panel.cmd.main fieldset.div>div.action { display:none; }
|
||||
fieldset.panel.cmd.main fieldset.div div.project { display:none; }
|
||||
fieldset.panel.cmd.main fieldset.div div.profile { display:none; }
|
||||
fieldset.word>div.output fieldset.span>fieldset { overflow:auto; float:left; }
|
||||
|
||||
@ -1,195 +1,52 @@
|
||||
fieldset.inner.output.simple>legend {
|
||||
display:block;
|
||||
}
|
||||
fieldset.inner>form.option input[name=path] {
|
||||
width:80px;
|
||||
}
|
||||
fieldset.inner>form.option input[name=file] {
|
||||
width:160px;
|
||||
}
|
||||
fieldset.inner>div.action {
|
||||
height:2rem;
|
||||
overflow:hidden;
|
||||
display:block;
|
||||
}
|
||||
fieldset.inner>form.option input[name=path] { width:80px; }
|
||||
fieldset.inner>form.option input[name=file] { width:160px; }
|
||||
fieldset.inner>div.output { color:white; }
|
||||
fieldset.inner>div.output>table.layout div.toggle.project { font-size:24px; min-width:15px; }
|
||||
fieldset.inner>div.output>table.layout div.toggle.profile { font-size:24px; min-width:15px; }
|
||||
fieldset.inner>div.output>table.layout div.toggle.display { font-size:24px; height:15px; margin-top:-17px; }
|
||||
|
||||
fieldset.inner>div.output {
|
||||
color:white;
|
||||
}
|
||||
fieldset.inner>div.output div.code {
|
||||
height:-webkit-fill-available;
|
||||
}
|
||||
fieldset.inner>div.output>table.layout div.toggle.project {
|
||||
min-width:15px; font-size:24px;
|
||||
}
|
||||
fieldset.inner>div.output>table.layout div.toggle.profile {
|
||||
min-width:15px; font-size:24px;
|
||||
}
|
||||
fieldset.inner>div.output>table.layout div.toggle.display {
|
||||
height:15px; font-size:24px;
|
||||
margin-top:-17px;
|
||||
}
|
||||
fieldset.inner>div.output div.project {
|
||||
max-width:180px; overflow:auto;
|
||||
}
|
||||
fieldset.inner>div.output div.content {
|
||||
position:relative;
|
||||
padding-right:25px;
|
||||
font-size:1.2rem; font-family:monospace;
|
||||
overflow:auto;
|
||||
color:white;
|
||||
}
|
||||
fieldset.inner>div.output div.content table.layout {
|
||||
width:-webkit-fill-available;
|
||||
}
|
||||
fieldset.inner>div.output div.content tr.select {
|
||||
background-color:#0000ff6b;
|
||||
}
|
||||
fieldset.inner>div.output div.content tr.select td.line {
|
||||
background-color:blue;
|
||||
border:solid 1px red;
|
||||
border-right:solid 2px red;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.line:hover {
|
||||
background-color:green;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.line {
|
||||
text-align:right; padding:0 6px;
|
||||
border-right:solid 2px red;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text {
|
||||
text-align:left; height:20px;
|
||||
padding-left:10px;
|
||||
white-space:pre;
|
||||
tab-size:4;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.comment {
|
||||
color:cyan; background-color:blue;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.keyword {
|
||||
color:yellow; font-weight:bold;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.function {
|
||||
color:cyan; font-weight:bold;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.datatype {
|
||||
color:lightgreen; font-weight:bold;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.constant {
|
||||
color:magenta;
|
||||
}
|
||||
fieldset.inner>div.output div.content td.text span.string {
|
||||
color:magenta;
|
||||
}
|
||||
fieldset.inner>div.output div.display>div.action>div.item {
|
||||
float:left;
|
||||
}
|
||||
fieldset.inner>div.output div.profile>div.action>div.item {
|
||||
float:left;
|
||||
}
|
||||
fieldset.inner>div.output div.profile>div.output {
|
||||
clear:both; overflow:auto;
|
||||
}
|
||||
fieldset.inner>div.output div.profile>div.output>fieldset {
|
||||
margin:0; padding:0;
|
||||
}
|
||||
fieldset.inner>div.output div.profile>div.output>fieldset>legend {
|
||||
float:left; padding:0.3rem;
|
||||
}
|
||||
fieldset.inner>div.output div.display>div.output {
|
||||
clear:both; overflow:auto;
|
||||
}
|
||||
fieldset.inner>div.output div.display {
|
||||
border:solid 1px greenyellow;
|
||||
}
|
||||
fieldset.inner>div.output div.content { color:white; font-size:1.2rem; font-family:monospace; position:relative; }
|
||||
fieldset.inner>div.output div.content tr.select { background-color:#0000ff6b; }
|
||||
fieldset.inner>div.output div.content tr.select td.line { background-color:blue; border:solid 1px red; border-right:solid 2px red; }
|
||||
fieldset.inner>div.output div.content td.line:hover { background-color:green; }
|
||||
fieldset.inner>div.output div.content td.line { text-align:right; padding:0 6px; border-right:solid 2px red; }
|
||||
fieldset.inner>div.output div.content td.text { text-align:left; white-space:pre; padding-left:10px; height:20px; }
|
||||
fieldset.inner>div.output div.content td.text span.comment { background-color:blue; color:cyan; }
|
||||
fieldset.inner>div.output div.content td.text span.keyword { color:yellow; font-weight:bold; }
|
||||
fieldset.inner>div.output div.content td.text span.datatype { color:lightgreen; font-weight:bold; }
|
||||
fieldset.inner>div.output div.content td.text span.function { color:cyan; font-weight:bold; }
|
||||
fieldset.inner>div.output div.content td.text span.constant { color:magenta; }
|
||||
fieldset.inner>div.output div.content td.text span.string { color:magenta; }
|
||||
fieldset.inner>div.output div.profile>div.output>fieldset>legend { padding:0.1rem; float:left; }
|
||||
fieldset.inner>div.output div.display { border:solid 1px greenyellow; }
|
||||
|
||||
fieldset.inner div.output fieldset.toolkit {
|
||||
position:absolute;
|
||||
bottom:0px; right:0px;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset {
|
||||
display:none; margin:0;padding:0;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset.select {
|
||||
display:block;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset>legend {
|
||||
float:left;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status {
|
||||
/* height:32px; overflow:auto; */
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend {
|
||||
float:right; padding:4px; cursor:pointer;
|
||||
padding:4px 4px; border-left:solid 2px red;
|
||||
background:#0d969f8a;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend.select {
|
||||
background:green;
|
||||
}
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend:hover {
|
||||
background:green;
|
||||
}
|
||||
fieldset.inner>div.status {
|
||||
height:26px; overflow:auto;
|
||||
}
|
||||
fieldset.Action fieldset.inner>div.status legend {
|
||||
float:right;
|
||||
font-size:1.1rem;
|
||||
/* padding:4px; */
|
||||
cursor:pointer;
|
||||
/* padding:4px 4px; */
|
||||
border-left:solid 2px red;
|
||||
background:#0d969f8a;
|
||||
padding:0px 10px;
|
||||
}
|
||||
fieldset.Action fieldset.inner>div.status legend.select {
|
||||
background-color:red;
|
||||
}
|
||||
fieldset.inner>div.status legend.select {
|
||||
background:green;
|
||||
}
|
||||
fieldset.inner>div.status legend:hover {
|
||||
background:green;
|
||||
}
|
||||
fieldset.inner div.output fieldset.toolkit { position:absolute; bottom:0px; right:0px; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset { display:none; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset.select { display:block; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.output>fieldset>legend { float:left; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend { background:#0d969f8a; padding:4px 4px; border-left:solid 2px red; float:right; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend.select { background:green; }
|
||||
fieldset.inner>div.output fieldset.toolkit>div.status>legend:hover { background:green; }
|
||||
fieldset.inner>div.status { height:26px; }
|
||||
fieldset.inner>div.status legend { background:#0d969f8a; font-size:1.1rem; padding:0px 10px; border-left:solid 2px red; cursor:pointer; float:right; }
|
||||
fieldset.inner>div.status legend.select { background:green; }
|
||||
fieldset.inner>div.status legend:hover { background:green; }
|
||||
|
||||
fieldset.inner.full>legend {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>div.action {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>form.option {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>div.status {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>div.status {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>div.output div.profile>div.action {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.full>div.output div.display>div.action {
|
||||
display:none;
|
||||
}
|
||||
fieldset.inner.output.simple>legend { display:block; }
|
||||
fieldset.inner.float div.output { background-color:#332f1ecf; }
|
||||
fieldset.inner.float div.status { color:white; }
|
||||
|
||||
body.white fieldset.inner>div.output div.project {
|
||||
color:#a2dad2;
|
||||
}
|
||||
body.white fieldset.inner>div.output div.content {
|
||||
background-color:#013b675c;
|
||||
}
|
||||
body.white fieldset.inner>div.output div.content tr {
|
||||
background-color:#e1f1ff00;
|
||||
}
|
||||
body.white fieldset.inner>div.output div.content tr.select {
|
||||
background-color:#0000ff6b;
|
||||
}
|
||||
body.white fieldset.inner>div.output div.content td.text span.string {
|
||||
color:#a703a7;
|
||||
}
|
||||
fieldset.inner.full>legend { display:none; }
|
||||
fieldset.inner.full>form.option { display:none; }
|
||||
fieldset.inner.full>div.action { display:none; }
|
||||
fieldset.inner.full>div.status { display:none; }
|
||||
fieldset.inner.full>div.output div.profile>div.action { display:none; }
|
||||
fieldset.inner.full>div.output div.display>div.action { display:none; }
|
||||
fieldset.inner.full>div.output div.display>div.status { display:none; }
|
||||
|
||||
body.white fieldset.inner>div.output div.project { color:#a2dad2; }
|
||||
body.white fieldset.inner>div.output div.content { background-color:#013b675c; }
|
||||
body.white fieldset.inner>div.output div.content td.text span.string { color:#a703a7; }
|
||||
|
||||
.unselectable {
|
||||
-webkit-touch-callout:none;
|
||||
@ -201,6 +58,3 @@ body.white fieldset.inner>div.output div.content td.text span.string {
|
||||
user-select:none;
|
||||
}
|
||||
|
||||
fieldset.inner.float div.output { background-color:#332f1ecf; }
|
||||
fieldset.inner.float div.status { color:white; }
|
||||
|
||||
|
||||
@ -184,7 +184,7 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
|
||||
},
|
||||
layout: function(can) { var height = can.ConfHeight()-(can.user.mod.isCmd && can.user.isWindows? 20: 0), width = can.ConfWidth()
|
||||
can.page.styleWidth(can, can.ui.profile_output, can.profile_size[can.onexport.keys(can)]||(width-can.ui.project.offsetWidth)/2)
|
||||
can.page.styleWidth(can, can.ui.content, width-can.ui.project.offsetWidth-can.ui.profile.offsetWidth-26)
|
||||
can.page.styleWidth(can, can.ui.content, width-can.ui.project.offsetWidth-can.ui.profile.offsetWidth)
|
||||
|
||||
if (!height) { return }
|
||||
can.page.style(can, can.ui.content, can.user.mod.isCmd? html.HEIGHT: html.MAX_HEIGHT, height)
|
||||
@ -196,8 +196,7 @@ Volcanos("onimport", {help: "导入数据", _init: function(can, msg, cb, target
|
||||
}
|
||||
}
|
||||
if (can.user.mod.isCmd) {
|
||||
can.page.styleHeight(can, can.ui.content, (can.ui.project.offsetHeight||height)
|
||||
-can.ui.display.offsetHeight-(can.ui.display.style.display != html.NONE && can.ui.display_status.innerText? html.ACTION_HEIGHT: 0))
|
||||
can.page.styleHeight(can, can.ui.content, (can.ui.project.offsetHeight||height)-can.ui.display.offsetHeight)
|
||||
}
|
||||
|
||||
if (can.page.ClassList.has(can, can._fields, "full")) {
|
||||
|
||||
@ -1,14 +1,3 @@
|
||||
fieldset.draw div.output {
|
||||
background-color:#1b5b738c;
|
||||
font-size:20px;
|
||||
}
|
||||
fieldset.draw div.output div.content svg {
|
||||
background-color:#1b5b738c;
|
||||
}
|
||||
fieldset.draw div.output div.profile div.action div.item {
|
||||
float:left;
|
||||
}
|
||||
fieldset.draw div.output div.display {
|
||||
max-height:400px;
|
||||
overflow:auto;
|
||||
}
|
||||
fieldset.draw div.output { background-color:#1b5b738c; font-size:20px; }
|
||||
fieldset.draw div.output div.content svg { background-color:#1b5b738c; }
|
||||
fieldset.draw div.output div.display { max-height:400px; }
|
||||
|
||||
@ -1,15 +1,4 @@
|
||||
fieldset.feel div.output img {
|
||||
display:block; float:left;
|
||||
}
|
||||
fieldset.feel div.output video {
|
||||
display:block; float:left;
|
||||
}
|
||||
fieldset.feel.float>legend {
|
||||
display:none;
|
||||
}
|
||||
fieldset.feel.float {
|
||||
margin:0 10px; padding:0 10px;
|
||||
background-color:#4eaad0c2;
|
||||
position:absolute;
|
||||
top:26px;
|
||||
}
|
||||
fieldset.feel div.output img { display:block; float:left; }
|
||||
fieldset.feel div.output video { display:block; float:left; }
|
||||
fieldset.feel.float { background-color:#4eaad0c2; position:absolute; }
|
||||
fieldset.feel.float>legend { display:none; }
|
||||
|
||||
@ -87,14 +87,14 @@ Volcanos("ondetail", {help: "组件菜单", list: ["关闭", "下载", "删除",
|
||||
can.onappend._init(can, {type: "story feel float"}, [], function(sub) { can.sub = sub
|
||||
sub.run = function(event, cmds, cb) { return can.run(event, cmds, cb, true) }
|
||||
|
||||
sub.search({}, ["Action.onexport.size"], function(msg, left, top, width, height) {
|
||||
sub.getActionSize(function(msg, left, top, width, height) {
|
||||
sub.page.Modify(sub, sub._target, {style: {left: left, top: top}})
|
||||
sub.page.Modify(sub, sub._output, {style: {"max-width": width, "max-height": height}})
|
||||
sub.onappend._action(can, can.ondetail.list, sub._action, can.ondetail)
|
||||
|
||||
can.order = index, can.show = function(order) {
|
||||
path = can.onimport._file(can, can.list[order].path)
|
||||
sub.page.Appends(sub, sub._output, [{img: path, style: {"max-width": width-40, "max-height": height-55}}])
|
||||
sub.page.Appends(sub, sub._output, [{img: path, style: {"max-width": width, "max-height": height-2*html.ACTION_HEIGHT}}])
|
||||
sub.Status("begin", order+1+ice.PS+can.list.length), sub.Status("file", path)
|
||||
}, can.show(can.order)
|
||||
})
|
||||
|
||||
@ -14,6 +14,7 @@ fieldset.word p.story[data-name=inner] { background-color:#4b6c8a7a; padding:4px
|
||||
fieldset.word p.story[data-name=inner]:hover { background-color:#c10c8a; cursor:copy; }
|
||||
fieldset.word svg.story { display:block; float:left; }
|
||||
fieldset.word video.story { max-height:320px; }
|
||||
fieldset.word fieldset.story { margin:10px; }
|
||||
|
||||
fieldset.word.float { padding:0; margin:0; width:-webkit-fill-available; position:fixed; left:0; top:0; z-index:10; }
|
||||
fieldset.word.float>div.action { display:contents; }
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user