Skip to content

add update in layout #29

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
beatrizAdalab wants to merge 1 commit into
base: master
Choose a base branch
from
+125 −95
Open

add update in layout #29

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
207 changes: 113 additions & 94 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,111 +49,130 @@

<body>
<header>
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col header-container">
<h1 class="page-header">Coffee & Code</h1>
<h4 class="sub-heading">Social Coding in Coffee Shops</h4>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</div>
</header>



<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title aboutus-card">
<h2 class="mdl-card__title-text card-headers">Who We Are</h2>
</div>
<div class="mdl-card__supporting-text">
Started in 2011 out of <a href="https://heatsynclabs.org">Heatsync Labs</a>, Coffee & Code started as a social coding program to bring developers from all over the Valley into develop and work with eachother. Since then several businesses have resulted from projects being founded inside of Coffee & Code.
<div class="container-header">
<div class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col header-container">
<h1 class="page-header">Coffee & Code</h1>
<h4 class="sub-heading">Social Coding in Coffee Shops</h4>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</div>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>

</header>


<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title eastvalley-card">
<h2 class="mdl-card__title-text card-headers">East Valley</h2>
</div>
<div class="mdl-card__supporting-text">
The original Coffee & Code based out of Heatsync Labs in Mesa. This meetup was started in 2011 and is still going strong today!
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="https://www.meetup.com/Coffee-and-Code-East-Valley/" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
</div>

<div class="mdl-card__menu">
<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Coffee-and-Code-East-Valley/" title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Coffee-and-Code-East-Valley/" title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
<main>
<div class="container-page">
<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title aboutus-card">
<h2 class="mdl-card__title-text card-headers">Who We Are</h2>
</div>
<div class="mdl-card__supporting-text">
Started in 2011 out of <a href="https://heatsynclabs.org">Heatsync Labs</a>, Coffee & Code started as a
social
coding program to bring developers from all over the Valley into develop and work with eachother. Since then
several businesses have resulted from projects being founded inside of Coffee & Code.
</div>
</div>
</div>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>


<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title uptown-card">
<h2 class="mdl-card__title-text card-headers">Phoenix Uptown</h2>
</div>
<div class="mdl-card__supporting-text">
Started inside of a bookstore. This is an amazing spot to grab some coffee and sit down and hack out.
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="http://www.meetup.com/Coffee-Code-Phoenix/" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
</div>
<div class="mdl-card__menu">
<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Coffee-Code-Phoenix/" title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Coffee-Code-Phoenix/" title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
</div>
</div>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>


<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title downtown-card">
<h2 class="mdl-card__title-text card-headers">Downtown Phoenix</h2>
</div>
<div class="mdl-card__supporting-text">
Downtown Phoenix is the newest addition to our Coffee & Code Lineup. We have recently brought it back after taking a 6 month hiatus. We are reintroducing it inside of Galvanize's Phoenix Location!
<div class="mdl-cell mdl-cell--2-col"></div>
</section>



<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title eastvalley-card">
<h2 class="mdl-card__title-text card-headers">East Valley</h2>
</div>
<div class="mdl-card__supporting-text">
The original Coffee & Code based out of Heatsync Labs in Mesa. This meetup was started in 2011 and is still
going strong today!
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="https://www.meetup.com/Coffee-and-Code-East-Valley/"
class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
</div>

<div class="mdl-card__menu">
<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Coffee-and-Code-East-Valley/"
title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Coffee-and-Code-East-Valley/"
title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
</div>
</div>
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="https://www.meetup.com/Coffee-Code-Phoenix" class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>


<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title uptown-card">
<h2 class="mdl-card__title-text card-headers">Phoenix Uptown</h2>
</div>
<div class="mdl-card__supporting-text">
Started inside of a bookstore. This is an amazing spot to grab some coffee and sit down and hack out.
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="http://www.meetup.com/Coffee-Code-Phoenix/"
class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
</div>
<div class="mdl-card__menu">
<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Coffee-Code-Phoenix/"
title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Coffee-Code-Phoenix/"
title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
</div>
</div>
</div>
<div class="mdl-card__menu">

<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Downtown-Phoenix-Coffee-and-Code/" title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Downtown-Phoenix-Coffee-and-Code/" title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>


<section class="mdl-grid">
<div class="mdl-cell mdl-cell--2-col"></div>
<div class="mdl-cell mdl-cell--8-col transparent-block">
<div class="demo-card-wide mdl-card mdl-shadow--2dp">
<div class="mdl-card__title downtown-card">
<h2 class="mdl-card__title-text card-headers">Downtown Phoenix</h2>
</div>
<div class="mdl-card__supporting-text">
Downtown Phoenix is the newest addition to our Coffee & Code Lineup. We have recently brought it back after
taking a 6 month hiatus. We are reintroducing it inside of Galvanize's Phoenix Location!
</div>
<div class="mdl-card__actions mdl-card--border">
<a href="https://www.meetup.com/Coffee-Code-Phoenix"
class="mdl-button mdl-button--colored mdl-js-button mdl-js-ripple-effect">
View Meetup
</a>
</div>
<div class="mdl-card__menu">

<a href="https://twitter.com/home?status=https%3A//www.meetup.com/Downtown-Phoenix-Coffee-and-Code/"
title="Share on Twitter" class="share-link"><img src="images/twitter.png"></a>
<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A//www.meetup.com/Downtown-Phoenix-Coffee-and-Code/"
title="Share on Facebook" class="share-link"><img src="images/facebook-box.png"></a>
</div>
</div>
</div>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>
</div>
<div class="mdl-cell mdl-cell--2-col"></div>
</section>

</main>



<footer class="mdl-mini-footer">
Expand Down
13 changes: 12 additions & 1 deletion styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,14 @@ body::before {

}

.container-page{
padding-bottom: 20px;
}

.container-header{
padding-top: 20px;
}

/*Mobile and small screen rules*/
@media (max-width: 512px) and (min-resolution: 1.5dppx),
(max-width: 1024px) and (max-resolution: 1.5dppx) {
Expand All @@ -25,6 +33,10 @@ body::before {
font-weight: 500;
}

.container-header{
padding-top: 0px;
}

.card-headers {
font-size: 2.5em;
font-weight: 400;
Expand Down Expand Up @@ -133,7 +145,6 @@ body {
}

.mdl-mini-footer {
height: 28vh;
background-color: #f5f2e8;
color: grey;
}
Expand Down