Browse Source

Modification background par défaut

upgrade-electron
wpetit 4 years ago
parent
commit
772269c786

+ 5
- 2
css/style.css View File

@@ -17,6 +17,10 @@ html, body {
17 17
   height: 100%;
18 18
   color: white;
19 19
   overflow-x: hidden;
20
+  background: url('../img/background.svg');
21
+  background-size: cover;
22
+  background-repeat: no-repeat;
23
+  background-position: center;
20 24
 }
21 25
 
22 26
 
@@ -31,7 +35,6 @@ html, body {
31 35
   background-position: center center;
32 36
   background-size: contain;
33 37
   background-repeat: no-repeat;
34
-  transition: background-image 250ms ease-in-out;
35 38
 }
36 39
 
37 40
 .full-width {
@@ -56,7 +59,6 @@ html, body {
56 59
   right: 0;
57 60
   bottom: 0;
58 61
   top: 0;
59
-  z-index: -1;
60 62
 }
61 63
 
62 64
 .launcher .crossfade-image .top,
@@ -82,6 +84,7 @@ html, body {
82 84
   align-items: center;
83 85
   display: flex;
84 86
   width: 60px;
87
+  z-index: 10;
85 88
 }
86 89
 
87 90
 .launcher .nav a.goback {

+ 25
- 90
img/hourglass.svg View File

@@ -7,9 +7,9 @@
7 7
    xmlns="http://www.w3.org/2000/svg"
8 8
    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
9 9
    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
10
-   width="50px"
11
-   height="50px"
12
-   viewBox="0 0 100 100"
10
+   width="32.529999"
11
+   height="37.5"
12
+   viewBox="0 0 65.059998 75"
13 13
    preserveAspectRatio="xMidYMid"
14 14
    class="uil-hourglass"
15 15
    id="svg2"
@@ -43,112 +43,47 @@
43 43
      id="namedview30"
44 44
      showgrid="false"
45 45
      inkscape:zoom="13.350176"
46
-     inkscape:cx="-10.530194"
47
-     inkscape:cy="27.889305"
46
+     inkscape:cx="-3.9872051"
47
+     inkscape:cy="18.89309"
48 48
      inkscape:window-x="0"
49 49
      inkscape:window-y="0"
50 50
      inkscape:window-maximized="1"
51
-     inkscape:current-layer="g6" />
51
+     inkscape:current-layer="g6"
52
+     fit-margin-top="0"
53
+     fit-margin-left="0"
54
+     fit-margin-right="0"
55
+     fit-margin-bottom="0" />
52 56
   <rect
53
-     x="0"
54
-     y="0"
57
+     x="-17.46875"
58
+     y="-13"
55 59
      width="100"
56 60
      height="100"
57
-     fill="none"
58 61
      class="bk"
59
-     id="rect4" />
62
+     id="rect4"
63
+     style="fill:none" />
60 64
   <g
61
-     id="g6">
65
+     id="g6"
66
+     transform="translate(-17.46875,-13)">
62 67
     <path
63
-       fill="none"
64
-       stroke="#ffffff"
65
-       stroke-width="5"
66 68
        stroke-miterlimit="10"
67
-       d="M58.4,51.7c-0.9-0.9-1.4-2-1.4-2.3s0.5-0.4,1.4-1.4 C70.8,43.8,79.8,30.5,80,15.5H70H30H20c0.2,15,9.2,28.1,21.6,32.3c0.9,0.9,1.4,1.2,1.4,1.5s-0.5,1.6-1.4,2.5 C29.2,56.1,20.2,69.5,20,85.5h10h40h10C79.8,69.5,70.8,55.9,58.4,51.7z"
69
+       d="M 58.4,51.7 C 57.5,50.8 57,49.7 57,49.4 57,49.1 57.5,49 58.4,48 70.8,43.8 79.8,30.5 80,15.5 H 70 30 20 c 0.2,15 9.2,28.1 21.6,32.3 0.9,0.9 1.4,1.2 1.4,1.5 0,0.3 -0.5,1.6 -1.4,2.5 C 29.2,56.1 20.2,69.5 20,85.5 H 30 70 80 C 79.8,69.5 70.8,55.9 58.4,51.7 z"
68 70
        class="glass"
69 71
        id="path8"
70
-       style="fill:#a4a4a4;fill-opacity:1" />
71
-    <clipPath
72
-       id="uil-hourglass-clip1">
73
-      <rect
74
-         x="15"
75
-         y="20"
76
-         width="70"
77
-         height="25"
78
-         class="clip"
79
-         id="rect11">
80
-        <animate
81
-           attributeName="height"
82
-           from="25"
83
-           to="0"
84
-           dur="1s"
85
-           repeatCount="indefinite"
86
-           vlaues="25;0;0"
87
-           keyTimes="0;0.5;1"
88
-           id="animate13" />
89
-        <animate
90
-           attributeName="y"
91
-           from="20"
92
-           to="45"
93
-           dur="1s"
94
-           repeatCount="indefinite"
95
-           vlaues="20;45;45"
96
-           keyTimes="0;0.5;1"
97
-           id="animate15" />
98
-      </rect>
99
-    </clipPath>
100
-    <clipPath
101
-       id="uil-hourglass-clip2">
102
-      <rect
103
-         x="15"
104
-         y="55"
105
-         width="70"
106
-         height="25"
107
-         class="clip"
108
-         id="rect18">
109
-        <animate
110
-           attributeName="height"
111
-           from="0"
112
-           to="25"
113
-           dur="1s"
114
-           repeatCount="indefinite"
115
-           vlaues="0;25;25"
116
-           keyTimes="0;0.5;1"
117
-           id="animate20" />
118
-        <animate
119
-           attributeName="y"
120
-           from="80"
121
-           to="55"
122
-           dur="1s"
123
-           repeatCount="indefinite"
124
-           vlaues="80;55;55"
125
-           keyTimes="0;0.5;1"
126
-           id="animate22" />
127
-      </rect>
128
-    </clipPath>
72
+       style="fill:#a4a4a4;fill-opacity:1;stroke:#ffffff;stroke-width:5;stroke-miterlimit:10"
73
+       inkscape:connector-curvature="0" />
129 74
     <path
130
-       d="M29,23c3.1,11.4,11.3,19.5,21,19.5S67.9,34.4,71,23H29z"
75
+       d="m 29,23 c 3.1,11.4 11.3,19.5 21,19.5 9.7,0 17.9,-8.1 21,-19.5 H 29 z"
131 76
        clip-path="url(#uil-hourglass-clip1)"
132
-       fill="#d2d2d2"
133 77
        class="sand"
134 78
        id="path24"
135
-       style="fill:#ffffff;fill-opacity:1" />
79
+       style="fill:#ffffff;fill-opacity:1"
80
+       inkscape:connector-curvature="0" />
136 81
     <path
137
-       d="M71.6,78c-3-11.6-11.5-20-21.5-20s-18.5,8.4-21.5,20H71.6z"
82
+       d="M 71.6,78 C 68.6,66.4 60.1,58 50.1,58 40.1,58 31.6,66.4 28.6,78 h 43 z"
138 83
        clip-path="url(#uil-hourglass-clip2)"
139
-       fill="#d2d2d2"
140 84
        class="sand"
141 85
        id="path26"
142
-       style="fill:#ffffff;fill-opacity:1" />
143
-    <animateTransform
144
-       attributeName="transform"
145
-       type="rotate"
146
-       from="0 50 50"
147
-       to="180 50 50"
148
-       repeatCount="indefinite"
149
-       dur="1s"
150
-       values="0 50 50;0 50 50;180 50 50"
151
-       keyTimes="0;0.7;1"
152
-       id="animateTransform28" />
86
+       style="fill:#ffffff;fill-opacity:1"
87
+       inkscape:connector-curvature="0" />
153 88
   </g>
154 89
 </svg>

src/components/launcher/crossfade-image.js → src/components/common/crossfade-image.js View File

@@ -40,7 +40,7 @@ module.exports = React.createClass({
40 40
     ;
41 41
 
42 42
     return (
43
-      <div className="crossfade-image">
43
+      <div className="crossfade-image" {...this.props}>
44 44
         {bottom}
45 45
         <ReactCSSTransitionGroup transitionName="crossfade" transitionEnterTimeout={1000} transitionLeaveTimeout={1000}>
46 46
           {top}

+ 1
- 1
src/components/launcher/launcher-view.js View File

@@ -6,7 +6,7 @@ var AnimateMixin = require('../mixins/animate');
6 6
 var actions = require('../../store/actions');
7 7
 var connect = require('react-redux').connect;
8 8
 var debug = require('../../util/debug')('launcher-view');
9
-var CrossfadeImage = require('./crossfade-image');
9
+var CrossfadeImage = require('../common/crossfade-image');
10 10
 var path = require('path');
11 11
 
12 12
 var DEFAULT_PROFILE = path.join(__dirname, '..', '..', '..', 'default-profile.json');

Loading…
Cancel
Save