fix logo container in tablet and desktop size
This commit is contained in:
@@ -18,35 +18,6 @@
|
||||
margin-bottom: 24px;
|
||||
} */
|
||||
|
||||
.leftShape {
|
||||
position: absolute;
|
||||
top: 133px;
|
||||
width: 47px;
|
||||
height: 50px;
|
||||
left: -11px;
|
||||
background-color: var(--background); /* Color of the shape */
|
||||
clip-path: path("M 0 53 Q 50 50, 50 0 Q 50 50, 100 100 L 0 100 Z");
|
||||
}
|
||||
|
||||
:global(.darkApp) .leftShape {
|
||||
background-color: var(--background);
|
||||
}
|
||||
|
||||
.rightShape {
|
||||
position: absolute;
|
||||
top: 133px;
|
||||
width: 47px;
|
||||
height: 50px;
|
||||
left: 102px;
|
||||
background-color: var(--background); /* Color of the shape */
|
||||
clip-path: path("M 0 53 Q 50 50, 50 0 Q 50 50, 100 100 L 0 100 Z");
|
||||
transform: scale(-1, 1); /* Mirror the shape on the Y-axis */
|
||||
}
|
||||
|
||||
:global(.darkApp) .rightShape {
|
||||
background-color: var(--background);
|
||||
}
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
left: 19px;
|
||||
@@ -71,6 +42,23 @@
|
||||
right: 19px;
|
||||
}
|
||||
|
||||
.logoContainerIcon {
|
||||
position: absolute !important;
|
||||
left: 0px !important;
|
||||
top: 127px;
|
||||
z-index: 10 !important;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .logoContainerIcon {
|
||||
right: -10px !important;
|
||||
}
|
||||
|
||||
.timeIcon {
|
||||
position: relative;
|
||||
top: 4px;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
.services {
|
||||
height: 36px;
|
||||
position: absolute;
|
||||
@@ -483,6 +471,11 @@
|
||||
color: #666;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .openingHours {
|
||||
left: 10px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.restaurantTitle {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
@@ -558,7 +551,8 @@
|
||||
}
|
||||
|
||||
.logo {
|
||||
left: 40px;
|
||||
top: -73px;
|
||||
left: 24px;
|
||||
width: 80px !important;
|
||||
height: 80px !important;
|
||||
}
|
||||
@@ -574,14 +568,17 @@
|
||||
border-radius: 0 0 20px 20px;
|
||||
}
|
||||
|
||||
.leftShape {
|
||||
top: 171px;
|
||||
left: -3px;
|
||||
.logoContainerIcon {
|
||||
position: absolute !important;
|
||||
left: 0px !important;
|
||||
top: 133px;
|
||||
z-index: 10 !important;
|
||||
width: 140px !important;
|
||||
height: 100px !important;
|
||||
}
|
||||
|
||||
.rightShape {
|
||||
top: 171px;
|
||||
left: 116px;
|
||||
:global(.ant-app-rtl) .logoContainerIcon {
|
||||
right: -17px !important;
|
||||
}
|
||||
|
||||
.pageContainer {
|
||||
@@ -603,6 +600,20 @@
|
||||
.contentWrapper {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.openingHours {
|
||||
position: absolute;
|
||||
top: 210px;
|
||||
right: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .openingHours {
|
||||
left: 16px;
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
/* Desktop devices (min-width: 1025px) */
|
||||
@@ -628,29 +639,50 @@
|
||||
|
||||
.logo {
|
||||
position: absolute;
|
||||
left: 33px;
|
||||
top: -95px;
|
||||
left: 38px;
|
||||
top: -122px;
|
||||
border-radius: 50%;
|
||||
z-index: 10;
|
||||
z-index: 11;
|
||||
border: 3px solid var(--background);
|
||||
width: 150px !important;
|
||||
height: 150px !important;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .logo {
|
||||
right: 28px;
|
||||
}
|
||||
|
||||
.navButton {
|
||||
width: 48px !important;
|
||||
height: 48px !important;
|
||||
border-radius: 16px !important;
|
||||
}
|
||||
|
||||
.leftShape {
|
||||
top: 171px;
|
||||
left: -10px;
|
||||
.logoContainerIcon {
|
||||
position: absolute !important;
|
||||
left: 0px !important;
|
||||
top: 106px;
|
||||
z-index: 10 !important;
|
||||
width: 247px !important;
|
||||
height: 170px !important;
|
||||
}
|
||||
|
||||
.rightShape {
|
||||
top: 171px;
|
||||
left: 179px;
|
||||
:global(.ant-app-rtl) .logoContainerIcon {
|
||||
right: -30px !important;
|
||||
}
|
||||
|
||||
.openingHours {
|
||||
position: absolute;
|
||||
top: 230px;
|
||||
right: 16px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .openingHours {
|
||||
left: 32px;
|
||||
right: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -690,26 +722,3 @@
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.logoContainerIcon {
|
||||
position: absolute !important;
|
||||
left: 0px !important;
|
||||
top: 127px !important;
|
||||
z-index: 10 !important;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .logoContainerIcon {
|
||||
right: -10px !important;
|
||||
}
|
||||
|
||||
:global(.ant-app-rtl) .openingHours {
|
||||
left: 10px;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
.timeIcon {
|
||||
position: relative;
|
||||
top: 4px;
|
||||
margin: 0 4px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user