mirror of
https://github.com/ivabus/www
synced 2024-11-22 13:05:06 +03:00
Styling progress
This commit is contained in:
Thomas Smith
parent
eeb53a8976
commit
e85c33da9f
4 changed files with 77 additions and 54 deletions
|
|
@ -1,5 +1,42 @@
|
|||
<style>
|
||||
.btn-primary{
|
||||
padding: 44px 75px;
|
||||
border-radius: 0px !important;
|
||||
font-family: "pp-neue-machina", sans-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 38px;
|
||||
border-left: 2px solid #949494 !important;
|
||||
border-right: 2px solid #949494 !important;
|
||||
background-color: #1a1a1a !important;
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
text-align: left;
|
||||
border-top-color:#1a1a1a;
|
||||
border-bottom-color: #1a1a1a;
|
||||
transition: 0.2s linear;
|
||||
}
|
||||
|
||||
.btn-primary:hover{
|
||||
background-color: #00ffd0 !important;
|
||||
color: #1a1a1a;
|
||||
border-top-color:#00ffd0;
|
||||
border-bottom-color:#00ffd0;
|
||||
border-left-color:#00ffd0;
|
||||
border-right-color:#00ffd0;
|
||||
box-shadow: inset 0px 0px 0px 10px #1a1a1a !important;
|
||||
padding: 44px 100px;
|
||||
border-top-color:#1a1a1a;
|
||||
border-bottom-color: #1a1a1a;
|
||||
}
|
||||
|
||||
.button-container{
|
||||
padding: 0px 160px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<hr>
|
||||
<div class="row button-container">
|
||||
<a href="#" role="button" class="btn btn-primary auth-btn mt-lg-0 mt-md-0 mt-sm-4 mt-4" id="nav-cta">Authenticate with tea</a>
|
||||
<a href="#" role="button" class="btn btn-primary auth-btn mt-lg-0 mt-md-0 mt-sm-4 mt-4" id="nav-cta">Authenticate with tea<span class="vertical-center" style="float:right; font-size:1.2rem;"><u id="count1"></u> devs authenticated</span></a>
|
||||
</div>
|
||||
<hr>
|
||||
|
|
|
|||
11
src/static/Images/enter-icon.svg
Normal file
11
src/static/Images/enter-icon.svg
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<svg id="enter-desktop" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40.03" height="36.587" viewBox="0 0 40.03 36.587">
|
||||
<defs>
|
||||
<clipPath id="clip-path">
|
||||
<rect id="Rectangle_449" data-name="Rectangle 449" width="40.03" height="36.587" fill="#fff"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<g id="Group_45" data-name="Group 45" clip-path="url(#clip-path)">
|
||||
<path id="Path_11" data-name="Path 11" d="M36.734,27.14H1.036A1.036,1.036,0,0,1,0,26.1V1.036a1.037,1.037,0,0,1,2.073,0V25.067h34.66a1.037,1.037,0,0,1,0,2.073" transform="translate(0 0)" fill="#fff"/>
|
||||
<path id="Path_12" data-name="Path 12" d="M38.13,26.6a3.1,3.1,0,0,1-.925.779L23.146,35.462a1,1,0,0,1-.5.158.923.923,0,0,1-.733-.361,1.312,1.312,0,0,1-.3-.879,1.166,1.166,0,0,1,.4-.97,4.48,4.48,0,0,1,.869-.543l13.36-7.717-13.36-7.742a4.425,4.425,0,0,1-.869-.542,1.2,1.2,0,0,1-.4-.992,1.271,1.271,0,0,1,.3-.869.938.938,0,0,1,.733-.351,1.137,1.137,0,0,1,.5.135l14.059,8.1a3.66,3.66,0,0,1,.925.778,2.011,2.011,0,0,1,.474,1.389v.134A2.1,2.1,0,0,1,38.13,26.6" transform="translate(1.425 0.966)" fill="#fff"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
|
|
@ -1,18 +1,21 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="640.5" height="320.5" viewBox="0 0 640.5 320.5">
|
||||
<g id="Group_1194" data-name="Group 1194" transform="translate(0.25 -1039.75)">
|
||||
<path id="Rectangle_3128" data-name="Rectangle 3128" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1040)"/>
|
||||
<path id="Rectangle_3136" data-name="Rectangle 3136" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1120)"/>
|
||||
<path id="Rectangle_3139" data-name="Rectangle 3139" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1200)"/>
|
||||
<path id="Rectangle_3141" data-name="Rectangle 3141" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1280)"/>
|
||||
<path id="Rectangle_3129" data-name="Rectangle 3129" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1040)"/>
|
||||
<path id="Rectangle_3137" data-name="Rectangle 3137" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1120)"/>
|
||||
<path id="Rectangle_3140" data-name="Rectangle 3140" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1200)"/>
|
||||
<path id="Rectangle_3130" data-name="Rectangle 3130" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(160 1040)"/>
|
||||
<path id="Rectangle_3138" data-name="Rectangle 3138" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(160 1120)"/>
|
||||
<path id="Rectangle_3131" data-name="Rectangle 3131" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(240 1040)"/>
|
||||
<path id="Rectangle_3132" data-name="Rectangle 3132" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(320 1040)"/>
|
||||
<path id="Rectangle_3133" data-name="Rectangle 3133" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(400 1040)"/>
|
||||
<path id="Rectangle_3134" data-name="Rectangle 3134" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(480 1040)"/>
|
||||
<path id="Rectangle_3135" data-name="Rectangle 3135" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(560 1040)"/>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1920.25" height="320.5" viewBox="0 0 1920.25 320.5">
|
||||
<g id="Group_1223" data-name="Group 1223" transform="translate(0.25 -1039.75)">
|
||||
<rect id="Rectangle_3348" data-name="Rectangle 3348" width="1920" height="320" transform="translate(0 1040)" fill="#fff" opacity="0"/>
|
||||
<g id="Group_1194" data-name="Group 1194">
|
||||
<path id="Rectangle_3128" data-name="Rectangle 3128" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1040)"/>
|
||||
<path id="Rectangle_3136" data-name="Rectangle 3136" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1120)"/>
|
||||
<path id="Rectangle_3139" data-name="Rectangle 3139" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1200)"/>
|
||||
<path id="Rectangle_3141" data-name="Rectangle 3141" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(0 1280)"/>
|
||||
<path id="Rectangle_3129" data-name="Rectangle 3129" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1040)"/>
|
||||
<path id="Rectangle_3137" data-name="Rectangle 3137" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1120)"/>
|
||||
<path id="Rectangle_3140" data-name="Rectangle 3140" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(80 1200)"/>
|
||||
<path id="Rectangle_3130" data-name="Rectangle 3130" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(160 1040)"/>
|
||||
<path id="Rectangle_3138" data-name="Rectangle 3138" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(160 1120)"/>
|
||||
<path id="Rectangle_3131" data-name="Rectangle 3131" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(240 1040)"/>
|
||||
<path id="Rectangle_3132" data-name="Rectangle 3132" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(320 1040)"/>
|
||||
<path id="Rectangle_3133" data-name="Rectangle 3133" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(400 1040)"/>
|
||||
<path id="Rectangle_3134" data-name="Rectangle 3134" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(480 1040)"/>
|
||||
<path id="Rectangle_3135" data-name="Rectangle 3135" d="M-.25-.25h80.5v80.5H-.25Zm80,.5H.25v79.5h79.5Z" transform="translate(560 1040)"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.3 KiB |
|
|
@ -4,7 +4,7 @@ body{
|
|||
background-color: #1a1a1a;
|
||||
max-width: 1920px;
|
||||
background-image: url("/Images/x-large-grid.svg");
|
||||
background-size: auto;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
/*
|
||||
|
|
@ -22,7 +22,7 @@ body{
|
|||
|
||||
@media only screen and (min-width: 1280px) {
|
||||
.container{
|
||||
padding: 160px 132px 0px 132px;
|
||||
padding: 128px 150px 10px 132px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -167,14 +167,13 @@ p{
|
|||
@media only screen and (min-width: 1280px) {
|
||||
|
||||
h1{
|
||||
font-size: 224px;
|
||||
line-height: 240px;
|
||||
margin-top: -18px;
|
||||
font-size: 13.25rem;
|
||||
line-height: 14rem;
|
||||
}
|
||||
|
||||
h2{
|
||||
font-size: 110px;
|
||||
line-height: 160px;
|
||||
font-size: 6rem;
|
||||
line-height: 8rem;
|
||||
}
|
||||
|
||||
h3{
|
||||
|
|
@ -190,6 +189,7 @@ p{
|
|||
.lead{
|
||||
font-size: 28px !important;
|
||||
line-height: 29px !important;
|
||||
margin-top: -23px !important;
|
||||
}
|
||||
|
||||
p{
|
||||
|
|
@ -198,35 +198,6 @@ p{
|
|||
|
||||
}
|
||||
|
||||
/* Buttons */
|
||||
|
||||
.btn-primary{
|
||||
padding: 65px 80px;
|
||||
border-radius: 0px !important;
|
||||
font-family: "pp-neue-machina", sans-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 38px;
|
||||
border-left: 2px solid #949494 !important;
|
||||
border-right: 2px solid #949494 !important;
|
||||
background-color: #1a1a1a !important;
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
text-align: left;
|
||||
border-top-color:#1a1a1a;
|
||||
border-bottom-color: #1a1a1a;
|
||||
}
|
||||
|
||||
.btn-primary:hover{
|
||||
background-color: #00ffd0 !important;
|
||||
color: #1a1a1a;
|
||||
border-top-color:#00ffd0;
|
||||
border-bottom-color:#00ffd0;
|
||||
}
|
||||
|
||||
.button-container{
|
||||
padding: 0px 160px;
|
||||
}
|
||||
|
||||
/* Spacers & Dividers */
|
||||
|
||||
hr{
|
||||
|
|
@ -240,7 +211,7 @@ hr{
|
|||
@media only screen and (min-width: 1280px) {
|
||||
|
||||
.hero-section{
|
||||
margin-bottom: 80px;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
|
||||
.impact-section{
|
||||
|
|
@ -253,5 +224,6 @@ hr{
|
|||
.grid-element{
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
width:600px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue