From 5ec7c1bf46a8298a790a8db938e7cdb17dc10645 Mon Sep 17 00:00:00 2001
From: tommy <tommyew7@gmail.com>
Date: Sat, 26 Sep 2020 21:26:29 +0200
Subject: [PATCH] iPhone horizontal and vertical media queries
---
frontend/src/Components/FavoriteButton.tsx | 1 +
frontend/src/Components/LandingPage.tsx | 2 +-
frontend/src/Components/LandingpageSVG.tsx | 2 +-
frontend/src/Style/DropDown.css | 1 +
frontend/src/Style/FavoriteButton.css | 3 +++
frontend/src/Style/LandingPage.css | 2 +-
6 files changed, 8 insertions(+), 3 deletions(-)
create mode 100644 frontend/src/Style/FavoriteButton.css
diff --git a/frontend/src/Components/FavoriteButton.tsx b/frontend/src/Components/FavoriteButton.tsx
index bc1ce44..ee66ee9 100644
--- a/frontend/src/Components/FavoriteButton.tsx
+++ b/frontend/src/Components/FavoriteButton.tsx
@@ -1,6 +1,7 @@
import React, {useEffect, useState} from 'react';
import active from '../Media/favorite-active.png';
import inactive from '../Media/favorite.png';
+import '../Style/FavoriteButton.css';
type props = {
pageId: number;
diff --git a/frontend/src/Components/LandingPage.tsx b/frontend/src/Components/LandingPage.tsx
index ad37105..89ceee4 100644
--- a/frontend/src/Components/LandingPage.tsx
+++ b/frontend/src/Components/LandingPage.tsx
@@ -43,7 +43,7 @@ class LandingPage extends React.Component<props, state> {
save these settings for future appretiation of the art pieces.
</p>
<div className={'favorites'}>
- <p>Favorites</p>
+ <p>Favorites:</p>
<ul>{this.state.favorites}</ul>
</div>
<div className={'flex2'}>
diff --git a/frontend/src/Components/LandingpageSVG.tsx b/frontend/src/Components/LandingpageSVG.tsx
index a7d8e16..b62bedc 100644
--- a/frontend/src/Components/LandingpageSVG.tsx
+++ b/frontend/src/Components/LandingpageSVG.tsx
@@ -18,7 +18,7 @@ const LandingpageSVG = () => {
return(
<div className={'welcome-svg'}>
- <svg id="SVG" xmlns="http://www.w3.org/2000/svg" height="400" width="400">
+ <svg viewBox="0 0 400 400" id="SVG" xmlns="http://www.w3.org/2000/svg">
<polygon points={pickPoints()} fill="blue" fill-opacity="0.5" />
<polygon points={pickPoints()} fill="red" fill-opacity="0.5" />
<polygon points={pickPoints()} fill="green" fill-opacity="0.5" />
diff --git a/frontend/src/Style/DropDown.css b/frontend/src/Style/DropDown.css
index 9449b7a..f629b99 100644
--- a/frontend/src/Style/DropDown.css
+++ b/frontend/src/Style/DropDown.css
@@ -18,6 +18,7 @@
.dropdown {
font-family: initial;
+ cursor: pointer;
}
.dropdown-menu {
diff --git a/frontend/src/Style/FavoriteButton.css b/frontend/src/Style/FavoriteButton.css
new file mode 100644
index 0000000..34f9a2e
--- /dev/null
+++ b/frontend/src/Style/FavoriteButton.css
@@ -0,0 +1,3 @@
+.favorite-button {
+ cursor: pointer;
+}
\ No newline at end of file
diff --git a/frontend/src/Style/LandingPage.css b/frontend/src/Style/LandingPage.css
index 23d08d9..b9db427 100644
--- a/frontend/src/Style/LandingPage.css
+++ b/frontend/src/Style/LandingPage.css
@@ -105,7 +105,7 @@ ul {
}
}
-@media (max-width: 900px) and (max-height: 400px) {
+@media (max-width: 900px) and (max-height: 400px){
.welcome-svg {
max-width: 200px;
}
--
GitLab