done some responsivity on diagram

master
Pedram Keshavarzi 3 years ago
parent 9981702092
commit 1b1a6df045
  1. 21
      src/Components/HowWeWorkDiagram/index.css
  2. 3
      src/Components/productFeature/productFeature.css
  3. 7
      src/Containers/howDoWeWork/howWeWork.css

@ -3,35 +3,39 @@
.tree {
display: flex;
flex-direction: row;
padding: 5%;
justify-content: center;
direction: ltr;
float: left;
text-align: center;
}
.tree span {
color: #ccc;
border-radius: 8px;
padding: 0px 10px;
display: flex;
margin: 70px 20px;
align-items: center;
position: relative;
justify-content: center;
line-height: 1.2;
font-size:35%;
font-weight: bold;
}
.p .parent{
border:0;
background:none;
border-right:1px solid #1577F8;
border-radius: 0;
height: 205px;
height: 185px;
align-items: center;
padding: 8px 20px;
padding-left: 0px;
margin-left:0px;
font-size: 10px;
font-weight: bold;
}
.p .UserReaction{
@ -50,7 +54,6 @@
transform: rotate(-45deg);
text-align: center;
margin: 0px;
font-size: 10px;
color:white;
}
.p .add{
@ -60,7 +63,7 @@
padding: 0;
border-radius: 50%;
color:#1577F8;
font-size: 25px;
}
.p .cp{
background: rgba(0,0,0,0.1);
@ -68,8 +71,8 @@
box-shadow: 0px 0px 26px rgba(0,0,0,0.2);
color:#333333;
padding:20px 30px;
font-size: 12px;
border-radius: 7px;
}
.pCont{
background-color: rgba(32,100,155, 0.7);
@ -78,7 +81,7 @@
border-radius: 7px;
color:white;
font-weight: 200;
margin-left: -65px;
}
.p .parent::after{
content: "";
@ -105,7 +108,7 @@
border-radius: 7px;
padding:15px 30px;
color:#333;
font-size: 12px;
}
.tree span:before {
content: "";

@ -2,7 +2,8 @@
display:flex;
flex-wrap: wrap;
width:30em;
align-items: center;
justify-content: center;
}
.ProductFeatures .feature{
flex: 0 0 calc(33.333333% - 24px);

@ -11,6 +11,13 @@
}
.HowWeWork .diagrams{
display: flex;
direction: ltr;
justify-content: space-between;
align-items: center;
}
.HowWeWork .diagrams .HowWeWorkDiagram{
}
Loading…
Cancel
Save