Skip to content

Commit

Permalink
More updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@elizabethengelman
elizabethengelman committed Sep 15, 2023
1 parent b3a604b commit ef98e3e
Show file tree
Hide file tree
Showing 3 changed files with 121 additions and 79 deletions.
8 changes: 4 additions & 4 deletions Gemfile.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ GEM
minitest (~> 5.1)
tzinfo (~> 1.1)
zeitwerk (~> 2.2, >= 2.2.2)
addressable (2.8.1)
addressable (2.8.5)
public_suffix (>= 2.0.2, < 6.0)
coffee-script (2.4.1)
coffee-script-source
Expand All @@ -16,7 +16,7 @@ GEM
colorator (1.1.0)
commonmarker (0.17.13)
ruby-enum (~> 0.5)
concurrent-ruby (1.1.10)
concurrent-ruby (1.2.2)
dnsruby (1.61.7)
simpleidn (~> 0.1)
em-websocket (0.5.3)
Expand Down Expand Up @@ -217,7 +217,7 @@ GEM
kramdown-parser-gfm (1.1.0)
kramdown (~> 2.0)
liquid (4.0.3)
listen (3.7.1)
listen (3.8.0)
rb-fsevent (~> 0.10, >= 0.10.3)
rb-inotify (~> 0.9, >= 0.9.10)
mercenary (0.3.6)
Expand Down Expand Up @@ -248,7 +248,7 @@ GEM
rb-fsevent (0.11.2)
rb-inotify (0.10.1)
ffi (~> 1.0)
rexml (3.2.5)
rexml (3.2.6)
rouge (3.26.0)
ruby-enum (0.9.0)
i18n
Expand Down
84 changes: 84 additions & 0 deletions css/cocktail-style.css
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,84 @@
html {
color: #222;
font-size: 1em;
}

body {
background: radial-gradient(circle at 40% 40%, #ffeea4 25%, transparent 26%),radial-gradient(circle at 60% 60%, #ffeea480 25%, transparent 26%);
background-size: 6em 6em;
background-color: #ffffff;
}

.content {
text-align: left;
color: #0a1ca4;
padding: 5%;
}

.color-block {
background-color: #ffeea4;
border-radius: 10%;
padding: 2%;
margin: 2%;
}

.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: #FF9A86;
color: white;
text-align: center;
}

.cocktails {
font-family: 'Roboto Mono', monospace;
width: 95%;
}

h1.title {
font-size: 700%;
font-family: "Sacramento", cursive;
color: #0a1ca4;
}

.header-container {
display: flex;
align-items: center;
}

ul {
list-style-type: none;
padding-left: 0px;
}

li.cocktail {
display: flex;
align-items: center;
margin: 5%;
font-size: 150%;
}

li.cocktail.first-cocktail {
margin-bottom: 12%;
}

li img {
padding-right: 8%;
}

.cocktail-title{
font-family: "Playfair Display", serif;
font-size: 105%;
}

.cocktail-desc {
}

.footer{
text-align: center;
/* font-family: 'Playfair Display', serif; */
padding: 2%;

}
108 changes: 33 additions & 75 deletions micahs-cocktail-menu.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,104 +4,62 @@

<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/cocktail-style.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<!-- <link
href="https://fonts.googleapis.com/css2?family=Oleo+Script+Swash+Caps&family=Playfair+Display&family=Roboto+Mono:wght@600&family=Sacramento&display=swap"
rel="stylesheet"
/> -->
<link
href="https://fonts.googleapis.com/css2?family=Oleo+Script+Swash+Caps&family=Playfair+Display&family=Roboto:ital,wght@0,100;1,400&family=Sacramento&display=swap"
href="https://fonts.googleapis.com/css2?family=Oleo+Script+Swash+Caps&family=Playfair+Display:wght@800&family=Roboto+Mono:wght@400&family=Sacramento&display=swap"
rel="stylesheet"
/>
<div class="content">
<div class="color-block">
<div class="header-container">
<h1 class="title">Cocktails</h1>
<img
class="stars"
style="padding-left: 15px"
width="12%"
height="12%"
src="assets/images/shines.png"
/>
</div>
<div class="sub-header"></div>

<style>
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: red;
color: white;
text-align: center;
}

.title {
font-size: 10rem;
}

.desc {
}

/* @media only screen and (max-width: 400px) {
h1 {
font-size: 2rem;
}
} */
</style>

<div style="text-align: left; color: #0a1ca4">
<div class="header-container" style="display: flex">
<h1
class="title"
style="
line-height: 1.5;
font-family: 'Sacramento', cursive;
color: #0a1ca4;
padding-left: 50px;
"
>
Cocktails
</h1>
<img
style="padding-top: 80px; padding-left: 15px"
width="5%"
height="5%"
src="assets/images/shines.png"
/>
</div>
<div class="sub-header"></div>

<div class="content" style="font-family: 'Roboto'">
<!-- <div style="margin: 150"> -->
<div>
<ul style="list-style-type: none">
<li style="padding: 10; display: flex">
<div class="cocktails">
<ul>
<li class="cocktail first-cocktail">
<img
width="20%"
height="20%"
width="25%"
height="25%"
src="/assets/images/high-ball-glass.png"
/>
<div>
<div style="font-family: 'Playfair Display', serif">
Gush Monster
</div>
<div class="desc">
<div class="cocktail-title">Gush Monster</div>
<div class="cocktail-desc">
four roses straight bourbon small batch, homemade peach shrub,
fresh peach fresh, mint, club soda
peach shrub puree, club soda, fresh mint, slice of peach
</div>
</div>
</li>
<li style="padding: 10; display: flex">
<li class="cocktail">
<img
width="20%"
height="20%"
width="25%"
height="25%"
src="/assets/images/martini-glass.png"
/>
<div>
<div style="font-family: 'Playfair Display', serif">
Preppy with a Punk Rock Heart
</div>
<div class="desc">
<div class="cocktail-title">Preppy with a Punk Rock Heart</div>
<div class="cocktail-desc">
thistle finch white rye, fee brothers west indian orange bitters,
lillet blanc, dolin vermouth de chambery blanc, garnished with a
luxardo cherry
lillet blanc, dolin vermouth de chambery blanc, luxardo cherry
</div>
</div>
</li>
</ul>
</div>
<div
class="footer"
style="text-align: center; font-family: 'Playfair Display', serif"
>
happy birthday, love!
</div>
</div>
</div>

0 comments on commit ef98e3e

Please sign in to comment.