Mikaela Sturk business site (Maliziosos) #66
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1 +1,3 @@ | ||
| # js-project-business-site | ||
|
|
||
| https://malizioso-test1.netlify.app/ |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
|
|
||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Malizioso</title> | ||
| <link rel="stylesheet" href="style.css"> | ||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <header> | ||
| <a href="index.html"> <img src="img/cropped-logo-200px.jpg" | ||
| alt="logga med tre hundar på och kennelnamnet Malizioso"></a> | ||
| <div class="topnav"> | ||
| <a href="index.html">Hem</a> | ||
| <a href="kennel.html">Kennel</a> | ||
| <a href="puppies.html">Valpar</a> | ||
| <a href="contact.html">Kontakt</a> | ||
| </div> | ||
| </header> | ||
|
|
||
| <main> | ||
| <h2>Kontakta oss</h2> | ||
|
|
||
| <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem quae distinctio exercitationem quam accusamus. Dolor, consectetur non, tempore dignissimos beatae asperiores suscipit autem optio amet esse voluptatem nobis vel dicta. <br> | ||
| Lorem ipsum dolor sit amet consectetur adipisicing elit. Illo, rerum quidem. Tempore reiciendis laudantium at eveniet doloremque omnis quam velit totam, fuga amet, quibusdam dolorum magni debitis placeat ex enim!</p> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <a target="_blank" href="https://instagram.com">Instagram</a> | ||
| <a target="_blank" href="https://facebook.com">Facebook</a> | ||
| <a target="_blank" href="https://skk.se">SKK</a> | ||
| <a target="_blank" href="https://lagottoklubben.se">SLRK</a> | ||
| </footer> | ||
|
Comment on lines
+33
to
+38
There was a problem hiding this comment. Looks great! 🌟 The footer is clean and minimalistic — I really like the consistent structure of the links and how you’ve used target="_blank" to open them in new tabs. It’s simple, readable, and functional. |
||
| </body> | ||
|
|
||
| </html> | ||
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,268 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="SV"> | ||
|
|
||
| <head> | ||
|
|
||
| <meta charset="UTF-8"> | ||
| <meta | ||
| name="viewport" | ||
| content="width=device-width, initial-scale=1.0"> | ||
| <title>Malizioso</title> | ||
| <link | ||
| rel="stylesheet" | ||
| href="style.css"> | ||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <header> | ||
|
|
||
| <div class="sticky-bar"> | ||
|
|
||
| <div class="nav-wrap"> | ||
| <nav class="off-screen-menu"> | ||
| <a href="index.html">HEM</a> | ||
| <a href="kennel.html">KENNEL</a> | ||
| <a href="puppies.html">VALPAR</a> | ||
| <a href="contact.html">KONTAKT</a> | ||
| </nav> | ||
|
|
||
| <nav> | ||
| <div class="ham-menu"> | ||
| <span></span> | ||
| <span></span> | ||
| <span></span> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
|
|
||
| <nav class="nav nav-desktop"> | ||
| <a href="index.html">HEM</a> | ||
| <a href="kennel.html">KENNEL</a> | ||
| <a href="puppies.html">VALPAR</a> | ||
| <a href="contact.html">KONTAKT</a> | ||
| </nav> | ||
|
|
||
| </div> | ||
|
|
||
| <a href="index.html"> | ||
| <img | ||
| class= "hero-image" | ||
| src="img/header.png" | ||
| alt="logga med tre hundar på och kennelnamnet Malizioso"> | ||
| </a> | ||
|
|
||
| </header> | ||
|
|
||
| <main> | ||
| <h1>Välkommen till Malizioso's kennel!</h1> | ||
|
|
||
| <h2>På vår hemsida kan läsa om uppkommande kullar, vår uppfödning och andra nyheter!</h2> | ||
|
|
||
| <section class="card-grid"> | ||
|
There was a problem hiding this comment. Looks like a very clean use of semantics, good work! |
||
|
|
||
| <article class="card"> | ||
|
|
||
| <h3>NYHETER</h3> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet consectetur, adipisicing elit. Architecto velit voluptates, facilis labore eligendi dolorum non, illo, suscipit placeat nisi illum soluta alias? Neque dolor accusamus quas, distinctio atque modi! | ||
| </p> | ||
|
|
||
| </article> | ||
|
|
||
| <article class="card"> | ||
|
|
||
| <h3>TEXT</h3> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus perspiciatis expedita corrupti aliquid tempore recusandae porro iste quae accusantium, ea qui, repudiandae minima dolorem tempora non consequatur fugit, sit cum? | ||
| </p> | ||
|
|
||
| </article> | ||
|
|
||
| <article class="card"> | ||
|
|
||
| <h3>TEXT</h3> | ||
|
|
||
| <p> | ||
| Lorem ipsum dolor sit amet consectetur adipisicing elit. Ratione libero est at iure voluptatem vel similique | ||
| maiores praesentium sequi temporibus! Error mollitia repellendus ipsa ut praesentium cum sapiente, perferendis | ||
| dolore. | ||
| </p> | ||
|
|
||
|
|
||
| </article> | ||
|
|
||
| <article class="card"> | ||
|
|
||
| <h3>TEXT</h3> | ||
|
|
||
| <p> | ||
| Lorem ipsum, dolor sit amet consectetur adipisicing elit. Vero, suscipit explicabo. Debitis tenetur corporis | ||
| temporibus laborum pariatur facilis, recusandae voluptatum voluptas itaque voluptates fugit praesentium qui, x | ||
| explicabo officiis molestiae nam. | ||
| </p> | ||
|
|
||
| </article> | ||
|
|
||
| </section> | ||
|
|
||
| </main> | ||
|
|
||
| <form | ||
| action="https://httpbin.org/anything" | ||
| method="POST" | ||
| target="_blank" | ||
| accept-charset="UTF-8"> | ||
|
|
||
| <h3>INTRESSEANMÄLAN VALP</h3> | ||
|
|
||
| <p> | ||
| Vi väljer ut våra köpare med omsorg. <br> För oss är det viktigt att våra hjärtan hamnar i rätt familj. | ||
| </p> | ||
|
|
||
| <label> | ||
|
|
||
| <span>För- och efternamn</span> | ||
|
There was a problem hiding this comment. I am wondering why you chose to add |
||
|
|
||
| <input | ||
| type="text" | ||
| name="fullName" | ||
| placeholder="Namn" | ||
| required> | ||
|
|
||
| </label> | ||
|
|
||
| <label> | ||
|
|
||
| <span>Hemort</span> | ||
|
|
||
| <input | ||
| type="text" | ||
| name="homeTown" | ||
| placeholder="Ekerö" | ||
| required> | ||
|
|
||
| </label> | ||
|
|
||
| <label> | ||
|
|
||
| <span>Mobilnummer</span> | ||
|
|
||
| <input | ||
| type="tel" | ||
| name="phoneNumber" | ||
| pattern="^07\\d{8}$" | ||
| placeholder="070 - 123 45 67" | ||
| required> | ||
|
|
||
| </label> | ||
|
|
||
| <label> | ||
|
|
||
| <span>Mailadress</span> | ||
|
|
||
| <input | ||
| type="email" | ||
| name="email" | ||
| placeholder="[email protected]" | ||
| required> | ||
|
|
||
| </label> | ||
|
|
||
| <label> | ||
|
There was a problem hiding this comment. Empty label is a bit confusing since it's unclear what this label is for, would be good to specify it maybe. All other inputs seems very clear, and great that they have placeholders making it easier for users! |
||
|
|
||
| <span>*Drop down*</span> | ||
|
|
||
| <select | ||
| name="dropdown" | ||
| required > | ||
| <option | ||
| class="option-placeholder" | ||
| value="" | ||
| disabled | ||
| selected | ||
| hidden>Välj här...</option> | ||
|
|
||
| <option value="alt1">Alternativ 1</option> | ||
| <option value="alt2">Alternativ 2</option> | ||
| <option value="alt3">Alternativ 3</option> | ||
| <option value="alt4">Alternativ 4</option> | ||
| </select> | ||
| </label> | ||
|
|
||
|
|
||
| <div class="bottom-form-section"> | ||
|
|
||
|
|
||
| <label> | ||
|
|
||
| <span>Hur har ni planerat för att lösa första tiden hemma?</span> | ||
|
|
||
| <textarea | ||
| name= "firstTimeHome" | ||
| placeholder="T.ex Jag har semester.../Jag jobbar hemma..." | ||
| rows="4" | ||
| required> | ||
| </textarea> | ||
|
|
||
| </label> | ||
|
|
||
| <label> | ||
| <span>Övriga kommentarer</span> | ||
|
|
||
| <textarea | ||
| name= "comments" | ||
| placeholder="Meddelande..." | ||
| rows="4"> | ||
| </textarea> | ||
|
|
||
| </label> | ||
|
|
||
| <button type="submit"onclick="alert('Tack för visat intresse, vi hör av oss!')">Skicka</button> | ||
|
|
||
| </div> | ||
|
|
||
| </form> | ||
|
|
||
| <footer> | ||
|
There was a problem hiding this comment. Overall, very clean and easy to follow structure, good job, keep it up! |
||
|
|
||
| <div class="bottom-nav"> | ||
|
|
||
| <a | ||
| target="_blank" | ||
| href="https://instagram.com"> | ||
| </a> | ||
|
|
||
| <a | ||
| target="_blank" | ||
| href="https://facebook.com"> | ||
| </a> | ||
|
|
||
| <a | ||
| target="_blank" | ||
| href="https://skk.se"> | ||
| SKK | ||
| </a> | ||
|
|
||
| <a | ||
| target="_blank" | ||
| href="https://lagottoklubben.se"> | ||
| SLRK | ||
| </a> | ||
|
|
||
| </div> | ||
|
|
||
| <small class="copyright">Copyright © Mikaela Sturk</small> | ||
|
|
||
| </footer> | ||
|
|
||
| <script src="script.js"></script> | ||
|
|
||
| </body> | ||
|
|
||
| </html> | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
|
|
||
| <head> | ||
|
|
||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Malizioso</title> | ||
| <link rel="stylesheet" href="style.css"> | ||
|
|
||
| </head> | ||
|
|
||
| <body> | ||
|
|
||
| <header> | ||
| <a href="index.html"> <img src="img/cropped-logo-200px.jpg" | ||
| alt="logga med tre hundar på och kennelnamnet Malizioso"></a> | ||
| <div class="topnav"> | ||
| <a href="index.html">Hem</a> | ||
| <a href="kennel.html">Kennel</a> | ||
| <a href="puppies.html">Valpar</a> | ||
| <a href="contact.html">Kontakt</a> | ||
| </div> | ||
| </header> | ||
|
|
||
| <main> | ||
| <h2>Kennel</h2> | ||
|
|
||
| <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Rem quae distinctio exercitationem quam accusamus. Dolor, consectetur non, tempore dignissimos beatae asperiores suscipit autem optio amet esse voluptatem nobis vel dicta. | ||
| <br> | ||
| Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa ad nobis quia autem praesentium totam, corrupti optio dicta dolor eveniet repellendus harum odio beatae, quis temporibus vero veritatis delectus facere.</p> | ||
| </main> | ||
|
|
||
| <footer> | ||
| <a target="_blank" href="https://instagram.com">Instagram</a> | ||
| <a target="_blank" href="https://facebook.com">Facebook</a> | ||
| <a target="_blank" href="https://skk.se">SKK</a> | ||
| <a target="_blank" href="https://lagottoklubben.se">SLRK</a> | ||
| </footer> | ||
| </body> | ||
|
|
||
| </html> |
Empty file.
Empty file.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Great organizing of a navigation, very clean!