Skip to content

Commit 33fe2f1

Browse files
AtomicTyler1AtomicTyler1
committed
Added a new tool !!! Go on the website to find it.
1 parent bd95186 commit 33fe2f1

8 files changed

Lines changed: 473 additions & 2 deletions

File tree

‎images/buttons/Paste.png‎

28.2 KB
Loading

‎images/buttons/copy.png‎

24.5 KB
Loading

‎images/buttons/hidden.png‎

22.8 KB
Loading

‎images/buttons/visible.png‎

22.1 KB
Loading

‎tools/encrypt/encrypt.css‎

Lines changed: 216 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,216 @@
1+
body {
2+
margin: 0;
3+
height: 100vh;
4+
display: flex;
5+
align-items: center;
6+
justify-content: center;
7+
text-align: center;
8+
font-family: Arial, sans-serif;
9+
background: linear-gradient(to bottom right, #ffdde1, #ee9ca7);
10+
overflow: hidden;
11+
opacity: 0;
12+
animation: fadeInBackground 2s forwards;
13+
}
14+
15+
.container {
16+
background: rgba(255, 255, 255, 0.3);
17+
backdrop-filter: blur(10px);
18+
padding: 30px;
19+
border-radius: 15px;
20+
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
21+
max-width: 400px;
22+
position: relative;
23+
z-index: 10;
24+
opacity: 0;
25+
animation: fadeInUI 1.5s 1s forwards;
26+
}
27+
28+
h1 {
29+
font-size: 28px;
30+
color: #333;
31+
}
32+
33+
.p {
34+
font-size: 16px;
35+
color: #555;
36+
}
37+
38+
.input-group {
39+
display: flex;
40+
flex-direction: column;
41+
align-items: center;
42+
width: 100%;
43+
margin-top: 10px;
44+
}
45+
46+
.input {
47+
width: 94%;
48+
padding: 12px;
49+
margin-top: 10px;
50+
border: none;
51+
border-radius: 8px;
52+
font-size: 16px;
53+
background: rgba(255, 255, 255, 0.4);
54+
backdrop-filter: blur(10px);
55+
color: #333;
56+
outline: none;
57+
transition: background 0.3s;
58+
white-space: nowrap;
59+
overflow: hidden;
60+
text-overflow: ellipsis;
61+
}
62+
63+
.input:hover, .input:focus {
64+
background: rgba(255, 255, 255, 0.6);
65+
}
66+
67+
.button-row {
68+
display: flex;
69+
justify-content: center;
70+
gap: 15px;
71+
margin-top: 10px;
72+
}
73+
74+
.eye-button, .clipboard-button {
75+
background: none;
76+
border: none;
77+
padding: 0;
78+
cursor: pointer;
79+
display: inline-flex;
80+
align-items: center;
81+
justify-content: center;
82+
}
83+
84+
.eye-icon, .clipboard-icon {
85+
width: 40px;
86+
height: 40px;
87+
transition: transform 0.2s;
88+
}
89+
90+
.eye-icon:hover, .clipboard-icon:hover {
91+
transform: scale(1.2);
92+
}
93+
94+
.button-container {
95+
display: flex;
96+
flex-direction: column;
97+
gap: 15px;
98+
margin-top: 20px;
99+
}
100+
101+
.button {
102+
background: rgba(255, 255, 255, 0.4);
103+
backdrop-filter: blur(10px);
104+
border: none;
105+
padding: 12px;
106+
font-size: 18px;
107+
font-weight: bold;
108+
color: #333;
109+
border-radius: 8px;
110+
cursor: pointer;
111+
transition: background 0.3s;
112+
}
113+
114+
.button:hover {
115+
background: rgba(255, 255, 255, 0.7);
116+
}
117+
118+
progress {
119+
width: 100%;
120+
margin-top: 15px;
121+
height: 10px;
122+
border-radius: 5px;
123+
background: rgba(255, 255, 255, 0.4);
124+
}
125+
126+
progress::-webkit-progress-bar {
127+
background: rgba(255, 255, 255, 0.4);
128+
border-radius: 5px;
129+
}
130+
131+
progress::-webkit-progress-value {
132+
background: #4caf50;
133+
border-radius: 5px;
134+
}
135+
136+
.btn-file {
137+
display: inline-flex;
138+
align-items: center;
139+
justify-content: center;
140+
padding: 12px 25px;
141+
background: rgba(255, 255, 255, 0.4);
142+
backdrop-filter: blur(10px);
143+
border-radius: 8px;
144+
font-size: 16px;
145+
font-weight: bold;
146+
color: #333;
147+
border: none;
148+
cursor: pointer;
149+
transition: background 0.3s, transform 0.2s;
150+
text-align: center;
151+
width: 100%;
152+
box-sizing: border-box;
153+
}
154+
155+
.btn-file:hover {
156+
background: rgba(255, 255, 255, 0.6);
157+
}
158+
159+
.btn-file:active {
160+
background: rgba(255, 255, 255, 0.7);
161+
transform: translateY(1px);
162+
}
163+
164+
#fileInput {
165+
display: none;
166+
}
167+
168+
#fileLabel {
169+
margin-top: 10px;
170+
color: #333;
171+
font-size: 14px;
172+
}
173+
174+
@keyframes fadeInBackground {
175+
from { opacity: 0; }
176+
to { opacity: 1; }
177+
}
178+
179+
@keyframes fadeInUI {
180+
from { opacity: 0; }
181+
to { opacity: 1; }
182+
}
183+
184+
.leaf {
185+
position: absolute;
186+
top: -50px;
187+
left: 0;
188+
width: 30px;
189+
height: auto;
190+
opacity: 0.8;
191+
animation: fall linear infinite;
192+
}
193+
194+
@keyframes fadeOut {
195+
from {
196+
opacity: 0.8;
197+
}
198+
to {
199+
opacity: 0;
200+
}
201+
}
202+
203+
.fade-out {
204+
animation: fadeOut 1s forwards;
205+
}
206+
207+
@keyframes fall {
208+
0% {
209+
transform: translateY(-50px) rotate(0deg);
210+
opacity: 1;
211+
}
212+
100% {
213+
transform: translateY(100vh) rotate(360deg);
214+
opacity: 0;
215+
}
216+
}

0 commit comments

Comments
 (0)