gravitycss
Version:
Pre-built styling library.
124 lines (108 loc) • 4.37 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FULL//</title>
<style>
body {
font-family: 'Poppins', sans-serif;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 100vh;
background-color: #282c35;
color: #fff;
}
h1 {
font-size: 3rem;
margin-bottom: 20px;
color: #61dafb;
text-align: center;
animation: slideInDown 1s ease-out forwards;
}
@keyframes slideInDown {
from {
transform: translateY(-50px);
}
to {
transform: translateY(0);
}
}
h1:hover {
color: #fd5e53;
transform: scale(1.1);
transition: color 0.3s ease-in-out, transform 0.3s ease-in-out;
}
p {
font-size: 1.5rem;
line-height: 1.8;
margin-bottom: 20px;
text-align: center;
animation: fadeInUp 1s ease-out forwards;
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #282c35;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
border-radius: 10px;
transition: box-shadow 0.3s ease-in-out, background-color 0.5s ease-in-out;
}
.container:hover {
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
}
h1:hover,
p:hover {
color: #fd5e53;
}
/* Add some responsiveness */
@media only screen and (max-width: 600px) {
h1 {
font-size: 1.5em;
}
p {
font-size: 1em;
}
}
</style>
</head>
<body>
<div class="container">
<h1>What are the future plans for gravityCSS?</h1>
<p>
At gravityCSS, we aspire to significant goals. Our vision is to assign distinct classes to each HTML element. This approach enables effortless selection of pre-designed styles, streamlining the web development process for global developers. Our aim is to facilitate the creation of fully styled web pages swiftly and efficiently.
</p>
<h1>Will gravityCSS ever become paid to use?</h1>
<p>
gravityCSS remains free for all users, both for personal and commercial purposes. It is a freely accessible source library intended for developers, not a business venture aimed at generating revenue. As the sole initiator of this project, my goal is to assist individuals in creating web pages effortlessly for their present and future projects.
</p>
<h1>Should you trust gravityCSS</h1>
<p>
gravityCSS is a trustworthy library designed for universal use. It operates without collecting or utilizing any user information, ensuring user privacy. The library does not have access to your personal information or computer data. Any interactions with your computer are solely attributed to the npm itself and not the library.
</p>
<h1>Should I create a website using gravityCSS?</h1>
<p>
Consider incorporating gravityCSS into your website or project. It proves highly beneficial by allowing you to effortlessly apply a variety of styles using just a single class. Give it a try, and experience the ease of enhancing your design aesthetics.
</p>
<h1>Is gravityCSS beginner friendly?</h1>
<p>
gravityCSS caters to both beginners and professionals with its speedy styling capabilities and user-friendly interface. It's a must-try for developers at every skill level.
</p>
</div>
</body>
</html>