-
Open: { candleInfo.Open }, Close: { candleInfo.Close }
-
Max: { candleInfo.Max }, Min: { candleInfo.Min }
-
Volume: { candleInfo.Vol }
+
-1 ? 'exchangeInterface' : 'exchangeEmptySpace' }>
+
+
Open: { candleInfo.Open },
+
Close: { candleInfo.Close },
+
Max: { candleInfo.Max },
+
Min: { candleInfo.Min },
+
Volume: { candleInfo.Vol },
Date: { candleInfo.Date }
@@ -120,6 +137,7 @@ const IndexExchange = ({
)
}
+
const mapStateToProps = state => ({
user: state.user,
exchange: state.exchange
@@ -127,9 +145,9 @@ const mapStateToProps = state => ({
const mapDispatchToProps = dispatch => ({
getChart: exchange => dispatch( getChart(exchange) ),
- getTriggers: exchange => dispatch( getTriggers(exchange) ),
- getNotifications: exchange => dispatch( getNotifications(exchange) ),
- getTransactions: exchange => dispatch( getTransactions(exchange) )
+ getUserTriggers: exchange => dispatch( getUserTriggers(exchange) ),
+ getUserNotifications: exchange => dispatch( getUserNotifications(exchange) ),
+ getUserTransactions: exchange => dispatch( getUserTransactions(exchange) )
})
export default connect(mapStateToProps,mapDispatchToProps)(IndexExchange)
diff --git a/src/stores/exchange/duck/operations.js b/src/stores/exchange/duck/operations.js
index dda6760..a5cab4a 100644
--- a/src/stores/exchange/duck/operations.js
+++ b/src/stores/exchange/duck/operations.js
@@ -50,7 +50,7 @@ export const getChart = () =>
dispatch(actions.setChart(chart))
}
-export const getGetUserTriggers = () =>
+export const getUserTriggers = () =>
async (dispatch) => {
const triggers = await fetchGetUserTriggers()
dispatch(actions.setUserTriggers(triggers))
diff --git a/src/styles/elements.scss b/src/styles/elements.scss
index cfa2cab..86090b2 100644
--- a/src/styles/elements.scss
+++ b/src/styles/elements.scss
@@ -6,14 +6,9 @@
}
@mixin scrollStyle {
- margin-top: 5px;
- margin-bottom: 5px;
- border: 0px;
- border-radius: 10px;
- font-size: 12pt;
- text-align: center;
- color: rgba(111,108,106,1);
- background-color: rgba(22,28,29,0.6);
+ width: 10px;
+ height: 10px;
+ background-color: rgba(22,28,29,0.5);
}
@mixin inputStyle {
@@ -59,7 +54,11 @@
margin-bottom: 10px;
}
-@mixin backgroundDivMenubarStyle{
+@mixin backgroundColorOnly {
+ background-color: rgba(22,28,29,0.4);
+}
+
+@mixin backgroundDivMenubarStyle {
background-color: rgba(22,28,29,0.2);
border-bottom: 1px solid;
border-color: rgba(117,82,29,0.7);
diff --git a/src/styles/indexExchange.scss b/src/styles/indexExchange.scss
index 46b7c61..4fa0f9f 100644
--- a/src/styles/indexExchange.scss
+++ b/src/styles/indexExchange.scss
@@ -7,7 +7,7 @@
width: 100%;
height: auto;
- padding-top: 20vh;
+ padding-top: 175px;
margin-left: auto;
margin-right: auto;
@@ -21,7 +21,7 @@
width: 100%;
height: 600px;
- overflow-y: hidden;
+ overflow: hidden;
overflow-x: scroll;
.chart {
@@ -34,6 +34,11 @@
margin-right: 5px;
float: left;
+ opacity: 0.6;
+ &:hover {
+ opacity: 1;
+ }
+
.sectionCandle {
width: 100%;
height: 400px;
@@ -73,8 +78,7 @@
.volumen {
width: 100%;
height: 20px;
- background: gray;
- opacity: 0.8;
+ background: rgba(0,0,0,0.3);
}
}
}
@@ -90,3 +94,49 @@
.exchangeChartUser {
@include exchangeChart
}
+
+@mixin exchangeInterface {
+ width: 100%;
+ height: auto;
+ background: rgba(0,0,0,0.2);
+
+ .candleInformation {
+ width: 1500px;
+ height: 20px;
+ padding-top: 10px;
+ padding-bottom: 20px;
+ margin-left: auto;
+ margin-right: auto;
+
+ p {
+ width: 250px;
+ text-align: center;
+ float: left;
+ }
+ }
+}
+
+ .exchangeEmptySpace {
+ @include exchangeInterface
+ }
+ .exchangeInterface {
+ @include exchangeInterface
+ }
+
+.exchangeTriggerDativeY {
+ z-index: -1;
+ position: fixed;
+ width: 100vw;
+ height: 1px;
+ background-color: rgba(117,82,29,1);
+ transform: margin 700ms;
+}
+
+.exchangeTriggerDativeX {
+ z-index: -1;
+ position: fixed;
+ width: 1px;
+ height: 590px;
+ background-color: rgba(117,82,29,1);
+ transform: margin 700ms;
+}