changes buttons into div-rows

This commit is contained in:
Ashley Blewer
2017-10-17 21:03:04 -04:00
parent 494993d4c2
commit c6a579a0bf
2 changed files with 161 additions and 177 deletions

View File

@ -132,90 +132,77 @@ img {
margin-bottom: 18px;
}
div {
font-family: 'Merriweather', serif;
color: white;
}
button {
font: inherit;
font-family: inherit;
color: inherit;
}
.btn {
border: 1px solid transparent;
background-color: #424242;
font-size: 1em;
line-height: 1.5em;
white-space: normal;
cursor: pointer;
padding: 8px 12px;
border-radius: 4px;
padding-left: 2.5em;
margin: 8px;
display: inline-block;
vertical-align: middle;
-webkit-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-osx-font-smoothing: grayscale;
.recipe {
color: white;
background-color: #383838;
padding: 14px;
padding-left: 2.8em;
font-family: "Montserrat";
font-weight: bold;
font-size: 1.2em;
border: 1px solid black;
transition: all .5s ease-out;
position: relative;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
width: 100%;
}
.btn:before {
.recipe:hover {
color: black;
background-color: #449d44;
border: 1px solid black;
}
.recipe:before {
content: "💫";
position: absolute;
left: 1em;
padding: 0 1px;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
padding-right: 1em;
}
.btn:hover:before, .btn:focus:before, .btn:active:before {
-webkit-transform: scale(1.3) translateZ(0);
transform: scale(1.3) translateZ(0);
}
.contents-list {
color: white;
border: 1px solid black;
background-color: #383838;
padding: 14px;
font-family: "Montserrat";
font-weight: bold;
font-size: 1em;
border:1px solid rgba(255, 255, 255, 0);
transition:all .5s ease-in-out;
.recipe:hover:before, .recipe:focus:before, .recipe:active:before {
transform: scale(1.3);
}
.sidebar a {
text-decoration: none;
}
.contents-list {
color: white;
background-color: #383838;
padding: 14px;
padding-left: 2.8em;
font-family: "Montserrat";
font-weight: bold;
font-size: 1em;
border: 1px solid black;
transition: all .5s ease-out;
}
.contents-list:hover {
color: black;
font-size: 1.05em;
background-color: #449d44;
border:1px solid black;
}
.contents-list:before {
content: "📼";
position: absolute;
left: 1em;
padding: 0 1px;
padding-right: 1em;
}
.contents-list:hover:before, .contents-list:focus:before, .contents-list:active:before {
transform: scale(1.8) translateX(0.3em);
}
.codeblock {
font-family: monospace
padding: 2px 4px;