Skip to content

Commit

Permalink
Landing page initial
Browse files Browse the repository at this point in the history
  • Loading branch information
@Velikyi
Velikyi committed Aug 1, 2024
1 parent 06f691c commit b568667
Show file tree
Hide file tree
Showing 9 changed files with 89 additions and 37 deletions.
Binary file modified .DS_Store
View file
Binary file not shown.
Binary file modified assets/.DS_Store
View file
Binary file not shown.
Binary file added assets/css/.DS_Store
View file
Binary file not shown.
Binary file added assets/css/images/bg.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
55 changes: 38 additions & 17 deletions assets/css/main.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,10 @@
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
*/

:root {
--main_dark: #1b1b1c;
}

html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
Expand Down Expand Up @@ -1306,7 +1310,7 @@ input, select, textarea {
}

body {
background-image: url("images/overlay.png"), url("images/bg.jpg");
background-image: url("images/overlay.png"), url("images/bg.png");
background-repeat: repeat, no-repeat;
background-size: auto, 100% 100%;
background-attachment: fixed;
Expand Down Expand Up @@ -1366,7 +1370,7 @@ input, select, textarea {

strong, b, h1, h2, h3, h4, h5, h6 {
font-weight: 400;
color: #363636;
color: #ffffff;
}

h1 {
Expand Down Expand Up @@ -1477,7 +1481,7 @@ input, select, textarea {
form textarea {
-webkit-appearance: none;
border: 0;
background: #f4f4f4;
background: #161616;
padding: 0.75em;
width: 100%;
-moz-transition: background-color .25s ease-in-out;
Expand All @@ -1491,7 +1495,7 @@ input, select, textarea {
form input[type="password"]:focus,
form select:focus,
form textarea:focus {
background: #f8f8f8;
background: #3c3636;
}

form input[type="text"],
Expand Down Expand Up @@ -1778,7 +1782,7 @@ input, select, textarea {
#nav a {
position: relative;
display: inline-block;
color: #ffffff;
color: var(--main_dark);
width: 1em;
height: 1em;
line-height: 0.9em;
Expand All @@ -1804,12 +1808,12 @@ input, select, textarea {
content: '';
display: block;
position: absolute;
left: 50%;
bottom: -0.75em;
left: 70%;
bottom: -0.5em;
margin-left: -0.5em;
border-bottom: solid 0em #ffffff;
border-left: solid 0.5em transparent;
border-right: solid 0.5em transparent;
border-bottom: solid 0em var(--main_dark);
border-left: solid 0.3em transparent;
border-right: solid 0.3em transparent;
-moz-transition: border-bottom-width .25s ease-in-out;
-webkit-transition: border-bottom-width .25s ease-in-out;
-ms-transition: border-bottom-width .25s ease-in-out;
Expand All @@ -1819,7 +1823,7 @@ input, select, textarea {
#nav a span {
display: block;
position: absolute;
background: #222222;
background: var(--main_dark);
color: #ffffff;
top: -2.75em;
font-size: 0.3em;
Expand All @@ -1842,7 +1846,7 @@ input, select, textarea {
bottom: -0.4em;
left: 50%;
margin-left: -0.6em;
border-top: solid 0.6em #222222;
border-top: solid 0.6em var(--main_dark);
border-left: solid 0.6em transparent;
border-right: solid 0.6em transparent;
}
Expand Down Expand Up @@ -1947,8 +1951,8 @@ input, select, textarea {
position: relative;
overflow: hidden;
width: 100%;
background: #ffffff;
box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.25);
background: #ffffff00;
/* box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.25); */
-moz-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
-webkit-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
-ms-transition: min-height 0.5s ease-in-out, max-height 0.5s ease-in-out;
Expand All @@ -1966,6 +1970,21 @@ input, select, textarea {
width: 100%;
}

#main > .work {
background-color: var(--main_dark);
border-radius: 1%;
}

#main > .resources {
background-color: var(--main_dark);
border-radius: 1%;
}

#main > .contact {
background-color: var(--main_dark);
border-radius: 1%;
}

#main > .panel.inactive {
opacity: 0;
}
Expand Down Expand Up @@ -1993,6 +2012,7 @@ input, select, textarea {
-webkit-align-items: center;
-ms-align-items: center;
align-items: center;
left: 5%;
}

#main > .panel.intro .pic {
Expand All @@ -2006,8 +2026,9 @@ input, select, textarea {
-webkit-flex-shrink: 0;
-ms-flex-shrink: 0;
flex-shrink: 0;
width: 17em;
height: 100%;
width: 14em;
height: 70%;
left: 4%;
}

#main > .panel.intro .pic:before {
Expand Down Expand Up @@ -2049,7 +2070,7 @@ input, select, textarea {
height: 2.75em;
background: #000;
background: rgba(0, 0, 0, 0.75);
color: #ffffff;
color: var(--main_dark);
text-align: center;
line-height: 2.75em;
font-size: 1.5em;
Expand Down
Binary file added images/.DS_Store
View file
Binary file not shown.
Binary file added images/RSV Logo uten ring 2.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed images/me.jpg
View file
Binary file not shown.
71 changes: 51 additions & 20 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,29 +19,30 @@

<!-- Nav -->
<nav id="nav">
<a href="#" class="icon solid fa-home"><span>Home</span></a>
<a href="#work" class="icon solid fa-folder"><span>Work</span></a>
<a href="#contact" class="icon solid fa-envelope"><span>Contact</span></a>
<a href="https://twitter.com/ajlkn" class="icon brands fa-twitter"><span>Twitter</span></a>
<a href="#" class="icon solid fa-home"><span>Framside</span></a>
<a href="#work" class="icon solid fa-folder"><span>Prosjekt</span></a>
<a href="#resources" class="icon solid fa-book"><span>Ressurser</span></a>
<!-- <a href="#contact" class="icon solid fa-envelope"><span>Kontakt</span></a> -->
</nav>

<!-- Main -->
<div id="main">

<!-- Me -->
<article id="home" class="panel intro">
<a class="jumplink pic">
<img src="images/RSV Logo uten ring 2.png" alt="" />
</a>
<header>
<h1>Jane Doe</h1>
<p>Senior Astral Projectionist</p>
<h1>Rong Sound & Vision</h1>
<p>Petter Rong</p>
<a href="mailto:petter@rongsv.no" class="icon solid fa-envelope" style="color: #a37a7a;">&nbsp; petter@rongsv.no</a>
</header>
<a href="#work" class="jumplink pic">
<span class="arrow icon solid fa-chevron-right"><span>See my work</span></span>
<img src="images/me.jpg" alt="" />
</a>
</article>

</article>
<!-- Resources -->
<!-- Work -->
<article id="work" class="panel">
<article id="work" class="panel work">
<header>
<h2>Work</h2>
</header>
Expand Down Expand Up @@ -91,29 +92,59 @@ <h2>Work</h2>
</div>
</section>
</article>

<article id="resources" class="panel resources">
<header>
<h2>Ressurser</h2>
</header>
<p>
Linker til diverse ressurser:
</p>

<section>
<div class="row">
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic01.jpg" alt=""></a>
</div>
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic02.jpg" alt=""></a>
</div>
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic03.jpg" alt=""></a>
</div>
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic04.jpg" alt=""></a>
</div>
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic05.jpg" alt=""></a>
</div>
<div class="col-4 col-6-medium col-12-small">
<a href="#" class="image fit"><img src="images/pic06.jpg" alt=""></a>
</div>
</div>
</section>
</article>
<!-- Contact -->
<article id="contact" class="panel">
<article id="contact" class="panel contact">
<header>
<h2>Contact Me</h2>
<h2>Kontakt</h2>
</header>
<form action="#" method="post">
<div>
<div class="row">
<div class="col-6 col-12-medium">
<input type="text" name="name" placeholder="Name" />
<input type="text" name="name" placeholder="Navn" />
</div>
<div class="col-6 col-12-medium">
<input type="text" name="email" placeholder="Email" />
</div>
<div class="col-12">
<input type="text" name="subject" placeholder="Subject" />
<input type="text" name="subject" placeholder="Emne" />
</div>
<div class="col-12">
<textarea name="message" placeholder="Message" rows="6"></textarea>
<textarea name="message" placeholder="Melding" rows="6"></textarea>
</div>
<div class="col-12">
<input type="submit" value="Send Message" />
<input type="submit" value="Send" />
</div>
</div>
</div>
Expand All @@ -125,7 +156,7 @@ <h2>Contact Me</h2>
<!-- Footer -->
<div id="footer">
<ul class="copyright">
<li>&copy; Untitled.</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
<li>&copy; Rong Sound & Vision - 2024</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>

Expand Down

0 comments on commit b568667

Please sign in to comment.