diff --git a/css/main.bak.css b/css/main.bak.css deleted file mode 100644 index 26901f65fc113f19f20a39218fea72cec27b3fbd..0000000000000000000000000000000000000000 --- a/css/main.bak.css +++ /dev/null @@ -1,283 +0,0 @@ -html { - height: 100%; -} -body { - background: #f1f1f1; - padding-bottom: 50px; - position: relative; - min-height: 100%; -} -@media (min-width: 200px) { - .navbar-header{ - float: left; - } - .navbar-right { - float: right !important; - margin-right: -15px; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 19.5px; - padding-bottom: 19.5px; - } - .navbar-nav { - margin:0; - } -} -#appContainer { - padding-top: 80px; -} -.row.marketing { - margin: 0 auto; - max-width: 900px; -} -.video-detail, .media-list { - background: #fff; - padding-top: 20px 0; - box-shadow: 0 1px 2px rgba(0,0,0,.1); -} -.video-detail { - padding: 20px; -} -.media, .pizzasContainer > a { - padding: 20px; - border-bottom: 1px solid rgba(0,0,0,.1); - margin: 0; - display: flex; -} -.media .infos, .pizzasContainer > a .infos { - display: flex; - flex-direction: column; -} -.media a { - display: flex; -} -.media p { - font-size: 12px; -} -.media img, .pizzasContainer > a img { - margin-right: 20px; - width: 246px; - height: 138px; -} -.media h4 .pizzasContainer > a h4 { - font-size: 25px; - margin: 0; -} -a, a:hover { - color: #333; -} -a h4, a:hover h4 { - color: #167ac6; -} -.comments .panel { - margin: 5px 0; -} -.navbar-inverse { - background: #fff; - box-shadow: 0 1px 2px rgba(0,0,0,.1); - /*position: relative; - color: black; -} -.navbar-inverse:after { - content: ''; - position: absolute; - bottom: 0; - left: 0; - right: 0; - height: 2px;*/ - background-color: #cd1a1a; - background-image: linear-gradient(45deg, #cd1a1a, #cb1a70); -} -.navbar-inverse .navbar-nav > li > a, -.navbar-inverse .navbar-nav > li > a:focus { - color: #f9d2d2; -} -.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus { - background-color: #b01717; -} -.navbar-inverse .navbar-nav > li > a:hover { - color: #fff; - background-color: #b01717; -} -.navbar-brand { - padding: 0 15px; - display: flex; - align-items: center; -} -.navbar-brand > img { - display: inline-block; - height: 50px; - margin-right: 10px; -} -.navbar-brand > small { - font-size: 12px; - font-style: italic; - margin-left:10px; - margin-top:5px; -} -footer { - position: absolute; - bottom: 10px; - right: 10px; - font-size: 10px; - color: #0003; -} -footer a{ - color: #0006; -} -form { - display:flex; - padding: 20px; - flex-direction: column; -} -form label { - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: baseline; -} -form label input, -form label select, -form label .form-control { - width: 70%; -} - -.jumbotron { - padding: 20px 60px; - background-color: #e2e8e9; - background-image: url('../images/bg.png'); - background-size: cover; - background-position: center; - animation: fadeIn .8s ease, slide 1.2s cubic-bezier(.190, 1.000, .220, 1.000); - animation-delay: .1s; - animation-fill-mode: both; - overflow: hidden; - position: relative; -} -.jumbotron .closeButton { - position: absolute; - right: 20px; - top: 20px; - width: 40px; - height: 40px; - border: none; - background: none; - transform: rotate(-45deg); - transform-origin: center; - transition: all .3s ease; -} -.jumbotron .closeButton:hover { - transform: scale(1.2) rotate(135deg); -} - -.jumbotron .closeButton:before, -.jumbotron .closeButton:after { - content: ''; - border-radius: 3px; - position: absolute; - top:50%; - left: 10px; - right: 10px; - border: 2px black solid; - transform-origin: center; - transform: translateY(-2px); -} -.jumbotron .closeButton:after { - transform: translateY(-2px) rotate(90deg); -} -.jumbotron .spicy{ - font-size:130%; - background: linear-gradient(-55deg, #cd1a1e 0%,#faa119 40%, #fecf0a 50%, #faa119 60%, #cd1a1e 100%); - background-size: 200% 200%; - white-space: nowrap; - color: #cd1a1e; - background-clip: text; - text-fill-color: transparent; - -webkit-background-clip: text; - -webkit-text-fill-color: transparent; - -} -.jumbotron .spicy:hover { - animation: slideBg .1s linear infinite; -} -.jumbotron .spicy:hover .spicy-icon{ - animation: burn .01s linear infinite; -} -.jumbotron h1, .jumbotron p { - animation: fadeIn .6s ease, slide .4s cubic-bezier(.190, 1.000, .220, 1.000); - animation-delay: .4s; - animation-fill-mode: both; -} -.jumbotron p { - animation-delay: .5s; -} -.jumbotron .spicy-icon { - height:50px; - vertical-align: baseline; - transform-origin: bottom left; -} -@keyframes slideBg { - 100% { - background-position: -200% center; - } -} -@keyframes burn { - 100% { - transform: skew(-13deg); - } -} -@keyframes fadeIn { - 0% { - opacity: 0; - } - 100% { - opacity: 1; - } -} -@keyframes slide { - 0% { - transform: translateX(-300px); - } -} -.is-loading { - position:relative; - min-height: 200px; -} -.is-loading * { - display: none; -} -.is-loading:before { - content: ''; - position: absolute; - top:0; - left:0; - right:0; - bottom:0; - background-color: rgba(0,0,0,.1); - z-index: 1; -} -.is-loading:after { - content: ' '; - position: absolute; - top:50%; - left:50%; - width: 50px; - height: 50px; - border: 1px black solid; - border-top-color: rgba(0,0,0,.3); - z-index: 2; - border-radius: 50%; - animation: rotate .5s linear infinite; - transform-origin: center; -} -@keyframes rotate { - 0% { - transform: translate(-50%,-50%) rotate(0deg); - } - 100% { - transform: translate(-50%,-50%) rotate(360deg); - } -} \ No newline at end of file diff --git a/css/main.css b/css/main.css index 7b9873129988743d85a76810cee51ca4c17724a5..4f9ee7e24a0e82e16fefd16176d7dc61596d2812 100644 --- a/css/main.css +++ b/css/main.css @@ -22,7 +22,7 @@ body { margin: 0; /* height: 100%; */ padding: 0; - background: #eee; + background: #222; } body { min-height: 100vh; @@ -40,7 +40,7 @@ body > footer { padding: 0 40px; } .pageContainer { - color: #121618; + color: #fff; background-image: url('../images/bg.png'); background-size: 110%; background-position: center -20px; diff --git a/css/news.css b/css/news.css index 6bac2c8d37ba778276a1805035f9625d12c64563..f42b725cafd0257f9e88fb76462575ecdeed209c 100644 --- a/css/news.css +++ b/css/news.css @@ -18,7 +18,7 @@ bottom: 0; height: 0; width: 100%; - background-image: linear-gradient(#eee, #eee), linear-gradient(45deg, transparent 75%, #eee 75%), linear-gradient(-45deg, transparent 75%, #eee 75%); + background-image: linear-gradient(#222, #222), linear-gradient(45deg, transparent 75%, #222 75%), linear-gradient(-45deg, transparent 75%, #222 75%); background-position: 0 0, 0 0, 0 0, 0 100%, 0 100%; background-size: auto auto, 15px 15px, 15px 15px, 15px 15px, 15px 15px; background-clip: padding-box, border-box, border-box, border-box, border-box; diff --git a/css/pizzaForm.css b/css/pizzaForm.css new file mode 100644 index 0000000000000000000000000000000000000000..a383c6cce29af1d1eb69d7cf1e9fd02f08ac1f75 --- /dev/null +++ b/css/pizzaForm.css @@ -0,0 +1,88 @@ +.pizzaForm { + background: white; + color: #121618; + padding: 50px; + border: 1px #13181919 solid; + outline: 20px hsl(240deg 0% 100%) solid; + margin: 20px; + margin-bottom: 50px; + display: flex; + flex-direction: column; + align-items: flex-start; +} +.pizzaForm button[type="submit"] { + align-self: center; + margin-top: 30px; + border: 1px transparent solid; + border-radius: 3px; + padding: 15px 50px; + font-family: OpenSansCondensed; + font-size: 18px; + letter-spacing: 2px; + font-weight: bold; + text-transform: uppercase; + cursor: pointer; + background-color: white; + transition: all .15s ease-out; + border-color: #131819; +} +.pizzaForm button[type="submit"]:hover { + background-color: #e2952d; + background-color: #131819; + border-color: transparent; + color: white; +} +.pizzaForm label { + width: 100%; + display: flex; + flex-direction: column; + font-family: OpenSansCondensed; + font-size: 18px; + letter-spacing: 2px; + font-weight: lighter; + text-transform: uppercase; +} +.pizzaForm label:not(:first-of-type) { + margin-top: 30px; +} +.pizzaForm label small{ + margin-top: 5px; + text-transform: none; + font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif; + font-weight: normal; + font-style: italic; + font-size: 12px; + opacity: .6; + letter-spacing: 1; +} +.pizzaForm label code{ + font-family: 'Segoe UI', 'Helvetica Neue', Helvetica, Arial, sans-serif; + background-color: #13181919; + padding: 2px 4px; + border-radius: 3px; +} +.pizzaForm input { + border: 1px #eee solid; + border-radius: 3px; + background-color: #fefefe; + padding: 10px 20px; + font-size: 16px; + margin-top: 5px; +} + +@media (min-width: 1024px) { + .pizzaForm { + width: 70%; + margin-bottom: 150px; + } + .pizzaForm button[type="submit"] { + align-self: flex-end; + } + .pizzaForm label { + /* width: 60%; */ + } +} +input::placeholder { + font-weight: lighter !important; + color: #ddd; +} \ No newline at end of file diff --git a/css/pizzaList.css b/css/pizzaList.css index 6316940f17f5d19a2425f58bc9c5199a419c4ad6..367b1e21ca50315985d4bb8110ea4fd566c7e59e 100644 --- a/css/pizzaList.css +++ b/css/pizzaList.css @@ -31,7 +31,7 @@ transform: scaleX(-1) translateY(-50%); } .pizzaThumbnail { - background-color: #fff; + background-color: #131618; } .pizzaThumbnail a { /* background-color: #12161899; */ @@ -73,7 +73,7 @@ align-items: center; padding: 20px 20px; font-size: 16px; - background-color: #f9f9f9; + background-color: #131618; } .pizzaThumbnail a section:before { content: ''; @@ -85,7 +85,7 @@ height: 0; border-top: 20px solid transparent; border-bottom: 20px solid transparent; - border-right:20px solid #f9f9f9; + border-right:20px solid #131618; } .pizzaThumbnail a section h4 { text-align: center; @@ -94,7 +94,7 @@ font-size: 30px; letter-spacing: 2px; text-transform: uppercase; - color: #000; + color: #fff; /* color: #e2952d; */ margin: 0 0 15px; white-space: nowrap; @@ -102,6 +102,7 @@ .pizzaThumbnail a section h4:before, .pizzaThumbnail a section h4:after { content: '〜'; + color: #bbb; font-weight: lighter; display: inline-flex; font-size: 0.5em; @@ -115,18 +116,18 @@ list-style-type: none; padding: 0; margin: 0; - color: #555; + color: #bbb; } .pizzaThumbnail a:hover img { /* filter: contrast(1) grayscale(0) brightness(1); */ width: 48%; } .pizzaThumbnail a:hover section { - background-color: #fff; + background-color: #0d0e10; /* width: 52%; */ } .pizzaThumbnail a:hover section:before { - border-right-color: #fff; + border-right-color: #0d0e10; } @media (max-width: 1200px) { .pizzaThumbnail a img { diff --git a/images/bg.png b/images/bg.png index 2e9b88b936cba2b0e0f4ae3121bd021173a3587c..527ad6da900573e04398a43d9972ecd7f5e53ad2 100644 Binary files a/images/bg.png and b/images/bg.png differ