Skip to content

Commit

Permalink
nomadcoders#4.11 Tolv Coding
Browse files Browse the repository at this point in the history
  • Loading branch information
serranoarevalo committed Mar 6, 2020
1 parent e158d13 commit 3687c13
Show file tree
Hide file tree
Showing 6 changed files with 145 additions and 236 deletions.
2 changes: 1 addition & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@
- [x] [https://paint-box.com/](https://paint-box.com/)
- [x] [http://10x19.co/](http://10x19.co/)
- [x] [http://www.z-o-o.fr/](http://www.z-o-o.fr/)
- [ ] [https://schwartzmedia.com.au/](https://schwartzmedia.com.au/)
- [x] [https://schwartzmedia.com.au/](https://schwartzmedia.com.au/)
- [ ] [https://tolv.dk/](https://tolv.dk/)
- [ ] [https://rodicdavidson.co.uk/](https://rodicdavidson.co.uk/)
- [ ] [https://beige.de/](https://beige.de/)
Expand Down
2 changes: 1 addition & 1 deletion dist/css/styles.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

155 changes: 47 additions & 108 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -8,120 +8,59 @@
<title>(S)CSS Masterclass</title>
</head>
<body>
<header>
<nav>
<ul>
<li>Products</li>
<li>Stockists</li>
<li>About us</li>
</ul>
</nav>
<h1 class="logo">
T
<div>o</div>
lv
</h1>
<span>🔍</span>
</header>
<main>
<div class="hero">
<div class="hero__photo"></div>
<h2>News that lasts.</h2>
<div class="hero__img"></div>
<div class="hero__text">
<h2>
Lift the blind to let in the light. A moment of calm before the day
begins.
</h2>
<span
>Featuring <a href="#">Cherry sofa</a> and
<a href="#">Kile coffee table</a></span
>
</div>
</div>
<div class="banner">
<h3 class="banner__title">Time for Living</h3>
<p>
<span>About</span> Schwartz Media publishes intelligent news and
current affairs that breaks the 24-hour news cycle. We offer a nuanced
examination of Australia and the world, focused on fresh insight and
literary expression. Our audience reads to know, not just to agree. We
invest in long-form journalism where the issues demand it, providing
writing of a quality that makes difficult topics clear. Schwartz Media
publishes Australia’s most respected writers across The Saturday
Paper, The Monthly magazine and the daily podcast 7am, alongside our
sister publications, Quarterly Essay and Australian Foreign Affairs.
Take time for life’s little moments. Browsing the news as you eat
breakfast. Setting the table for hungry guests. Sinking in to your
favourite armchair. At Tolv, your daily rituals are at the heart of
our design. We make furniture to give you your best day, every day.
</p>
<span> Find out more <a href="#">About us</a> </span>
</div>
<section class="products">
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
</div>
<img src="https://source.unsplash.com/random/500x360" />
</article>
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
<a href="#" class="btn">Learn more</a>
</div>
<img src="https://source.unsplash.com/random/500x360" />
</article>
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
</div>
<img src="https://source.unsplash.com/random/500x360" />
</article>
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
</div>
<img src="https://source.unsplash.com/random/500x360" />
</article>
<div class="line">
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<img src="https://source.unsplash.com/random/500x360" />
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
</div>
</article>
<article class="product">
<div>
<h4 class="product__category">Journalism</h4>
<img src="https://source.unsplash.com/random/500x360" />
<p class="product__description">
Our journalists create in-depth, independent, original public
interest reporting, focusing on storytelling and insight.
</p>
<a href="#" class="btn">Learn more</a>
</div>
</article>
</div>
<section class="gallery">
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
<div class="gallery__item"></div>
</section>
<div class="links">
<div class="link">
<h4>Careers</h4>
<span>Work at the country’s leading independent publisher. </span>
<a href="#" class="btn">Learn more</a>
</div>
<div class="link">
<h4>Careers</h4>
<span>Work at the country’s leading independent publisher. </span>
<a href="#" class="btn">Learn more</a>
</div>
<div class="link">
<h4>Careers</h4>
<span>Work at the country’s leading independent publisher. </span>
<a href="#" class="btn">Learn more</a>
</div>
</div>
</main>
<footer>
<div class="footer__top">
<span>Schwartz</span>
<ul>
<li>Schwartz Media</li>
<li>Schwartz Media</li>
<li>Schwartz Media</li>
</ul>
</div>
</footer>
</body>
</html>
19 changes: 0 additions & 19 deletions src/scss/_elements.scss
Original file line number Diff line number Diff line change
@@ -1,19 +0,0 @@
%categoryTitle {
font-weight: 600;
font-size: 22px;
margin-bottom: 50px;
}

%btn {
text-decoration: none;
color: inherit;
border: $border;
padding: 10px 40px;
font-weight: 500;
border-radius: 99px;
transition: background-color 0.2s linear;
&:hover {
background-color: black;
color: white;
}
}
3 changes: 1 addition & 2 deletions src/scss/_variables.scss
Original file line number Diff line number Diff line change
@@ -1,2 +1 @@
$fontMedium: 30px;
$border: 0.5px solid rgba(0, 0, 0, 0.3);
$orange: #ff6429;
Loading

0 comments on commit 3687c13

Please sign in to comment.