diff --git a/encoder/domain.php b/encoder/domain.php index 00edbb5..fab8ed5 100755 --- a/encoder/domain.php +++ b/encoder/domain.php @@ -25,89 +25,86 @@ if (file_exists($jsonFile)) { } ?> +
+
+
+
+
+ + " /> - -
-
-
-
- - - " /> + + " /> - - " /> - - - " required /> + + " required /> -
-
- - -
+
+
+ +
+
-
- -
- -
By checking this you authorise the server operator to run Certbot and modify nginx configuration for the supplied domain(s).
-
+
+ +
+ +
By checking this you authorise the server operator to run Certbot and modify nginx configuration for the supplied domain(s).
+
-
- Certbot / Let's Encrypt Terms & Conditions -  •  - Privacy Policy -
+
+ Certbot / Let's Encrypt Terms & Conditions +  •  + Privacy Policy +
-
- - -
+
+ + +
-
- Why ports 80 and 443 are required - 
+                    

+                        Why ports 80 and 443 are required
+                        
 - Port 80 (HTTP) is used by Certbot for the HTTP-01 challenge: Let's Encrypt connects over HTTP to verify you control the domain.
 - Port 443 (HTTPS) is required to serve TLS traffic after the certificate is issued. Nginx must accept HTTPS on port 443 so browsers and streaming clients can connect securely.
 
 
 Ensure both ports are reachable from the public internet and forwarded to this server's IP. If you use a firewall, add rules to allow inbound TCP 80 and 443.
                             

-                        

-                    
-
+
+
+
- - + var ok = document.getElementById('agree_tc').checked; + if (!ok) { + e.preventDefault(); + alert('You must agree to the terms and confirm ports 80 and 443 are forwarded.'); + } + }); + \ No newline at end of file diff --git a/encoder/header.php b/encoder/header.php index 2006174..b063b96 100755 --- a/encoder/header.php +++ b/encoder/header.php @@ -630,6 +630,121 @@ include 'static.php'; max-width: 100% } } + + /* ===== CERT REQUEST PAGE ADDON ===== */ + + /* wrapper */ + .wrap { + width: 100%; + } + + /* labels */ + .wrap label { + display: block; + margin-top: 14px; + font-size: 14px; + font-weight: 600; + color: var(--muted); + } + + /* inputs */ + .wrap input[type=text], + .wrap input[type=email], + .wrap select { + width: 100%; + padding: 14px 12px; + border-radius: 10px; + border: 1px solid var(--border); + background: #020617; + color: var(--text); + font-size: 14px; + transition: .2s; + } + + .wrap input:focus, + .wrap select:focus { + outline: none; + border-color: var(--accent); + box-shadow: 0 0 0 2px rgba(56, 189, 248, .15); + } + + /* grid row */ + .wrap .row { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 16px; + margin-top: 12px; + } + + /* checkbox block */ + .wrap .checkbox { + display: flex; + gap: 10px; + margin-top: 18px; + align-items: flex-start; + } + + .wrap .checkbox input { + margin-top: 4px; + accent-color: #38bdf8; + } + + /* links */ + .wrap .links { + margin-top: 14px; + font-size: 14px; + } + + .wrap .links a { + color: #38bdf8; + text-decoration: none; + } + + .wrap .links a:hover { + text-decoration: underline; + } + + /* buttons row */ + .wrap .actions { + display: flex; + gap: 12px; + margin-top: 18px; + } + + .wrap .ghost { + background: transparent; + border: 1px solid var(--border); + color: var(--text); + } + + /* info note box */ + .wrap .note { + margin-top: 20px; + padding: 16px; + border-radius: var(--radius); + background: rgba(255, 255, 255, .03); + border: 1px solid var(--border); + font-size: 13px; + line-height: 1.6; + } + + /* code block */ + .wrap pre { + margin-top: 10px; + padding: 12px; + border-radius: 10px; + background: #020617; + border: 1px dashed var(--border); + color: #cbd5e1; + font-size: 13px; + } + + /* responsive */ + @media(max-width:700px) { + .wrap .row { + grid-template-columns: 1fr; + } + }