| |
@@ -19,183 +19,255 @@
|
| |
// @import "../pages/women/women";
|
| |
// App Shared Rules
|
| |
.iframeWrapper iframe {
|
| |
- width: 100%;
|
| |
- height: 100%;
|
| |
- }
|
| |
+ width: 100%;
|
| |
+ height: 100%;
|
| |
+ }
|
| |
|
| |
//tab icons-active
|
| |
ion-icon {
|
| |
- &[class*="fedora-"] {
|
| |
- mask-size: contain;
|
| |
- mask-position: 50% 50%;
|
| |
- mask-repeat: no-repeat;
|
| |
- background: currentColor;
|
| |
- width: 1em;
|
| |
- height: 1em;
|
| |
- }
|
| |
- &[class*="fedora-home"] {
|
| |
- mask-image: url(../assets/img/home-active.svg);
|
| |
- }
|
| |
- &[class*="fedora-mag"] {
|
| |
- mask-image: url(../assets/img/mag-active.svg);
|
| |
- }
|
| |
- &[class*="fedora-cal"] {
|
| |
- mask-image: url(../assets/img/cal-active.svg);
|
| |
- }
|
| |
- &[class*="fedora-ask"] {
|
| |
- mask-image: url(../assets/img/ask-active.svg);
|
| |
- }
|
| |
- &[class*="fedora-more"] {
|
| |
- mask-image: url(../assets/img/more-active.svg);
|
| |
- }
|
| |
+ &[class*="fedora-"] {
|
| |
+ mask-size: contain;
|
| |
+ mask-position: 50% 50%;
|
| |
+ mask-repeat: no-repeat;
|
| |
+ background: currentColor;
|
| |
+ width: 1em;
|
| |
+ height: 1em;
|
| |
+ }
|
| |
+ &[class*="fedora-home"] {
|
| |
+ mask-image: url(../assets/img/home-active.svg);
|
| |
+ }
|
| |
+ &[class*="fedora-mag"] {
|
| |
+ mask-image: url(../assets/img/mag-active.svg);
|
| |
+ }
|
| |
+ &[class*="fedora-cal"] {
|
| |
+ mask-image: url(../assets/img/cal-active.svg);
|
| |
+ }
|
| |
+ &[class*="fedora-ask"] {
|
| |
+ mask-image: url(../assets/img/ask-active.svg);
|
| |
+ }
|
| |
+ &[class*="fedora-more"] {
|
| |
+ mask-image: url(../assets/img/more-active.svg);
|
| |
+ }
|
| |
} //tab icons-inactive
|
| |
.tabs {
|
| |
- a[aria-selected=false] {
|
| |
- .tab-button-icon[ng-reflect-name=fedora-home] {
|
| |
- mask-image: url(../assets/img/home-inactive.svg);
|
| |
- }
|
| |
+ a[aria-selected=false] {
|
| |
+ .tab-button-icon[ng-reflect-name=fedora-home] {
|
| |
+ mask-image: url(../assets/img/home-inactive.svg);
|
| |
}
|
| |
- a[aria-selected=false] {
|
| |
- .tab-button-icon[ng-reflect-name=fedora-mag] {
|
| |
- mask-image: url(../assets/img/mag-inactive.svg);
|
| |
- }
|
| |
+ }
|
| |
+ a[aria-selected=false] {
|
| |
+ .tab-button-icon[ng-reflect-name=fedora-mag] {
|
| |
+ mask-image: url(../assets/img/mag-inactive.svg);
|
| |
}
|
| |
- a[aria-selected=false] {
|
| |
- .tab-button-icon[ng-reflect-name=fedora-cal] {
|
| |
- mask-image: url(../assets/img/cal-inactive.svg);
|
| |
- }
|
| |
+ }
|
| |
+ a[aria-selected=false] {
|
| |
+ .tab-button-icon[ng-reflect-name=fedora-cal] {
|
| |
+ mask-image: url(../assets/img/cal-inactive.svg);
|
| |
}
|
| |
- a[aria-selected=false] {
|
| |
- .tab-button-icon[ng-reflect-name=fedora-ask] {
|
| |
- mask-image: url(../assets/img/ask-inactive.svg);
|
| |
- }
|
| |
+ }
|
| |
+ a[aria-selected=false] {
|
| |
+ .tab-button-icon[ng-reflect-name=fedora-ask] {
|
| |
+ mask-image: url(../assets/img/ask-inactive.svg);
|
| |
}
|
| |
- a[aria-selected=false] {
|
| |
- .tab-button-icon[ng-reflect-name=fedora-more] {
|
| |
- mask-image: url(../assets/img/more-inactive.svg);
|
| |
- }
|
| |
+ }
|
| |
+ a[aria-selected=false] {
|
| |
+ .tab-button-icon[ng-reflect-name=fedora-more] {
|
| |
+ mask-image: url(../assets/img/more-inactive.svg);
|
| |
}
|
| |
+ }
|
| |
}
|
| |
|
| |
ion-buttons {
|
| |
- button {
|
| |
- background-color: transparent;
|
| |
- }
|
| |
+ button {
|
| |
+ background-color: transparent;
|
| |
+ }
|
| |
} //tab typography
|
| |
.tabs {
|
| |
- a[aria-selected=false] {
|
| |
- span {
|
| |
- font-family: "Montserrat-Regular";
|
| |
- font-size: 12px;
|
| |
- color: #9A9FA6;
|
| |
- text-align: left;
|
| |
- }
|
| |
+ a[aria-selected=false] {
|
| |
+ span {
|
| |
+ font-family: "Montserrat-Regular";
|
| |
+ font-size: 12px;
|
| |
+ color: #9A9FA6;
|
| |
+ text-align: left;
|
| |
}
|
| |
- a[aria-selected=true] {
|
| |
- span {
|
| |
- /* Home: */
|
| |
- font-family: "Montserrat-SemiBold";
|
| |
- font-size: 12px;
|
| |
- color: #3C6EB4;
|
| |
- text-align: left;
|
| |
- line-height: 12px;
|
| |
- }
|
| |
+ }
|
| |
+ a[aria-selected=true] {
|
| |
+ span {
|
| |
+ /* Home: */
|
| |
+ font-family: "Montserrat-SemiBold";
|
| |
+ font-size: 12px;
|
| |
+ color: #3C6EB4;
|
| |
+ text-align: left;
|
| |
+ line-height: 12px;
|
| |
}
|
| |
+ }
|
| |
}
|
| |
|
| |
.tabs-md[tabsLayout=icon-top] .has-icon .tab-button-text {
|
| |
- margin-top: 8px;
|
| |
+ margin-top: 8px;
|
| |
} //styles of the tabbar
|
| |
.tabbar {
|
| |
- padding: 12px 0;
|
| |
- background-color: #fff !important;
|
| |
- box-shadow: 0 2px 4px 0 #565656 !important;
|
| |
- justify-content: space-around !important;
|
| |
+ padding: 12px 0;
|
| |
+ background-color: #fff !important;
|
| |
+ box-shadow: 0 2px 4px 0 #565656 !important;
|
| |
+ justify-content: space-around !important;
|
| |
}
|
| |
|
| |
.tab-button {
|
| |
- overflow: visible !important;
|
| |
- flex: none;
|
| |
+ overflow: visible !important;
|
| |
+ flex: none;
|
| |
} //styles of the top navbar
|
| |
ion-navbar {
|
| |
- ion-title {
|
| |
- text-align: center;
|
| |
- }
|
| |
- background-color: #fff !important;
|
| |
- box-shadow: 0 2px 4px 0 rgba(86, 86, 86, 0.05);
|
| |
+ ion-title {
|
| |
+ text-align: center;
|
| |
+ }
|
| |
+ background-color: #fff !important;
|
| |
+ box-shadow: 0 2px 4px 0 rgba(86, 86, 86, 0.05);
|
| |
}
|
| |
|
| |
.pkg-lib {
|
| |
- color: #A07CBC!important;
|
| |
+ color: #A07CBC !important;
|
| |
}
|
| |
|
| |
.pkg-devel {
|
| |
- color: #E59728!important;
|
| |
+ color: #E59728 !important;
|
| |
}
|
| |
|
| |
//segment styles
|
| |
ion-segment {
|
| |
- padding: 0px 24px 0 24px;
|
| |
- background-color: #fff;
|
| |
+ padding: 0px 24px 0 24px;
|
| |
+ background-color: #fff;
|
| |
}
|
| |
|
| |
.segment-button {
|
| |
- font-family: "Montserrat-Light";
|
| |
- font-size: 12px;
|
| |
- color: #9A9FA6;
|
| |
- text-transform: none;
|
| |
- padding: 0;
|
| |
+ font-family: "Montserrat-Light";
|
| |
+ font-size: 12px;
|
| |
+ color: #9A9FA6;
|
| |
+ text-transform: none;
|
| |
+ padding: 0;
|
| |
}
|
| |
|
| |
.segment-activated {
|
| |
- font-family: "Montserrat-SemiBold";
|
| |
- font-size: 12px;
|
| |
- color: #3C6EB4;
|
| |
- padding: 0;
|
| |
+ font-family: "Montserrat-SemiBold";
|
| |
+ font-size: 12px;
|
| |
+ color: #3C6EB4;
|
| |
+ padding: 0;
|
| |
}
|
| |
|
| |
//empty state styles
|
| |
.emptystate {
|
| |
- display: flex;
|
| |
- flex-direction: column;
|
| |
- justify-content: center;
|
| |
- text-align: center;
|
| |
- align-items: center;
|
| |
- height: 100%;
|
| |
+ display: flex;
|
| |
+ flex-direction: column;
|
| |
+ justify-content: center;
|
| |
+ text-align: center;
|
| |
+ align-items: center;
|
| |
+ height: 100%;
|
| |
+ img {
|
| |
+ margin-bottom: 20px;
|
| |
+ }
|
| |
+ h1 {
|
| |
+ font-family: "Montserrat-SemiBold";
|
| |
+ font-size: 19px;
|
| |
+ color: #79818B;
|
| |
+ margin: 0;
|
| |
+ }
|
| |
+ h2 {
|
| |
+ font-family: "OpenSans-Regular";
|
| |
+ font-size: 14px;
|
| |
+ color: #79818B;
|
| |
+ line-height: 20px;
|
| |
+ margin: 10px 0 20px 0;
|
| |
img {
|
| |
- margin-bottom: 20px;
|
| |
- }
|
| |
- h1 {
|
| |
- font-family: "Montserrat-SemiBold";
|
| |
- font-size: 19px;
|
| |
- color: #79818B;
|
| |
- margin: 0;
|
| |
- }
|
| |
- h2 {
|
| |
- font-family: "OpenSans-Regular";
|
| |
- font-size: 14px;
|
| |
- color: #79818B;
|
| |
- line-height: 20px;
|
| |
- margin: 10px 0 20px 0;
|
| |
- img {
|
| |
- margin: 0 2px;
|
| |
- display: inline-block;
|
| |
- margin-bottom: 0px;
|
| |
- }
|
| |
- }
|
| |
- button {
|
| |
- padding: 12px;
|
| |
- width: auto;
|
| |
- background: transparent;
|
| |
- border: 1px solid #3C6EB4;
|
| |
- border-radius: 2px;
|
| |
- font-family: "Montserrat-SemiBold";
|
| |
- font-size: 14px;
|
| |
- color: #3C6EB4;
|
| |
- line-height: 14px;
|
| |
+ margin: 0 2px;
|
| |
+ display: inline-block;
|
| |
+ margin-bottom: 0px;
|
| |
}
|
| |
+ }
|
| |
+ button {
|
| |
+ padding: 12px;
|
| |
+ width: auto;
|
| |
+ background: transparent;
|
| |
+ border: 1px solid #3C6EB4;
|
| |
+ border-radius: 2px;
|
| |
+ font-family: "Montserrat-SemiBold";
|
| |
+ font-size: 14px;
|
| |
+ color: #3C6EB4;
|
| |
+ line-height: 14px;
|
| |
+ }
|
| |
+ }
|
| |
+
|
| |
+ //styles for loader
|
| |
+ .loader-ellipsis {
|
| |
+ display: inline-block;
|
| |
+ position: relative;
|
| |
+ width: 64px;
|
| |
+ height: 64px;
|
| |
+ div {
|
| |
+ position: absolute;
|
| |
+ top: 27px;
|
| |
+ width: 11px;
|
| |
+ height: 11px;
|
| |
+ border-radius: 50%;
|
| |
+ background: rgba(#79818B, 0.15);
|
| |
+ animation-timing-function: cubic-bezier(0, 1, 1, 0);
|
| |
+ }
|
| |
+ div:nth-child(1) {
|
| |
+ left: 6px;
|
| |
+ animation: loader-ellipsis1 0.6s infinite;
|
| |
+ }
|
| |
+ div:nth-child(2) {
|
| |
+ left: 6px;
|
| |
+ animation: loader-ellipsis2 0.6s infinite;
|
| |
+ }
|
| |
+ div:nth-child(3) {
|
| |
+ left: 26px;
|
| |
+ animation: loader-ellipsis2 0.6s infinite;
|
| |
+ }
|
| |
+ div:nth-child(4) {
|
| |
+ left: 45px;
|
| |
+ animation: loader-ellipsis3 0.6s infinite;
|
| |
+ }
|
| |
+ }
|
| |
+
|
| |
+ @keyframes loader-ellipsis1 {
|
| |
+ 0% {
|
| |
+ transform: scale(0);
|
| |
+ }
|
| |
+ 100% {
|
| |
+ transform: scale(1);
|
| |
+ }
|
| |
}
|
| |
|
| |
- .hidden{
|
| |
- display: none;
|
| |
- }
|
| |
\ No newline at end of file
|
| |
+ @keyframes loader-ellipsis3 {
|
| |
+ 0% {
|
| |
+ transform: scale(1);
|
| |
+ }
|
| |
+ 100% {
|
| |
+ transform: scale(0);
|
| |
+ }
|
| |
+ }
|
| |
+
|
| |
+ @keyframes loader-ellipsis2 {
|
| |
+ 0% {
|
| |
+ transform: translate(0, 0);
|
| |
+ }
|
| |
+ 100% {
|
| |
+ transform: translate(19px, 0);
|
| |
+ }
|
| |
+ }
|
| |
+
|
| |
+ .loader {
|
| |
+ height: 100%;
|
| |
+ width: 100%;
|
| |
+ background-color: #EFF0F1;
|
| |
+ position: absolute;
|
| |
+ top: 0;
|
| |
+ z-index: 999;
|
| |
+ display: grid;
|
| |
+ place-items: center center;
|
| |
+ justify-content: center;
|
| |
+ }
|
| |
+
|
| |
+ .hidden {
|
| |
+ display: none;
|
| |
+ }
|
| |