术习电报 / electron-vue-template

转到一个项目
切换导航栏
切换导航栏固定状态
张恒
529c369b 1 个父辈 f0b8a6d6

添加自定义的头

内嵌 并排
正在显示 8 个修改的文件 包含 41 行增加 和 21 行删除
1 <template> 1 <template>
2 <div id="app"> 2 <div id="app">
3 + <c-header></c-header>
3 <router-view></router-view> 4 <router-view></router-view>
4 </div> 5 </div>
5 </template> 6 </template>
6 7
7 <script> 8 <script>
8 - export default { 9 +import CHeader from "./components/title";
9 - 10 +export default {
10 - } 11 + components: { CHeader }
12 +};
11 </script> 13 </script>
12 14
13 <style> 15 <style>
14 - /* CSS */ 16 +/* CSS */
15 </style> 17 </style>
......
...@@ -45,7 +45,7 @@ export default { ...@@ -45,7 +45,7 @@ export default {
45 methods: { 45 methods: {
46 // 获取electron方法 46 // 获取electron方法
47 open() { 47 open() {
48 - console.log(this.$store); 48 + console.log(this.$electron);
49 }, 49 },
50 // 设置数据库的数据 50 // 设置数据库的数据
51 setdata() { 51 setdata() {
......
...@@ -2,21 +2,21 @@ ...@@ -2,21 +2,21 @@
2 <template> 2 <template>
3 <div class="title"> 3 <div class="title">
4 <!-- 软件logo预留位置 --> 4 <!-- 软件logo预留位置 -->
5 - <div style="-webkit-app-region: drag;"></div> 5 + <div style="-webkit-app-region: drag;" class="logo"></div>
6 <!-- 菜单栏位置 --> 6 <!-- 菜单栏位置 -->
7 - <div ></div> 7 + <div></div>
8 <!-- 中间标题位置 --> 8 <!-- 中间标题位置 -->
9 - <div style="-webkit-app-region: drag;"></div> 9 + <div style="-webkit-app-region: drag;">标题文字</div>
10 <div class="controls-container"> 10 <div class="controls-container">
11 - <div class="windows-icon-bg"> 11 + <div class="windows-icon-bg" @click="Mini">
12 - <svg-icon icon-class="mini"></svg-icon> 12 + <svg-icon icon-class="mini" class-name="icon-size"></svg-icon>
13 </div> 13 </div>
14 - <div class="windows-icon-bg"> 14 + <div class="windows-icon-bg" @click="MixOrReduction">
15 - <svg-icon v-if="mix" icon-class="mix"></svg-icon> 15 + <svg-icon v-if="mix" icon-class="reduction" class-name="icon-size"></svg-icon>
16 - <svg-icon v-else icon-class="mini"></svg-icon> 16 + <svg-icon v-else icon-class="mix" class-name="icon-size"></svg-icon>
17 </div> 17 </div>
18 - <div class="windows-icon-bg"> 18 + <div class="windows-icon-bg close-icon" @click="Close">
19 - <svg-icon icon-class="close"></svg-icon> 19 + <svg-icon icon-class="close" class-name="icon-size"></svg-icon>
20 </div> 20 </div>
21 </div> 21 </div>
22 </div> 22 </div>
...@@ -32,15 +32,19 @@ export default { ...@@ -32,15 +32,19 @@ export default {
32 32
33 mounted() {}, 33 mounted() {},
34 34
35 - methods: {} 35 + methods: {
36 +
37 + }
36 }; 38 };
37 </script> 39 </script>
38 <style rel='stylesheet/scss' lang='scss' scoped> 40 <style rel='stylesheet/scss' lang='scss' scoped>
39 .title { 41 .title {
40 width: 100%; 42 width: 100%;
41 - height: 40px; 43 + height: 30px;
44 + line-height: 30px;
42 background-color: #ffffff; 45 background-color: #ffffff;
43 color: rgba(60, 60, 60, 0.6); 46 color: rgba(60, 60, 60, 0.6);
47 + display: flex;
44 .controls-container { 48 .controls-container {
45 display: flex; 49 display: flex;
46 flex-grow: 0; 50 flex-grow: 0;
...@@ -57,6 +61,18 @@ export default { ...@@ -57,6 +61,18 @@ export default {
57 -webkit-app-region: no-drag; 61 -webkit-app-region: no-drag;
58 height: 100%; 62 height: 100%;
59 width: 33.34%; 63 width: 33.34%;
64 + .icon-size {
65 + width: 12px;
66 + height: 12px;
67 + }
68 + }
69 + .windows-icon-bg:hover {
70 + background-color: rgba(85, 85, 85, 0.2);
71 + color: #333;
72 + }
73 + .close-icon:hover {
74 + background-color: rgba(232, 17, 35, 0.9);
75 + color: #fff;
60 } 76 }
61 } 77 }
62 } 78 }
......
1 -<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1567080341044" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1825" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M753.40182882 759.75665253a19.59403977 19.59403977 0 0 1-13.85025679-5.74378297L267.74664771 282.20794526a19.55330372 19.55330372 0 1 1 27.7005136-27.7005136l471.84566037 471.84566036a19.63477582 19.63477582 0 0 1-13.89099286 33.40356051" fill="#434243" p-id="1826"></path><path d="M281.59690452 759.75665253a19.55330372 19.55330372 0 0 1-13.85025681-33.44429657l471.84566036-471.80492431a19.59403977 19.59403977 0 0 1 27.65977756 27.70051361L295.44716131 754.01286957a19.55330372 19.55330372 0 0 1-13.8502568 5.74378296" fill="#434243" p-id="1827"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width='11' height='11' viewBox='0 0 11 11' class="icon" xmlns='http://www.w3.org/2000/svg'><path d='M6.279 5.5L11 10.221l-.779.779L5.5 6.279.779 11 0 10.221 4.721 5.5 0 .779.779 0 5.5 4.721 10.221 0 11 .779 6.279 5.5z'/></svg>
...\ No newline at end of file ...\ No newline at end of file
......
1 -<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1567080309066" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9842" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M288 480h448v64h-448z" p-id="9843"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width='11' height='11' viewBox='0 0 11 11' class='icon' xmlns='http://www.w3.org/2000/svg'><path d='M11 4.399V5.5H0V4.399h11z'/></svg>
...\ No newline at end of file ...\ No newline at end of file
......
1 -<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1567080369879" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2540" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M183.49568 181.69856H850.7392v644.23424H183.49568V181.69856z m39.24992 43.01312v558.21312h588.74368V224.71168H222.7456z" p-id="2541"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width='11' height='11' viewBox='0 0 11 11' class='icon' xmlns='http://www.w3.org/2000/svg'><path d='M11 0v11H0V0h11zM9.899 1.101H1.1V9.9h8.8V1.1z'/></svg>
...\ No newline at end of file ...\ No newline at end of file
......
1 -<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1567080331054" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1095" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M312.17664 393.09312c11.32544 0 20.48-9.15456 20.48-20.48s-9.15456-20.48-20.48-20.48l-77.2096 0c-11.32544 0-20.48 9.15456-20.48 20.48l0 449.55648c0 11.32544 9.15456 20.48 20.48 20.48l449.55648 0c11.32544 0 20.48-9.15456 20.48-20.48l0-77.1072c0-11.32544-9.15456-20.48-20.48-20.48s-20.48 9.15456-20.48 20.48l0 56.6272L255.46752 801.6896 255.46752 393.09312 312.17664 393.09312z" p-id="1096"></path><path d="M849.38752 187.31008 399.81056 187.31008c-11.32544 0-20.48 9.15456-20.48 20.48l0 449.55648c0 11.32544 9.15456 20.48 20.48 20.48l449.55648 0c11.32544 0 20.48-9.15456 20.48-20.48L869.84704 207.79008C869.86752 196.46464 860.69248 187.31008 849.38752 187.31008zM828.90752 636.86656 420.29056 636.86656 420.29056 228.27008l408.59648 0L828.88704 636.86656z" p-id="1097"></path></svg>
...\ No newline at end of file ...\ No newline at end of file
1 +<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width='11' height='11' viewBox='0 0 11 11' class="icon" xmlns='http://www.w3.org/2000/svg'><path d='M11 8.798H8.798V11H0V2.202h2.202V0H11v8.798zm-3.298-5.5h-6.6v6.6h6.6v-6.6zM9.9 1.1H3.298v1.101h5.5v5.5h1.1v-6.6z'/></svg>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -9,6 +9,8 @@ body { ...@@ -9,6 +9,8 @@ body {
9 -webkit-font-smoothing: antialiased; 9 -webkit-font-smoothing: antialiased;
10 text-rendering: optimizeLegibility; 10 text-rendering: optimizeLegibility;
11 font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; 11 font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
12 + margin: 0;
13 + padding: 0;
12 } 14 }
13 15
14 html { 16 html {
......