fix: index css styles

This commit is contained in:
Urko. 2023-12-26 19:18:19 +01:00
parent 6a6a8f9d32
commit 4613e2bc60
1 changed files with 49 additions and 7 deletions

View File

@ -4,31 +4,32 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>BTC Pay Checker</title> <title>BTCPayChecker</title>
<style> <style>
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
margin: 0; margin: 0;
padding: 0; padding: 0;
background-color: #f4f4f4; background-color: #191D20;
} }
.container { .container {
width: 80%; width: 80%;
margin: auto; margin: auto;
overflow: hidden; overflow: hidden;
color: #ffffff;
} }
header { header {
background: #50b3a2; background: #191D20;
color: white; color: white;
padding-top: 30px; padding-top: 30px;
min-height: 70px; min-height: 70px;
border-bottom: #e8491d 3px solid; border-bottom: #FF006E 3px solid;
} }
header a { header a {
color: #ffffff; color: #EFEFEF;
text-decoration: none; text-decoration: none;
text-transform: uppercase; text-transform: uppercase;
font-size: 16px; font-size: 16px;
@ -55,7 +56,7 @@
header .highlight, header .highlight,
header .current a { header .current a {
color: #e8491d; color: #FF006E;
font-weight: bold; font-weight: bold;
} }
@ -83,15 +84,38 @@
.number { .number {
color: #61aeee; color: #61aeee;
} }
.get-started-btn {
background-color: #FF006E;
color: white;
border: none;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
cursor: pointer;
border-radius: 5px;
transition: background-color 0.3s, color 0.3s;
}
.get-started-btn:hover {
background-color: #e60062;
color: #ffffff;
}
</style> </style>
</head> </head>
<body> <body>
<header> <header>
<div class="container"> <div class="container">
<div id="branding"> <div id="branding">
<h1><span class="highlight">BTC</span> Pay Checker</h1> <h1><span class="highlight">BTC</span> Pay Checker</h1>
</div> </div>
<!-- Get Started Button -->
<nav> <nav>
<ul> <ul>
<li class="current"><a href="/">Home</a></li> <li class="current"><a href="/">Home</a></li>
@ -103,6 +127,24 @@
</header> </header>
<div class="container"> <div class="container">
<h2>Welcome to BTC Paychecker!</h2>
<p>If you're looking to process orders using bitcoin, you landed in the right place.</p>
<h3>Let's walk through how to use our '/order' POST endpoint. It's like filling out a digital form to tell us what you need!</h3>
<p>Here's a simple breakdown of what you'll need to provide:</p>
<ul>
<li><strong>Order ID:</strong> Just like a unique receipt number, this is the ID for your order.</li>
<li><strong>Client ID:</strong> This is your identification in our system.</li>
<li><strong>Amount:</strong> Tell us how much you're paying, in USD.</li>
<li><strong>Currency:</strong> We need to know the currency type. Make sure it's a valid FiatCurrency.</li>
<li><strong>Client Email:</strong> Where should we send the confirmations? Give us your email.</li>
</ul>
<p><strong>Click 'Get Started' to download our quick & easy PDF guide.</strong></p>
<a href="/get-started" class="get-started-btn" download>Get Started</a>
<p>This guide will help you get set up for everything you need to make business transactions with BTC!</p>
<h2>How to use the /order POST endpoint</h2> <h2>How to use the /order POST endpoint</h2>
<p>This endpoint allows you to create a new order. It requires a JSON body with the following fields:</p> <p>This endpoint allows you to create a new order. It requires a JSON body with the following fields:</p>
<ul> <ul>