Skip to content

Commit 3337fe7

Browse files
rijulshrestharijulshrestha
committed
Prettier fix implemented
1 parent 3e39ea7 commit 3337fe7

File tree

1 file changed

+160
-151
lines changed
  • sites/labs/public/File-Upload-Download-Applet-Demo

1 file changed

+160
-151
lines changed

‎sites/labs/public/File-Upload-Download-Applet-Demo/index.html‎

Lines changed: 160 additions & 151 deletions
Original file line numberDiff line numberDiff line change
@@ -1,154 +1,163 @@
11
<!doctype html>
22
<html lang="en">
3-
4-
<head>
5-
<meta charset="utf-8" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7-
<title>CheerpJ Demo | File Upload & Download</title>
8-
<!-- <script src="https://cjrtnc.leaningtech.com/4.2/loader.js"></script> -->
9-
10-
<style>
11-
:root {
12-
--cj-primary: #ff6b00;
13-
--cj-dark: #1d3557;
14-
--cj-light: #f1faee;
15-
--text-main: #333;
16-
--header-height: 64px;
17-
--footer-height: 32px;
18-
}
19-
20-
* {
21-
box-sizing: border-box;
22-
}
23-
24-
body {
25-
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
26-
margin: 0;
27-
padding: 0;
28-
background-color: var(--cj-light);
29-
color: var(--text-main);
30-
height: 100vh;
31-
display: flex;
32-
flex-direction: column;
33-
overflow: hidden;
34-
}
35-
36-
header {
37-
background-color: #ffffff;
38-
border-bottom: 1px solid #e1e4e8;
39-
height: var(--header-height);
40-
display: flex;
41-
align-items: center;
42-
justify-content: space-between;
43-
padding: 0 24px;
44-
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
45-
z-index: 10;
46-
}
47-
48-
.brand {
49-
display: flex;
50-
align-items: center;
51-
gap: 12px;
52-
}
53-
54-
.brand-logo {
55-
font-weight: 800;
56-
font-size: 1.5rem;
57-
color: var(--cj-dark);
58-
letter-spacing: -0.5px;
59-
}
60-
61-
.brand-logo span {
62-
color: var(--cj-primary);
63-
}
64-
65-
.demo-badge {
66-
background-color: var(--cj-primary);
67-
color: #ffffff;
68-
/* White text */
69-
padding: 4px 10px;
70-
border-radius: 999px;
71-
/* Pill shape */
72-
font-size: 0.70rem;
73-
font-weight: 700;
74-
text-transform: uppercase;
75-
letter-spacing: 0.5px;
76-
border: none;
77-
}
78-
79-
.header-content {
80-
display: flex;
81-
flex-direction: column;
82-
justify-content: center;
83-
}
84-
85-
.header-title {
86-
font-size: 1.1rem;
87-
font-weight: 600;
88-
color: var(--cj-dark);
89-
margin: 0;
90-
}
91-
92-
.header-subtitle {
93-
font-size: 0.85rem;
94-
color: #666;
95-
margin-top: 2px;
96-
}
97-
98-
#applet-container {
99-
flex: 1;
100-
position: relative;
101-
width: 100%;
102-
background: #fff;
103-
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
104-
}
105-
106-
footer {
107-
height: var(--footer-height);
108-
background: #fff;
109-
border-top: 1px solid #e1e4e8;
110-
display: flex;
111-
align-items: center;
112-
justify-content: flex-end;
113-
padding: 0 24px;
114-
font-size: 0.8rem;
115-
color: #888;
116-
}
117-
118-
cheerpj-applet {
119-
display: block;
120-
width: 100%;
121-
height: 100%;
122-
border: none;
123-
}
124-
</style>
125-
</head>
126-
127-
<body>
128-
<header>
129-
<div class="brand">
130-
<div class="brand-logo">Cheerp<span>J</span></div>
131-
<span class="demo-badge">Applet Demo</span>
132-
</div>
133-
<div class="header-content">
134-
<h1 class="header-title">File Upload & Download</h1>
135-
<div class="header-subtitle">Seamless Java Applet Integration</div>
136-
</div>
137-
</header>
138-
139-
<div id="applet-container">
140-
<cheerpj-applet archive="NoteAppletDemo.jar" code="NoteApplet" width="100%" height="100%">
141-
Your browser cannot handle the applet tag!
142-
</cheerpj-applet>
143-
</div>
144-
145-
<footer>
146-
&copy; 2026 Leaning Technologies
147-
</footer>
148-
149-
<script type="module">
150-
await cheerpjInit();
151-
</script>
152-
</body>
153-
3+
<head>
4+
<meta charset="utf-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1" />
6+
<title>CheerpJ Demo | File Upload & Download</title>
7+
<!-- <script src="https://cjrtnc.leaningtech.com/4.2/loader.js"></script> -->
8+
9+
<style>
10+
:root {
11+
--cj-primary: #ff6b00;
12+
--cj-dark: #1d3557;
13+
--cj-light: #f1faee;
14+
--text-main: #333;
15+
--header-height: 64px;
16+
--footer-height: 32px;
17+
}
18+
19+
* {
20+
box-sizing: border-box;
21+
}
22+
23+
body {
24+
font-family:
25+
"Inter",
26+
-apple-system,
27+
BlinkMacSystemFont,
28+
"Segoe UI",
29+
Roboto,
30+
Helvetica,
31+
Arial,
32+
sans-serif;
33+
margin: 0;
34+
padding: 0;
35+
background-color: var(--cj-light);
36+
color: var(--text-main);
37+
height: 100vh;
38+
display: flex;
39+
flex-direction: column;
40+
overflow: hidden;
41+
}
42+
43+
header {
44+
background-color: #ffffff;
45+
border-bottom: 1px solid #e1e4e8;
46+
height: var(--header-height);
47+
display: flex;
48+
align-items: center;
49+
justify-content: space-between;
50+
padding: 0 24px;
51+
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
52+
z-index: 10;
53+
}
54+
55+
.brand {
56+
display: flex;
57+
align-items: center;
58+
gap: 12px;
59+
}
60+
61+
.brand-logo {
62+
font-weight: 800;
63+
font-size: 1.5rem;
64+
color: var(--cj-dark);
65+
letter-spacing: -0.5px;
66+
}
67+
68+
.brand-logo span {
69+
color: var(--cj-primary);
70+
}
71+
72+
.demo-badge {
73+
background-color: var(--cj-primary);
74+
color: #ffffff;
75+
/* White text */
76+
padding: 4px 10px;
77+
border-radius: 999px;
78+
/* Pill shape */
79+
font-size: 0.7rem;
80+
font-weight: 700;
81+
text-transform: uppercase;
82+
letter-spacing: 0.5px;
83+
border: none;
84+
}
85+
86+
.header-content {
87+
display: flex;
88+
flex-direction: column;
89+
justify-content: center;
90+
}
91+
92+
.header-title {
93+
font-size: 1.1rem;
94+
font-weight: 600;
95+
color: var(--cj-dark);
96+
margin: 0;
97+
}
98+
99+
.header-subtitle {
100+
font-size: 0.85rem;
101+
color: #666;
102+
margin-top: 2px;
103+
}
104+
105+
#applet-container {
106+
flex: 1;
107+
position: relative;
108+
width: 100%;
109+
background: #fff;
110+
box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.05);
111+
}
112+
113+
footer {
114+
height: var(--footer-height);
115+
background: #fff;
116+
border-top: 1px solid #e1e4e8;
117+
display: flex;
118+
align-items: center;
119+
justify-content: flex-end;
120+
padding: 0 24px;
121+
font-size: 0.8rem;
122+
color: #888;
123+
}
124+
125+
cheerpj-applet {
126+
display: block;
127+
width: 100%;
128+
height: 100%;
129+
border: none;
130+
}
131+
</style>
132+
</head>
133+
134+
<body>
135+
<header>
136+
<div class="brand">
137+
<div class="brand-logo">Cheerp<span>J</span></div>
138+
<span class="demo-badge">Applet Demo</span>
139+
</div>
140+
<div class="header-content">
141+
<h1 class="header-title">File Upload & Download</h1>
142+
<div class="header-subtitle">Seamless Java Applet Integration</div>
143+
</div>
144+
</header>
145+
146+
<div id="applet-container">
147+
<cheerpj-applet
148+
archive="NoteAppletDemo.jar"
149+
code="NoteApplet"
150+
width="100%"
151+
height="100%"
152+
>
153+
Your browser cannot handle the applet tag!
154+
</cheerpj-applet>
155+
</div>
156+
157+
<footer>&copy; 2026 Leaning Technologies</footer>
158+
159+
<script type="module">
160+
await cheerpjInit();
161+
</script>
162+
</body>
154163
</html>

0 commit comments

Comments
 (0)