pythoncode1/index.html at main · abdulrehmanark911-arch/pythoncode1 · GitHub

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
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Jenkins Tutorial</title>

    <style>
        body {
    margin: 0;
    padding: 0;
    font-family: "Poppins", sans-serif;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;

    /* NEW NEON BACKGROUND */
    background: radial-gradient(circle at 20% 30%, rgba(0, 150, 255, 0.55), transparent 60%),
                radial-gradient(circle at 80% 20%, rgba(255, 0, 200, 0.55), transparent 60%),
                radial-gradient(circle at 70% 80%, rgba(0, 255, 200, 0.45), transparent 60%),
                #050505;
    background-size: cover;
    background-position: center;
}
        .glass-card {
            width: 85%;
            max-width: 1200px;
            padding: 50px;
            border-radius: 25px;
            background: rgba(255, 255, 255, 0.07);
            backdrop-filter: blur(15px);
            -webkit-backdrop-filter: blur(15px);
            border: 1px solid rgba(255, 255, 255, 0.15);
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
            color: #e5e5e5;
        }

        nav {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 40px;
            font-size: 15px;
            letter-spacing: 1px;
        }

        nav .logo {
            font-size: 22px;
            font-weight: 600;
        }

        nav ul {
            list-style: none;
            display: flex;
            gap: 25px;
        }

        nav ul li a {
            text-decoration: none;
            color: #dcdcdc;
            transition: 0.3s;
        }

        nav ul li a:hover {
            color: #ffffff;
        }

        h1 {
            font-size: 45px;
            margin-bottom: 10px;
        }

        h2 {
            margin-top: 30px;
            font-size: 30px;
            border-bottom: 1px solid rgba(255, 255, 255, 0.2);
            padding-bottom: 8px;
        }

        p {
            font-size: 16px;
            line-height: 1.7;
            color: #d1d1d1;
        }

        .contact-box {
            margin-top: 10px;
            font-size: 17px;
            line-height: 1.8;
        }

        .contact-box span {
            font-weight: 600;
        }

    </style>
</head>

<body>

    <div class="glass-card">

        <nav>
            <div class="logo">Jenkins Tutorial</div>

            <ul>
                <li><a href="#home">HOME</a></li>
                <li><a href="#about">ABOUT</a></li>
                <li><a href="#contact">CONTACT</a></li>
            </ul>
        </nav>

        <!-- HOME SECTION -->
        <section id="home">
            <h1>Welcome to Jenkins Tutorial</h1>
            <p>
                Learn complete CI/CD automation with Jenkins.
                This tutorial will help you understand how to build pipelines, automate deployments,
                integrate tools, and manage DevOps workflows in a very easy and modern way.
            </p>
        </section>

        <!-- ABOUT SECTION -->
        <section id="about">
            <h2>About Jenkins</h2>
            <p>
                Jenkins is one of the most powerful and widely used automation servers for Continuous Integration
                and Continuous Delivery (CI/CD).
                It helps developers automate code building, testing, packaging, and deployment steps.
                With thousands of plugins and full customization support, Jenkins makes DevOps workflows smooth,
                fast, and reliable — whether you're deploying simple apps or managing enterprise-grade systems.
            </p>
        </section>

        <!-- CONTACT SECTION -->
        <section id="contact">
            <h2>Contact</h2>
            <div class="contact-box">
                <span>Phone:</span> 0323-2814751 <br>
                <span>Email:</span> abdulrehman.ark911@gmail.com
            </div>
        </section>

    </div>

</body>
</html>