-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathhtml.yaml
112 lines (100 loc) · 3.22 KB
/
html.yaml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
apiVersion: v1
kind: ConfigMap
metadata:
name: html
data:
custom.html: |
<head>
<link href="https://fonts.googleapis.com/css?family=Ravi+Prakash" rel="stylesheet">
<link href="custom.css" rel="stylesheet" type="text/css"/ rel="stylesheet" type="text/css"/>
</head>
<div class="grad">
<div class="container1">
<div class="left">
<div class="scroll">
<img class="logo" src="http://img05.deviantart.net/cef3/i/2015/122/c/4/dragon_ball_z__dbz__nuevo_logo_by_saodvd-d8rx6aw.png">
<p>Dragon Ball Z is a Japanese anime television series that follows the adventures of the protagonist Goku who, along with his companions, defends the Earth against an assortment of villains ranging from intergalactic space fighters and conquerors, unnaturally powerful androids and nearly indestructible creatures. </p>
</div>
</div>
</div>
<div class="container2">
<div class="goku">
</div>
</div>
</div>
custom.css: |
body {
background: green;
overflow: hidden;
background-image: url(http://icons.iconarchive.com/icons/musett/dragon-ballz/256/Dragon-Ball-icon.png);
background-repeat: no-repeat;
background-position: 50% 10%;
}
.grad {
background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,1));
}
.container1 {
display: block;
position: relative;
left: 60px;
width: 50%;
text-align: center;
font-family: 'Ravi Prakash', cursive;
-webkit-text-stroke: 2px black;
font-size: 60px;
font-weight: 500;
perspective: 600px;
perspective-origin: 50% 0;
}
p {
color: yellow;
background: linear-gradient(to bottom, yellow 0%, red 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.left {
transform-origin: 20% 0%;
transform-style: preserve-3d;
transform: rotateY(30deg);
}
.scroll {
animation: scrolling 40s linear 0s infinite;
}
@keyframes scrolling {
from {
transform: translateY(25%)
}
to {
transform: translateY(-100%)
}
}
.logo {
max-width: 100%;
padding: 0px;
margin: 0px;
}
.container2 {
display: block;
position: absolute;
left: 50%;
top: 0px;
width: 50%;
height: 100%;
text-align: center;
}
.goku {
width: 100%;
height: 100%;
background-image: url("http://vignette2.wikia.nocookie.net/fictional-battle-omniverse/images/8/8b/Goku_Dragon_Ball_Z.png/revision/latest?cb=20150508010447");
background-size: 300px auto;
background-repeat: no-repeat;
background-position: 50% 0;
}
.goku:hover {
background-image: url(http://vignette3.wikia.nocookie.net/vsbattles/images/5/56/Goku_%28Base%29.png/revision/latest?cb=20160315175220);
background-size: 400px auto;
}
body:hover {
background-image: url(http://pre15.deviantart.net/1b53/th/pre/i/2012/302/1/4/z_ball_dbz_by_fsuarez913-d5jc8v1.png);
background-size: 300px 300px;
}