edited buttons.css

This commit is contained in:
msosic97
2022-03-14 17:24:24 +01:00
parent 9e086ddabe
commit 99caca9e7d
10 changed files with 74 additions and 14 deletions

View File

@@ -4,8 +4,7 @@
}
.standardBtn {
width:400px;
height: 43px;
width:250px;
background-color: #02ADBA;
font-size: 20px;
padding: 7px 20px 7px 20px;
@@ -32,11 +31,22 @@
background-color:#9eedf3;
}
@media screen and (max-width: 900px) {
.standardBtn {
width: 250px;
background-color: #02ADBA;
font-size: 20px;
padding: 7px 20px 7px 20px;
color: white;
border: #02ADBA;
}
}
@media screen and (max-width: 700px) {
.standardBtn {
width: 280px;
width: 150px;
background-color: #02ADBA;
font-size: 25px;
font-size: 20px;
padding: 7px 20px 7px 20px;
color: white;
border: #02ADBA;
@@ -47,10 +57,9 @@
@media screen and (max-width: 400px) {
.standardBtn {
width: 250px;
height: 43px;
width: 90px;
background-color: #02ADBA;
font-size: 25px;
font-size: 15px;
padding: 7px 20px 7px 20px;
color: white;
border: #02ADBA;

View File

@@ -21,7 +21,7 @@ header {
}
}
@media screen and (max-width: 300px) {
@media screen and (max-width: 350px) {
.title {
font-size: 20px;
}

View File

@@ -1,12 +1,12 @@
import './App.css';
import './css/App.css';
import React from 'react';
import LandingPage from './LandingPage';
import EmailPage from './EmailPage';
function App() {
return (
<div className="App">
<LandingPage/>
<EmailPage/>
</div>
);

View File

@@ -1,6 +1,6 @@
import Header from '../components/Header/Header';
import StandardBtn from '../components/Button/StandardBtn';
import './CongratsPage.css'
import './css/CongratsPage.css'
function CongratsPage() {

View File

@@ -0,0 +1,41 @@
import './css/EmailPage.css'
import Header from '../components/Header/Header';
import ButtonsToolbar from '../components/ButtonsToolbar/ButtonsToolbar';
import StandardBtn from '../components/Button/StandardBtn';
function EmailPage(props) {
const header = "SLANJE OBAVJEŠTENJA";
var title1 = 'Odmah';
var title2 = 'Dnevno';
var title3 = 'ZAVRŠI';
return (
<div>
<Header header={header}/>
<ButtonsToolbar/>
<div className='buttons-container'>
<StandardBtn title={title1}/>
<StandardBtn title={title2}/>
</div>
<div>
<h1 className='h2'>OVDJE IDU EMAILFIELDS</h1>
</div>
<div>
<h2 className='h2'>*U svakom trenutku možete prekinuti slanje objava kroz
link u vašem emailu
</h2>
</div>
<div>
<StandardBtn title={title3}/>
</div>
</div>
);
}
export default EmailPage;

View File

@@ -1,7 +1,7 @@
import logo from '../assets/logo.png'
import StandardBtn from '../components/Button/StandardBtn';
import Header from '../components/Header/Header';
import './LandingPage.css'
import './css/LandingPage.css'
function LandingPage() {
@@ -17,7 +17,7 @@ function LandingPage() {
<Header className='header' header={naslov}/>
<div className='paragraph'>
<h2> Sva motorna vozila dostupna u oglasima </h2>
<h2> Na Vas email </h2>
<h2> Na Vaš email </h2>
<h2 id='besplatno'> BESPLATNO </h2>
</div>

View File

@@ -0,0 +1,10 @@
.h2 {
text-align: center;
padding: 2rem;
}
.buttons-container {
display: flex;
justify-content:center;
gap: 20px;
}