muzi
/
macUI
mirror of https://github.com/1099438829/macUI.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

修正finder高度问题 

修正 macUI 统一通知标题颜色,统一时间为星期*,关闭按钮右对齐
修正顶栏菜单 左上右上圆角非直角问题
修正默认字体问题
This commit is contained in:
muzi 2019-10-05 00:31:21 +08:00
parent db775b52f8
commit 0841281cb0
4 changed files with 272 additions and 256 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

415
app/finder/index.css
View File

@ -1,373 +1,392 @@
html{color:#000;background:#FFF;} blockquote,body,button,dd,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,hr,input,legend,li,ol,p,pre,td,textarea,th,ul {
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,
fieldset,input,textarea,p,blockquote,th,td {
margin: 0; margin: 0;
padding: 0; padding: 0;
font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
} }
body,button,input,select,textarea {
font: 9pt/1.5tahoma,arial,\5b8b\4f53
}
h1,h2,h3,h4,h5,h6 {
font-size: 100%
}
address,cite,dfn,em,var {
font-style: normal
}
code,kbd,pre,samp {
font-family: couriernew,courier,monospace
}
small {
font-size: 9pt
}
ol,ul {
list-style: none
}
a {
text-decoration: none
}
a:hover {
text-decoration: underline
}
sup {
vertical-align: text-top
}
sub {
vertical-align: text-bottom
}
legend {
color: #000
}
fieldset,img {
border: 0
}
button,input,select,textarea {
font-size: 100%
}
table { table {
border-collapse: collapse; border-collapse: collapse;
border-spacing:0; border-spacing: 0
} }
fieldset,img {
border:0; body,html {
} height: 100%
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}
* {
font-size: 12px;
} }
body { body {
overflow: hidden;
margin: 0;
background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-attachment: fixed; background-attachment: fixed;
background-repeat:no-repeat;
background-size:cover;
-moz-background-size: cover; -moz-background-size: cover;
-webkit-background-size:cover; -webkit-background-size: cover
overflow: hidden;
} }
a:focus { a:focus {
outline:none; outline: 0
} }
.app-list { .app-list {
position: relative; position: relative;
width: 100%; width: 100%;
height: 100%; height: 100%
} }
.clear { .clear {
clear: both; clear: both
} }
.finder-wrapper { .finder-wrapper {
width: 100%; width: 100%;
height: 100%; height: 100%
} }
.finder-wrapper .topbar { .finder-wrapper .topbar {
margin-top: 0;
width: 100%; width: 100%;
height: 30px; height: 30px;
background: #f6f6f6;
border-bottom: 1px solid #9a9a9a; border-bottom: 1px solid #9a9a9a;
margin-top: 0px; background: #f6f6f6
}
.finder-wrapper .topbar .next-prev-box {
float: left;
background: url(images/icons/next_prev.png) no-repeat;
width: 53px;
height: 24px;
margin-left: 5px;
margin-top:2px;
cursor: pointer;
} }
.finder-wrapper .topbar .sortstyle-box { .finder-wrapper .topbar .sortstyle-box {
float: left; float: left;
background: url(images/icons/sortstyle.png) no-repeat; margin-left: 105px;
width: 58px; width: 58px;
height: 24px; height: 24px;
margin-left: 105px; background: url(images/icons/sortstyle.png) no-repeat;
cursor: pointer; cursor: pointer
} }
.finder-wrapper .topbar .config-button { .finder-wrapper .topbar .config-button {
float: left; float: left;
background: url(images/icons/config.png) no-repeat; margin-left: 10px;
width: 40px; width: 40px;
height: 24px; height: 24px;
margin-left: 10px; background: url(images/icons/config.png) no-repeat;
cursor: pointer; cursor: pointer
} }
.finder-wrapper .topbar .higher-button { .finder-wrapper .topbar .higher-button {
float: left; float: left;
background: url(images/icons/higher.png) no-repeat; margin-left: 10px;
width: 40px; width: 40px;
height: 24px; height: 24px;
margin-left: 10px; background: url(images/icons/higher.png) no-repeat;
cursor: pointer; cursor: pointer
} }
.finder-wrapper .topbar .collection-button { .finder-wrapper .topbar .collection-button {
float: left; float: left;
background: url(images/icons/collection.png) no-repeat; margin-left: 10px;
width: 40px; width: 40px;
height: 24px; height: 24px;
margin-left: 10px; background: url(images/icons/collection.png) no-repeat;
cursor: pointer; cursor: pointer
} }
.finder-wrapper .topbar .search-box { .finder-wrapper .topbar .search-box {
float: right; float: right;
background: url(images/icons/search.png) no-repeat; margin-top: 2px;
margin-right: 5px;
width: 234px; width: 234px;
height: 24px; height: 24px;
margin-right: 5px; background: url(images/icons/search.png) no-repeat
margin-top:2px;
}
.finder-wrapper .topbar .next-prev-box .prev {
float: left;
display: block;
width: 25px;
height: 22px;
}
.finder-wrapper .topbar .next-prev-box .next {
float: right;
display: block;
width: 25px;
height: 22px;
} }
.finder-wrapper .main .content .app-box { .finder-wrapper .main .content .app-box {
text-align: center;
-moz-border-radius: 3px;
/* Gecko browsers*/
-webkit-border-radius: 3px;
/* Webkit browsers*/
border-radius:3px;
/* W3C syntax*/
z-index: 999; z-index: 999;
border-radius: 3px;
text-align: center
} }
.finder-wrapper .main .content .middle { .finder-wrapper .main .content .middle {
width: 80px; width: 5pc;
height: 100px; height: 75pt
float: left;
margin-left: 30px;
margin-top: 10px;
} }
.trash-wrapper .main .content .middle,.finder-wrapper .main .content .middle {
.finder-wrapper .main .content .middle,.trash-wrapper .main .content .middle {
float: left; float: left;
margin-left: 30px;
margin-top: 10px; margin-top: 10px;
margin-left: 30px
} }
.finder-wrapper .main .content .middle img { .finder-wrapper .main .content .middle img {
width: 60px;
margin-top: 5px; margin-top: 5px;
width: 60px
} }
.finder-wrapper .main .content .middle { .finder-wrapper .main .content .middle {
float: left; float: left
} }
.finder-wrapper .main .content .middle .app-name { .finder-wrapper .main .content .middle .app-name {
font-size: 12px;
float: left; float: left;
/*background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0; display: block;
border-radius: 18px;*/ overflow: hidden;
line-height: 1.7em;
margin-top: 6px; margin-top: 6px;
padding-top: 1px; padding-top: 1px;
transition: none 0s ease 0s ; width: 5pc;
width: 80px;
color: #333; color: #333;
/*text-shadow: 0 0 0 #fff, 0 0 2px #000, 0 0 4px #000;*/ text-overflow: ellipsis;
white-space: nowrap;
font-size: 9pt;
line-height: 1.7em;
transition: none 0s ease 0s;
writing-mode: horizontal-tb; writing-mode: horizontal-tb;
display:block;/*内联对象需加*/ word-break: keep-all
word-break:keep-all;/* 不换行 */
white-space:nowrap;/* 不换行 */
overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
} }
.finder-wrapper .main .content .active { .finder-wrapper .main .content .active {
background-image: url(images/icons/finder_app_active_bg.png); background-image: url(images/icons/finder_app_active_bg.png)
} }
.finder-wrapper .main .content .hover { .finder-wrapper .main .content .hover {
background-image: url(images/icons/finder_app_hover_bg.png); background-image: url(images/icons/finder_app_hover_bg.png)
}
.finder-wrapper {
width: 100%;
height: 100%;
}
.finder-wrapper .topbar {
width: 100%;
height: 30px;
background: #f6f6f6;
border-bottom: 1px solid #9a9a9a;
margin-top: 0px;
} }
.finder-wrapper .topbar .next-prev-box { .finder-wrapper .topbar .next-prev-box {
float: left; float: left;
background: url(images/icons/next_prev.png) no-repeat; margin-top: 2px;
margin-left: 5px;
width: 53px; width: 53px;
height: 24px; height: 24px;
margin-left: 5px; background: url(images/icons/next_prev.png) no-repeat;
margin-top:2px; cursor: pointer
cursor: pointer;
} }
.finder-wrapper .main { .finder-wrapper .main {
width: 100%; width: 100%;
height: calc(100% - 30px); height: calc(100% - 30px);
background: #fff; background: #fff
} }
.finder-wrapper .main .sidebar { .finder-wrapper .main .sidebar {
float: left;
width: 148px; width: 148px;
height: 100%; height: 100%;
background: #f6f6f6;
float: left;
border-right: 1px solid #dfdfdf; border-right: 1px solid #dfdfdf;
background: #f6f6f6
} }
.finder-wrapper .main .content { .finder-wrapper .main .content {
width: 80%;
width:-moz-calc(100% - 150px);
width:-webkit-calc(100% - 150px);
width: calc(100% - 150px);
height: 100%;
float: left; float: left;
overflow-y: auto; overflow-y: auto;
width: 80%;
width: calc(100% - 150px);
height: 100%
} }
.finder-wrapper .main .sidebar ul { .finder-wrapper .main .sidebar ul {
width: 148px; margin: 0;
list-style: none; padding: 0;
padding: 0px;
margin: 0px;
padding-top: 5px; padding-top: 5px;
width: 148px;
list-style: none
} }
.finder-wrapper .main .sidebar ul .title { .finder-wrapper .main .sidebar ul .title {
width: 100%;
padding-left: 5px; padding-left: 5px;
width: 100%
} }
.trash-wrapper .main .sidebar ul li,.finder-wrapper .main .sidebar ul li {
width: 100%; .finder-wrapper .main .sidebar ul li,.trash-wrapper .main .sidebar ul li {
float: left; float: left;
width: 100%
} }
.finder-wrapper .main .sidebar ul li a { .finder-wrapper .main .sidebar ul li a {
clear: both;
display: block; display: block;
color:#444444;
text-decoration: none;
width: 148px; width: 148px;
height: 30px; height: 30px;
line-height: 30px; color: #444;
clear: both; text-decoration: none;
line-height: 30px
} }
.finder-wrapper .main .sidebar ul li a .name { .finder-wrapper .main .sidebar ul li a .name {
display: block;
float: left; float: left;
display: block;
margin-left: 5px; margin-left: 5px;
font-size: 14px; font-size: 14px
} }
.finder-wrapper .main .sidebar ul li a .home-icon { .finder-wrapper .main .sidebar ul li a .home-icon {
display: block;
background-image: url(images/icons/SidebarHomeFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarHomeFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .desktop-icon { .finder-wrapper .main .sidebar ul li a .desktop-icon {
display: block;
background-image: url(images/icons/SidebarDesktopFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarDesktopFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .documents-icon { .finder-wrapper .main .sidebar ul li a .documents-icon {
display: block;
background-image: url(images/icons/SidebarDocumentsFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarDocumentsFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .downloads-icon { .finder-wrapper .main .sidebar ul li a .downloads-icon {
display: block;
background-image: url(images/icons/SidebarDownloadsFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarDownloadsFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .movies-icon { .finder-wrapper .main .sidebar ul li a .movies-icon {
display: block;
background-image: url(images/icons/SidebarMoviesFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarMoviesFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .music-icon { .finder-wrapper .main .sidebar ul li a .music-icon {
display: block;
background-image: url(images/icons/SidebarMusicFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarMusicFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .pictures-icon { .finder-wrapper .main .sidebar ul li a .pictures-icon {
display: block;
background-image: url(images/icons/SidebarPicturesFolder_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarPicturesFolder_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .cloud-icon { .finder-wrapper .main .sidebar ul li a .cloud-icon {
display: block;
background-image: url(images/icons/SidebariCloud_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebariCloud_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .network-icon { .finder-wrapper .main .sidebar ul li a .network-icon {
display: block;
background-image: url(images/icons/SidebarNetwork_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/SidebarNetwork_16x16.png)
} }
.finder-wrapper .main .sidebar ul li a .trash-icon { .finder-wrapper .main .sidebar ul li a .trash-icon {
display: block;
background-image: url(images/icons/StatusBarTrashIcon_16x16.png);
width: 16px;
height: 16px;
float: left; float: left;
margin-left: 15px; display: block;
margin-top: 7px; margin-top: 7px;
margin-left: 15px;
width: 1pc;
height: 1pc;
background-image: url(images/icons/StatusBarTrashIcon_16x16.png)
} }
.finder-wrapper .main .sidebar ul li .on { .finder-wrapper .main .sidebar ul li .on {
background: #cecece; background: #cecece
} }
.finder-wrapper .topbar .next-prev-box .prev { .finder-wrapper .topbar .next-prev-box .prev {
float: left; float: left;
display: block; display: block;
width: 25px; width: 25px;
height: 22px; height: 22px
} }
.finder-wrapper .topbar .next-prev-box .next { .finder-wrapper .topbar .next-prev-box .next {
float: right; float: right;
display: block; display: block;
width: 25px; width: 25px;
height: 22px; height: 22px
} }
.rename { .rename {
border: 0px;
width: 60px; width: 60px;
height: 18px; height: 18px;
background: none; border: 0;
text-align: center; background: 0 0;
text-align: center
} }

5
app/finder/index.html
View File

@ -21,13 +21,12 @@
<div class="main"> <div class="main">
<div class="sidebar" app-path="public/user/administrator/home/"></div> <div class="sidebar" app-path="public/user/administrator/home/"></div>
<div class="content" current-path=""> <div class="content" current-path="">
<div class="app-list"> <div class="app-list"></div>
</div>
</div> </div>
</div> </div>
</div> </div>
</body>
<script type="text/javascript" src="js/jquery-2.2.4.min.js"></script> <script type="text/javascript" src="js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="js/jquery.nicescroll.min.js"></script> <script type="text/javascript" src="js/jquery.nicescroll.min.js"></script>
<script type="text/javascript" src="js/main.js"></script> <script type="text/javascript" src="js/main.js"></script>
</body>
</html> </html>

14
css/index.css
View File

@ -1,10 +1,8 @@
@charset "utf-8"; @charset "utf-8";
body,a,h1,h2,h3,h4,h5,h6,p,div,em,ul,li { body,a,h1,h2,h3,h4,h5,h6,p,div,em,ul,li {
font-family: PingFangSC-Ultralight, 'microsoft yahei'; font-family: PingFang SC, Verdana, Helvetica Neue, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans-serif;
}
* {
font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei", 华文细黑, STHeiti, MingLiu
} }
html { html {
height: 100%; height: 100%;
} }
@ -207,7 +205,7 @@ body {
z-index: 1000; z-index: 1000;
overflow-y: hidden; overflow-y: hidden;
transition: bottom 0.5s; transition: bottom 0.5s;
border-radius: 3px; border-radius:0 0 3px 3px;
} }
#win10-menu.hidden { #win10-menu.hidden {
@ -483,7 +481,7 @@ body {
} }
#win10_command_center .command-body .notice .notice-header { #win10_command_center .command-body .notice .notice-header {
background-color: #dee7e7; background-color: #ffffffbf;
height: 25px; height: 25px;
border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
line-height: 25px; line-height: 25px;
@ -642,8 +640,8 @@ body {
color: transparent; color: transparent;
margin-right: 8px; margin-right: 8px;
font-size: 15px; font-size: 15px;
display: inline-block; display: block;
text-align: right; float: right;
} }
#win10_command_center .msgs .msg>.btn_close_msg:hover{ #win10_command_center .msgs .msg>.btn_close_msg:hover{

2
js/mac.js
View File

@ -678,7 +678,7 @@ window.Win10 = {
} }
//获取周 //获取周
function get_week(date){ function get_week(date){
var values = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"]; var values = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
return values[date.getDay()]; return values[date.getDay()];
} }