| <!doctype html> |
| <html lang="en"> |
| <head> |
| <meta charset="utf-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1"> |
| <meta name="description" content=""> |
| <meta name="author" content="Skolo Online"> |
| <meta name="generator" content="#"> |
| <title>Skolo DALLE2</title> |
|
|
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous"> |
|
|
| <style> |
| .bd-placeholder-img { |
| font-size: 1.125rem; |
| text-anchor: middle; |
| -webkit-user-select: none; |
| -moz-user-select: none; |
| user-select: none; |
| } |
| |
| @media (min-width: 768px) { |
| .bd-placeholder-img-lg { |
| font-size: 3.5rem; |
| } |
| } |
| |
| .b-example-divider { |
| height: 3rem; |
| background-color: rgba(0, 0, 0, .1); |
| border: solid rgba(0, 0, 0, .15); |
| border-width: 1px 0; |
| box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15); |
| } |
| |
| .b-example-vr { |
| flex-shrink: 0; |
| width: 1.5rem; |
| height: 100vh; |
| } |
| |
| .bi { |
| vertical-align: -.125em; |
| fill: currentColor; |
| } |
| |
| .nav-scroller { |
| position: relative; |
| z-index: 2; |
| height: 2.75rem; |
| overflow-y: hidden; |
| } |
| |
| .nav-scroller .nav { |
| display: flex; |
| flex-wrap: nowrap; |
| padding-bottom: 1rem; |
| margin-top: -1px; |
| overflow-x: auto; |
| text-align: center; |
| white-space: nowrap; |
| -webkit-overflow-scrolling: touch; |
| } |
| </style> |
|
|
|
|
| </head> |
| <body> |
|
|
| <nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark"> |
| <div class="container-fluid"> |
| <a class="navbar-brand" href="#">Fixed navbar</a> |
| <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> |
| <span class="navbar-toggler-icon"></span> |
| </button> |
| <div class="collapse navbar-collapse" id="navbarCollapse"> |
|
|
| <ul class="navbar-nav me-auto mb-2 mb-md-0"> |
| <li class="nav-item"> |
| <a class="nav-link active" aria-current="page" href="#">Home</a> |
| </li> |
| <li class="nav-item"> |
| <a class="nav-link" href="#">Link</a> |
| </li> |
| <li class="nav-item"> |
| <a class="nav-link disabled">Disabled</a> |
| </li> |
| </ul> |
|
|
| </div> |
| </div> |
| </nav> |
|
|
| <main class="container mt-5"> |
| <div class="bg-light p-5 rounded"> |
|
|
| <h1>Create a new image</h1> |
|
|
| <p class="lead"> |
| This website uses the latest in DALLE-2 from OpenAI to create new images using Artificial Intelligence. |
| Enter any prompt to generate your image. You have full legal access to the images generated etc etc. |
| </p> |
|
|
| <form class="" action="#" method="post"> |
|
|
| <div class="mb-3"> |
| <label for="prompt" class="form-label">Enter your Prompt</label> |
| <input type="text" class="form-control" name="prompt" id="prompt" placeholder="A pencil illustration of a money driving a bicycle" required> |
| </div> |
|
|
| <button type="submit" class="btn btn-primary">GENERATE IMAGE</button> |
|
|
| </form> |
|
|
| <br> |
| <br> |
|
|
| <div class="row"> |
| {% for image in images %} |
| <div class="col-lg-4"> |
| <img src="{{image}}" class="img-fluid" alt="OpenAI DALLE2 Image Generation"> |
| </div> |
| {% endfor %} |
| </div> |
|
|
|
|
| </div> |
| </main> |
|
|
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script> |
|
|
| </body> |
| </html> |
