Skip to content

K
kityminder-core
Commit 2f0d4154 authored by techird's avatar techird
Browse files
Options

修改UI，增大编辑区域

parent 97ff6c53
Hide whitespace changes
Inline Side-by-side
Showing with 145 additions and 48 deletions
index.html
View file @ 2f0d4154
......@@ -34,7 +34,6 @@
</head>
<body>
<h1 id="title">百度脑图</h1>
<div id="panel"></div>
<div id="kityminder" onselectstart="return false"></div>
......@@ -55,14 +54,49 @@
</p>
</div>
<p id="about">
KityMinder <a id="km-version" href="https://github.com/fex-team/kityminder/blob/dev/CHANGELOG.md" target="blank"></a> under <a href="https://raw.githubusercontent.com/fex-team/kityminder/dev/LICENSE" target="_blank">BSD License</a>. Powered by f-cube, <a href="http://fex.baidu.com" target="_blank">FEX</a> |
<a href="https://github.com/fex-team/kityminder.git" target="_blank">Source</a>
<a href="https://github.com/fex-team/kityminder/issues/new" target="_blank">Bug</a> |
<a href="mailto:kity@baidu.com" target="_blank">Contact Us</a>
</p>
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdMini":"2","bdMiniList":[],"bdPic":"","bdStyle":"1","bdSize":"32"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
<div id="about">
<svg id="km-cat" viewBox="0 0 1200 1200" width="32px" height="32px">
<g id="cat-face">
<path d="M1066.769,368.482L1119.5,80L830,131.611C760.552,97.29,682.35,77.999,599.641,77.999
c-82.424,0-160.371,19.161-229.641,53.26L81,81l50.769,289l0,0c-33.792,69.019-52.77,146.612-52.77,228.641
c0,287.542,233.099,520.642,520.642,520.642s520.642-233.099,520.642-520.642C1120.282,516.011,1101.028,437.88,1066.769,368.482z"
/>
</g>
<g id="cat-eye">
<path style="fill:#FFFFFF;" d="M920.255,371C794.746,371,693,472.746,693,598.255s101.746,227.255,227.255,227.255
s227.255-101.746,227.255-227.255S1045.765,371,920.255,371z M920,746c-80.081,0-145-64.919-145-145s64.919-145,145-145
s145,64.919,145,145S1000.081,746,920,746z"/>
<path style="fill:#FFFFFF;" d="M276.255,371C150.746,371,49,472.746,49,598.255s101.746,227.255,227.255,227.255
s227.255-101.746,227.255-227.255S401.765,371,276.255,371z M276,745c-80.081,0-145-64.919-145-145s64.919-145,145-145
s145,64.919,145,145S356.081,745,276,745z"/>
</g>
</svg>
KityMinder
<a id="km-version"
href="https://github.com/fex-team/kityminder/blob/dev/CHANGELOG.md"
target="blank">
</a>
under
<a href="https://raw.githubusercontent.com/fex-team/kityminder/dev/LICENSE"
target="_blank">BSD License
</a>.
Powered by f-cube,
<a href="http://fex.baidu.com"
target="_blank">FEX
</a> |
<a href="https://github.com/fex-team/kityminder.git"
target="_blank">Source
</a>
<a href="https://github.com/fex-team/kityminder/issues/new"
target="_blank">Bug
</a> |
<a href="mailto:kity@baidu.com"
target="_blank">Contact Us
</a>
</div>
</body>
<!--脑图启动代码-->
<script>
// create km instance
km = KM.getKityMinder('kityminder');
......@@ -92,13 +126,15 @@
});
</script>
<!--社会分享代码-->
<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdMini":"2","bdMiniList":[],"bdPic":"","bdStyle":"1","bdSize":"32"},"share":{}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];
</script>
<!--Baidu Tongji Code-->
<script type="text/javascript">
if (document.domain == 'naotu.baidu.com') {
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3F0703917f224067c887f3664479a03887' type='text/javascript'%3E%3C/script%3E"));
}
</script>
</html>
\ No newline at end of file
social/social.css
View file @ 2f0d4154
.niceblue{color:#fff;background:-moz-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #0099f2), color-stop(0, #4096ee), color-stop(100%, #0076dd));background:-webkit-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-o-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-ms-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:linear-gradient(to bottom, #0099f2 0, #4096ee 0, #0076dd 100%);}
.dropdown{padding-right:28px;position:relative}.dropdown:after{content:' ';display:block;position:absolute;right:10px;top:12px;width:0;height:0;border:solid;border-width:4px 5px;border-color:#333 transparent transparent transparent}
.dropdown:active:after,.dropdown.active:after{border-color:#fff transparent transparent transparent}
button{font-family:Arial,"Heiti SC","Microsoft Yahei";outline:none;display:inline-block;vertical-align:middle;/* font-size: 12px; */padding:0 15px;height:30px;font-size: 12px;line-height:30px;text-align:center;color:#000;text-decoration:none;border:none;margin-left:5px;background:none;border-radius:2px;color:#fff;background:-moz-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #0099f2), color-stop(0, #4096ee), color-stop(100%, #0076dd));background:-webkit-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-o-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-ms-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:linear-gradient(to bottom, #0099f2 0, #4096ee 0, #0076dd 100%);}button:hover,button.hover{background:#009fff}
button{font-family:Arial,"Heiti SC","Microsoft Yahei";outline:none;display:inline-block;vertical-align:middle;/* font-size: 12px; */padding:0 15px;height:30px;font-size: 12px;line-height:30px;text-align:center;color:#000;text-decoration:none;border:none;margin-left:5px;background:none;border-radius: 0px;color:#fff;background:-moz-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #0099f2), color-stop(0, #4096ee), color-stop(100%, #0076dd));background:-webkit-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-o-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:-ms-linear-gradient(top, #0099f2 0, #4096ee 0, #0076dd 100%);background:linear-gradient(to bottom, #0099f2 0, #4096ee 0, #0076dd 100%);}button:hover,button.hover{background:#009fff}
button:active,button.active{background:#007fcc;box-shadow:inset 0 2px 3px rgba(0,0,0,0.2)}
button[disabled]{cursor:default;background:#ccc}
.draft-menu.kmui-dropdown-menu{margin-top:24px;margin-left:1px}.draft-menu.kmui-dropdown-menu span.update-time{float:right;color:#ccc;margin-left:20px;padding-right:16px}
......
social/social.js
View file @ 2f0d4154
......@@ -109,7 +109,7 @@ $(function() {
$menu = $('<div id="menu"></div>').appendTo($panel);
$user = $('<div id="user"></div>').appendTo($panel);
$title = $('h1#title');
$title = $('<h1 id="title"></h1>').appendTo($panel);
$file_btn = $('<button id="file-btn">文件</button>').addClass('dropdown').appendTo($menu);
......
themes/default/css/kityminder.css
View file @ 2f0d4154
......@@ -16,8 +16,8 @@ html, body, #kityminder, div.kmui-editor-body {
}
#title {
height: 29px;
line-height: 27px;
height: 40px;
line-height: 40px;
padding: 0;
margin: 0;
padding: 0;
......@@ -29,36 +29,44 @@ html, body, #kityminder, div.kmui-editor-body {
}
#panel {
height: 50px;
height: 40px;
overflow: visible;
padding: 0 15px;
position: relative;
border-bottom: 10px solid #5a6378;
border-bottom: 8px solid #5A6378;
}
#panel button {
font-size: 14px;
height: 40px;
line-height: 50px;
padding-left: 45px;
height: 24px;
line-height: 28px;
padding-right: 7px;
padding-left: 30px;
cursor: pointer;
color: #a3a6ae;
margin: 0 15px;
margin: 0 8px;
background: url(../images/menu-icons.png) no-repeat;
vertical-align: middle;
margin-top: -3px;
}
#menu, #user {
height: 45px;
height: 40px;
line-height: 40px;
}
#menu {
float: left;
flo
}
#panel button:hover, #panel button.active {
color: white;
box-shadow: none;
}
button.dropdown {
padding-right: 28px;
padding-right: 28px !important;
position: relative;
}
button.dropdown:after {
......@@ -66,7 +74,7 @@ button.dropdown:after {
display: block;
position: absolute;
right: 10px;
top: 23px;
top: 12px;
width: 0;
height: 0;
border: solid;
......@@ -78,34 +86,48 @@ button.dropdown:hover:after, button.dropdown.active:after {
}
#file-btn:hover, #file-btn.active {
background-position: 0 -40px;
background-position: 0 -24px;
}
button#tool-btn {
background-position: 0 -80px;
background-position: 0 -48px;
}
#tool-btn:hover, #tool-btn.active {
background-position: 0 -120px;
background-position: 0 -72px;
}
#tool-btn.active:after {
content: ' ';
display: block;
position: absolute;
top: 32px;
top: 21px;
left: 27px;
width: 0;
height: 0;
border: solid;
border-width: 14px 15px;
border-width: 11px 11px;
border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #FFF rgba(0, 0, 0, 0);
}
#panel button#tool-btn.active {
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2), inset 0 -1px 2px rgba(255, 255, 255, .1);
background-color: #677085;
border: 1px solid #2E2E2E;
/* padding-top: 10px; */
/* padding-bottom: 10px; */
height: 28px;
margin-top: -1px;
margin-left: 7px;
position: relative;
}
#user {
position: absolute;
top: 0;
right: 10px;
/* position: absolute; */
/* top: 0; */
/* right: 10px; */
float: right;
}
#user-btn, #logout-btn, #user.logined #login-btn {
......@@ -122,19 +144,21 @@ button#user-btn {
}
button#user-btn, button#login-btn {
background-position: 0 -160px;
background-position: 0 -96px;
}
button#user-btn:hover, button#login-btn:hover {
background-position: 0 -200px;
button#user-btn:hover, button#login-btn:hover,
button#user-btn.active, button#login-btn.active {
background-position: 0 -120px;
}
#user-btn img {
position: absolute;
left: 5px;
top: 5px;
width: 30px;
height: 30px;
left: 4px;
top: 4px;
width: 18px;
height: 18px;
/* display: none; */
}
button#logout-btn {
......@@ -144,12 +168,12 @@ button#logout-btn {
}
button#draft-btn {
background-position: 0 -240px;
background-position: 0 -144px;
}
button#draft-btn:hover,
button#draft-btn.active {
background-position: 0 -280px;
background-position: 0 -168px;
}
li#manage-file-button {
......@@ -170,17 +194,17 @@ li#manage-file-button:hover:before {
}
button#share-btn {
background-position: 0 -320px;
background-position: 0 -192px;
}
button#share-btn:hover {
background-position: 0 -360px;
background-position: 0 -216px;
}
#kityminder {
position: absolute;
left: 0;
top: 89px;
top: 48px;
right: 0;
bottom: 0;
}
......@@ -227,9 +251,8 @@ svg, body {
position:absolute;
bottom: 0;
right: 0;
left: 0;
height: 50px;
line-height: 50px;
height: 40px;
line-height: 40px;
background: #5d697a;
color: #eee;
font-family:Arial;
......@@ -237,13 +260,34 @@ svg, body {
font-weight:normal;
margin:0;
text-align: right;
padding: 0 15px;
padding: 0 15px 0 60px;
border-bottom: 5px solid #393F4F;
padding-left: 5px;
-webkit-font-smoothing: antialiased;
position: absolute;
transition: all ease .3s 0.3s;
-webkit-transform: translate(100%);
}
#about:hover {
-webkit-transform: translate(0);
}
#about a {
color: #eee;
}
#about #km-cat {
position: absolute;
left: 15px;
top: 5px;
transition: all ease 1.3s 0.3s;
-webkit-transform: translate(-60px, 0);
cursor: pointer;
}
#about:hover #km-cat {
-webkit-transform: translate(0);
}
#about #cat-face {
fill: #393F4F;
}
#km-version.new-version{position:relative;padding-right:30px}
#km-version.new-version:after{content:'NEW';color:#ff0;position:absolute;top:-10px;right:-5px;display:block;background:#f00;padding:0 5px;border-radius:4px;text-shadow:none;box-shadow:-1px 1px 3px rgba(0,0,0,0.3);-webkit-transform:scale(.6);-moz-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6)}
themes/default/images/kmcat.svg 0 → 100644
View file @ 2f0d4154
<svg viewBox="0 0 1200 1200" width="32px" height="32px">
<g id="cat-face">
<path style="fill:#272B2D;" d="M1066.769,368.482L1119.5,80L830,131.611C760.552,97.29,682.35,77.999,599.641,77.999
c-82.424,0-160.371,19.161-229.641,53.26L81,81l50.769,289l0,0c-33.792,69.019-52.77,146.612-52.77,228.641
c0,287.542,233.099,520.642,520.642,520.642s520.642-233.099,520.642-520.642C1120.282,516.011,1101.028,437.88,1066.769,368.482z"
/>
</g>
<g id="cat-eye">
<path style="fill:#FFFFFF;" d="M920.255,371C794.746,371,693,472.746,693,598.255s101.746,227.255,227.255,227.255
s227.255-101.746,227.255-227.255S1045.765,371,920.255,371z M920,746c-80.081,0-145-64.919-145-145s64.919-145,145-145
s145,64.919,145,145S1000.081,746,920,746z"/>
<path style="fill:#FFFFFF;" d="M276.255,371C150.746,371,49,472.746,49,598.255s101.746,227.255,227.255,227.255
s227.255-101.746,227.255-227.255S401.765,371,276.255,371z M276,745c-80.081,0-145-64.919-145-145s64.919-145,145-145
s145,64.919,145,145S356.081,745,276,745z"/>
</g>
</svg>
themes/default/images/menu-icons.png
View replaced file @ 97ff6c53 View file @ 2f0d4154
themes/default/images/menu-icons.png

4.51 KB | W: | H:

themes/default/images/menu-icons.png

2.92 KB | W: | H:

themes/default/images/menu-icons.png
themes/default/images/menu-icons.png
themes/default/images/menu-icons.png
themes/default/images/menu-icons.png
  • 2-up
  • Swipe
  • Onion skin
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment