Skip to content

Commit e0adf89

Browse files
committed
inicial
1 parent d9f89bc commit e0adf89

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

101 files changed

+322
-0
lines changed

img/001.png

46.2 KB

img/002.png

81.1 KB

img/003.png

55.8 KB

img/004.png

38.7 KB

img/005.png

78.1 KB

img/006.png

46 KB

img/007.png

203 KB

img/008.png

43.3 KB

img/009.png

137 KB

img/010.png

54.8 KB

img/011.png

300 KB

img/012.png

133 KB

img/013.png

68.4 KB

img/014.png

81.6 KB

img/015.png

63 KB

img/016.png

62.3 KB

img/017.png

81.8 KB

img/018.png

81.7 KB

img/019.png

62.6 KB

img/020.png

48.3 KB

img/021.png

20.3 KB

img/022.png

13.4 KB

img/023.png

59.9 KB

img/024.png

53.5 KB

img/025.png

54.7 KB

img/026.png

56.3 KB

img/027.png

27 KB

img/028.png

68.3 KB

img/029.png

60 KB

img/030.png

83.2 KB

img/031.png

59.7 KB

img/032.png

54.1 KB

img/033.png

42.7 KB

img/034.png

77 KB

img/035.png

70.9 KB

img/036.png

79.4 KB

img/037.png

62.3 KB

img/038.png

82.3 KB

img/039.png

88.6 KB

img/040.png

57.7 KB

img/041.png

157 KB

img/042.png

66.6 KB

img/043.png

46.7 KB

img/044.png

57.2 KB

img/045.png

79.4 KB

img/046.png

71.4 KB

img/047.png

39.9 KB

img/048.png

52.7 KB

img/049.png

50.2 KB

img/050.png

65.7 KB

img/051.png

52.8 KB

img/052.png

89.9 KB

img/053.png

49.5 KB

img/054.png

60.7 KB

img/055.png

42.1 KB

img/056.png

300 KB

img/057.png

49.7 KB

img/058.png

52.2 KB

img/059.png

77.3 KB

img/060.png

72.6 KB

img/061.png

44.1 KB

img/062.png

49 KB

img/063.png

67.2 KB

img/064.png

72.2 KB

img/065.png

84.3 KB

img/066.png

34.6 KB

img/067.png

42.2 KB

img/068.png

40.5 KB

img/069.png

51 KB

img/070.png

35.5 KB

img/071.png

86.5 KB

img/072.png

555 KB

img/073.png

58 KB

img/074.png

60.3 KB

img/075.png

36.1 KB

img/076.png

53.1 KB

img/077.png

74.8 KB

img/078.png

60.1 KB

img/079.png

53.1 KB

img/080.png

52.7 KB

img/081.png

62.8 KB

img/082.png

26.6 KB

img/083.png

97.2 KB

img/084.png

151 KB

img/085.png

32.5 KB

img/086.png

80.8 KB

img/087.png

69.7 KB

img/088.png

49.2 KB

img/089.png

50.4 KB

img/090.png

47.7 KB

img/091.png

118 KB

img/092.png

68.7 KB

img/093.png

71.3 KB

img/094.png

20.5 KB

img/095.png

49.3 KB

img/096.png

58.7 KB

img/097.png

63.2 KB

img/098.png

76 KB

img/099.png

19.2 KB

img/100.png

433 KB

index.html

Lines changed: 322 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,322 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<title>W3.CSS Template</title>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
7+
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway">
8+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
9+
<style>
10+
html,body,h1,h2,h3,h4,h5 {font-family: "Raleway", sans-serif}
11+
</style>
12+
<body class="w3-light-grey">
13+
14+
<!-- Top container -->
15+
<div class="w3-bar w3-top w3-black w3-large" style="z-index:4">
16+
<button class="w3-bar-item w3-button w3-hide-large w3-hover-none w3-hover-text-light-grey" onclick="w3_open();"><i class="fa fa-bars"></i> Menu</button>
17+
<span class="w3-bar-item w3-right">Logo</span>
18+
</div>
19+
20+
<!-- Sidebar/menu -->
21+
<nav class="w3-sidebar w3-collapse w3-white w3-animate-left" style="z-index:3;width:300px;" id="mySidebar"><br>
22+
<div class="w3-container w3-row">
23+
<div class="w3-col s4">
24+
<img src="img/075.png" class="w3-circle w3-margin-right" style="width:46px">
25+
</div>
26+
<div class="w3-col s8 w3-bar">
27+
<span>#codefuncode</span><br>
28+
<a href="#" class="w3-bar-item w3-button"><i class="fa fa-envelope"></i></a>
29+
<a href="#" class="w3-bar-item w3-button"><i class="fa fa-user"></i></a>
30+
<a href="#" class="w3-bar-item w3-button"><i class="fa fa-cog"></i></a>
31+
</div>
32+
</div>
33+
<hr>
34+
<div class="w3-container">
35+
<h5>Tablero</h5>
36+
</div>
37+
<div class="w3-bar-block">
38+
<a href="#" class="w3-bar-item w3-button w3-padding-16 w3-hide-large w3-dark-grey w3-hover-black" onclick="w3_close()" title="close menu"><i class="fa fa-remove fa-fw"></i> Close Menu</a>
39+
<a href="#" class="w3-bar-item w3-button w3-padding w3-blue"><i class="fa fa-users fa-fw"></i> Overview</a>
40+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-eye fa-fw"></i> Views</a>
41+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-users fa-fw"></i> Traffic</a>
42+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-bullseye fa-fw"></i> Geo</a>
43+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-diamond fa-fw"></i> Orders</a>
44+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-bell fa-fw"></i> News</a>
45+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-bank fa-fw"></i> General</a>
46+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-history fa-fw"></i> History</a>
47+
<a href="#" class="w3-bar-item w3-button w3-padding"><i class="fa fa-cog fa-fw"></i> Settings</a><br><br>
48+
</div>
49+
</nav>
50+
51+
52+
<!-- Overlay effect when opening sidebar on small screens -->
53+
<div class="w3-overlay w3-hide-large w3-animate-opacity" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="myOverlay"></div>
54+
55+
<!-- !PAGE CONTENT! -->
56+
<div class="w3-main" style="margin-left:300px;margin-top:43px;">
57+
58+
<!-- Header -->
59+
<header class="w3-container" style="padding-top:22px">
60+
<h5><b><i class="fa fa-dashboard"></i> My Dashboard</b></h5>
61+
</header>
62+
63+
<div class="w3-row-padding w3-margin-bottom">
64+
<div class="w3-quarter">
65+
<div class="w3-container w3-red w3-padding-16">
66+
<div class="w3-left">
67+
<!-- <i class="fa fa-comment w3-xxxlarge"></i> -->
68+
</div>
69+
<!-- <div class="w3-right">
70+
<h3>52</h3>
71+
</div> -->
72+
<img src="img/013.png" style="width: 90%;" />
73+
<div class="w3-clear"></div>
74+
<h4 class="w3-center">HTML5</h4>
75+
76+
</div>
77+
</div>
78+
<div class="w3-quarter">
79+
<div class="w3-container w3-blue w3-padding-16">
80+
<div class="w3-left">
81+
<!-- <i class="fa fa-eye w3-xxxlarge"></i> -->
82+
</div>
83+
<!-- <div class="w3-right">
84+
<h3>23</h3>
85+
</div> -->
86+
<img src="img/018.png" style="width: 90%;" />
87+
<div class="w3-clear"></div>
88+
<h4 class="w3-center">CSS3</h4>
89+
90+
</div>
91+
</div>
92+
<div class="w3-quarter">
93+
<div class="w3-container w3-teal w3-padding-16">
94+
<div class="w3-left">
95+
<!-- <i class="fa fa-share-alt w3-xxxlarge"></i> -->
96+
</div>
97+
<!-- <div class="w3-right">
98+
<h3>23</h3>
99+
</div> -->
100+
<img src="img/015.png" style="width: 90%;" />
101+
<div class="w3-clear"></div>
102+
<h4 class="w3-center">PHP</h4>
103+
104+
</div>
105+
</div>
106+
<div class="w3-quarter">
107+
<div class="w3-container w3-orange w3-text-white w3-padding-16">
108+
<div class="w3-left">
109+
<!-- <i class="fa fa-users w3-xxxlarge"></i> -->
110+
</div>
111+
<!-- <div class="w3-right">
112+
<h3>23</h3>
113+
</div> -->
114+
<img src="img/016.png" style="width: 90%;" />
115+
<div class="w3-clear"></div>
116+
<h4 class="w3-center">JS</h4>
117+
118+
</div>
119+
</div>
120+
</div>
121+
122+
<div class="w3-panel">
123+
<div class="w3-row-padding" style="margin:0 -16px">
124+
<div class="w3-third">
125+
<h5>Regions</h5>
126+
<img src="/w3images/region.jpg" style="width:100%" alt="Google Regional Map">
127+
</div>
128+
<div class="w3-twothird">
129+
<h5>Feeds</h5>
130+
<table class="w3-table w3-striped w3-white">
131+
<tr>
132+
<td><i class="fa fa-user w3-text-blue w3-large"></i></td>
133+
<td>New record, over 90 views.</td>
134+
<td><i>10 mins</i></td>
135+
</tr>
136+
<tr>
137+
<td><i class="fa fa-bell w3-text-red w3-large"></i></td>
138+
<td>Database error.</td>
139+
<td><i>15 mins</i></td>
140+
</tr>
141+
<tr>
142+
<td><i class="fa fa-users w3-text-yellow w3-large"></i></td>
143+
<td>New record, over 40 users.</td>
144+
<td><i>17 mins</i></td>
145+
</tr>
146+
<tr>
147+
<td><i class="fa fa-comment w3-text-red w3-large"></i></td>
148+
<td>New comments.</td>
149+
<td><i>25 mins</i></td>
150+
</tr>
151+
<tr>
152+
<td><i class="fa fa-bookmark w3-text-blue w3-large"></i></td>
153+
<td>Check transactions.</td>
154+
<td><i>28 mins</i></td>
155+
</tr>
156+
<tr>
157+
<td><i class="fa fa-laptop w3-text-red w3-large"></i></td>
158+
<td>CPU overload.</td>
159+
<td><i>35 mins</i></td>
160+
</tr>
161+
<tr>
162+
<td><i class="fa fa-share-alt w3-text-green w3-large"></i></td>
163+
<td>New shares.</td>
164+
<td><i>39 mins</i></td>
165+
</tr>
166+
</table>
167+
</div>
168+
</div>
169+
</div>
170+
<hr>
171+
<div class="w3-container">
172+
<h5>General Stats</h5>
173+
<p>New Visitors</p>
174+
<div class="w3-grey">
175+
<div class="w3-container w3-center w3-padding w3-green" style="width:25%">+25%</div>
176+
</div>
177+
178+
<p>New Users</p>
179+
<div class="w3-grey">
180+
<div class="w3-container w3-center w3-padding w3-orange" style="width:50%">50%</div>
181+
</div>
182+
183+
<p>Bounce Rate</p>
184+
<div class="w3-grey">
185+
<div class="w3-container w3-center w3-padding w3-red" style="width:75%">75%</div>
186+
</div>
187+
</div>
188+
<hr>
189+
190+
<div class="w3-container">
191+
<h5>Countries</h5>
192+
<table class="w3-table w3-striped w3-bordered w3-border w3-hoverable w3-white">
193+
<tr>
194+
<td>United States</td>
195+
<td>65%</td>
196+
</tr>
197+
<tr>
198+
<td>UK</td>
199+
<td>15.7%</td>
200+
</tr>
201+
<tr>
202+
<td>Russia</td>
203+
<td>5.6%</td>
204+
</tr>
205+
<tr>
206+
<td>Spain</td>
207+
<td>2.1%</td>
208+
</tr>
209+
<tr>
210+
<td>India</td>
211+
<td>1.9%</td>
212+
</tr>
213+
<tr>
214+
<td>France</td>
215+
<td>1.5%</td>
216+
</tr>
217+
</table><br>
218+
<button class="w3-button w3-dark-grey">More Countries <i class="fa fa-arrow-right"></i></button>
219+
</div>
220+
<hr>
221+
<div class="w3-container">
222+
<h5>Recent Users</h5>
223+
<ul class="w3-ul w3-card-4 w3-white">
224+
<li class="w3-padding-16">
225+
<img src="/w3images/avatar2.png" class="w3-left w3-circle w3-margin-right" style="width:35px">
226+
<span class="w3-xlarge">Mike</span><br>
227+
</li>
228+
<li class="w3-padding-16">
229+
<img src="/w3images/avatar5.png" class="w3-left w3-circle w3-margin-right" style="width:35px">
230+
<span class="w3-xlarge">Jill</span><br>
231+
</li>
232+
<li class="w3-padding-16">
233+
<img src="/w3images/avatar6.png" class="w3-left w3-circle w3-margin-right" style="width:35px">
234+
<span class="w3-xlarge">Jane</span><br>
235+
</li>
236+
</ul>
237+
</div>
238+
<hr>
239+
240+
<div class="w3-container">
241+
<h5>Recent Comments</h5>
242+
<div class="w3-row">
243+
<div class="w3-col m2 text-center">
244+
<img class="w3-circle" src="/w3images/avatar3.png" style="width:96px;height:96px">
245+
</div>
246+
<div class="w3-col m10 w3-container">
247+
<h4>John <span class="w3-opacity w3-medium">Sep 29, 2014, 9:12 PM</span></h4>
248+
<p>Keep up the GREAT work! I am cheering for you!! Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><br>
249+
</div>
250+
</div>
251+
252+
<div class="w3-row">
253+
<div class="w3-col m2 text-center">
254+
<img class="w3-circle" src="/w3images/avatar1.png" style="width:96px;height:96px">
255+
</div>
256+
<div class="w3-col m10 w3-container">
257+
<h4>Bo <span class="w3-opacity w3-medium">Sep 28, 2014, 10:15 PM</span></h4>
258+
<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><br>
259+
</div>
260+
</div>
261+
</div>
262+
<br>
263+
<div class="w3-container w3-dark-grey w3-padding-32">
264+
<div class="w3-row">
265+
<div class="w3-container w3-third">
266+
<h5 class="w3-bottombar w3-border-green">Demographic</h5>
267+
<p>Language</p>
268+
<p>Country</p>
269+
<p>City</p>
270+
</div>
271+
<div class="w3-container w3-third">
272+
<h5 class="w3-bottombar w3-border-red">System</h5>
273+
<p>Browser</p>
274+
<p>OS</p>
275+
<p>More</p>
276+
</div>
277+
<div class="w3-container w3-third">
278+
<h5 class="w3-bottombar w3-border-orange">Target</h5>
279+
<p>Users</p>
280+
<p>Active</p>
281+
<p>Geo</p>
282+
<p>Interests</p>
283+
</div>
284+
</div>
285+
</div>
286+
287+
<!-- Footer -->
288+
<footer class="w3-container w3-padding-16 w3-light-grey">
289+
<h4>FOOTER</h4>
290+
<p>Powered by <a href="https://www.w3schools.com/w3css/default.asp" target="_blank">w3.css</a></p>
291+
</footer>
292+
293+
<!-- End page content -->
294+
</div>
295+
296+
<script>
297+
// Get the Sidebar
298+
var mySidebar = document.getElementById("mySidebar");
299+
300+
// Get the DIV with overlay effect
301+
var overlayBg = document.getElementById("myOverlay");
302+
303+
// Toggle between showing and hiding the sidebar, and add overlay effect
304+
function w3_open() {
305+
if (mySidebar.style.display === 'block') {
306+
mySidebar.style.display = 'none';
307+
overlayBg.style.display = "none";
308+
} else {
309+
mySidebar.style.display = 'block';
310+
overlayBg.style.display = "block";
311+
}
312+
}
313+
314+
// Close the sidebar with the close button
315+
function w3_close() {
316+
mySidebar.style.display = "none";
317+
overlayBg.style.display = "none";
318+
}
319+
</script>
320+
321+
</body>
322+
</html>

0 commit comments

Comments
 (0)