How to use the @kiwicom/orbit-design-tokens.defaultTokens.paletteWhite function in @kiwicom/orbit-design-tokens

To help you get started, we’ve selected a few @kiwicom/orbit-design-tokens examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github kiwicom / margarita / packages / universal-components / src / Button / ButtonInner.js View on Github external
disabled && styles.disabled,
        typeTheme(type).wrapper,
        justifyContent,
        circled && styles.buttonCircled,
        sizeTheme(size, leftIcon != null, rightIcon != null).buttonSizeWrapper,
        style,
        isLoading && styles.loadingState,
      ]}
      testID={testID}
    >
      
      {!isLoading && (
        
      )}
    
  );
github kiwicom / margarita / apps / web / components / Navbar.js View on Github external
const styles = StyleSheet.create({
  navbar: {
    zIndex: parseInt(defaultTokens.zIndexSticky, 10),
    height: 50,
    shadowColor: '#000',
    shadowOpacity: 0.25,
    shadowOffset: {
      width: 0,
      height: 0,
    },
    shadowRadius: 3,
    paddingHorizontal: 10,
    justifyContent: 'space-between',
    alignItems: 'center',
    flexDirection: 'row',
    backgroundColor: defaultTokens.paletteWhite,
  },
  image: {
    height: 50,
    width: 80,
    marginEnd: 20,
  },
  profileImage: {
    height: parseInt(defaultTokens.heightIconLarge, 10),
    width: parseInt(defaultTokens.widthIconLarge, 10),
    borderRadius: parseInt(defaultTokens.borderRadiusCircle, 10),
    marginStart: 20,
  },
  actionsLeft: {
    flexDirection: 'row',
    alignItems: 'center',
  },
github kiwicom / margarita / packages / components / src / timelineTransportDetail / TimelineTransportDetail.js View on Github external
header={Header({ carrier, duration })}
        >
          
        
      
    
  );
}

const styles = StyleSheet.create({
  row: {
    flexDirection: 'row',
  },
  container: {
    minHeight: parseFloat(defaultTokens.heightButtonLarge),
    backgroundColor: defaultTokens.paletteWhite,
  },
  line: {
    paddingStart: 20,
    paddingEnd: 5,
  },
  strip: {
    height: 17,
    width: 2,
    backgroundColor: defaultTokens.paletteBlueNormal,
  },
  secondStrip: {
    flex: 1,
  },
  icon: {
    marginStart: -6.5,
    margin: 2,
github kiwicom / margarita / src / DatePicker / DatePickerDayTile.js View on Github external
alignItems: 'center',
    width: 30,
    height: 30,
    margin: 2,
  },
  date: { backgroundColor: defaultTokens.backgroundButtonSecondary },
  dateHovered: {
    backgroundColor: defaultTokens.backgroundButtonSecondaryHover,
  },
  selected: { backgroundColor: defaultTokens.paletteBlueNormal },
  disabled: { opacity: 0.4 },
  dateLabel: {
    flex: 1,
    textAlign: 'center',
  },
  dateLabelSelected: { color: defaultTokens.paletteWhite },
});
github kiwicom / margarita / apps / core / components / searchForm / Placepickers.js View on Github external
);
  }
}

const styles = StyleSheet.create({
  placeSwitch: {
    position: 'absolute',
    zIndex: 1,
    end: 18,
    top: '50%',
    marginTop: -20,
    alignItems: 'center',
    justifyContent: 'center',
    backgroundColor: defaultTokens.paletteWhite,
    width: parseInt(defaultTokens.widthIconLarge, 10),
    height: parseInt(defaultTokens.heightIconLarge, 10),
    borderRadius: parseInt(defaultTokens.widthIconLarge, 10) * 0.5,
    shadowOffset: { width: 0, height: 2 },
    shadowColor: 'black',
    shadowOpacity: 0.1,
    shadowRadius: 3,
    android: {
      elevation: 3,
    },
  },
  rowInput: {
    web: {
      marginEnd: parseInt(defaultTokens.spaceXSmall, 10),
    },
  },
github kiwicom / margarita / apps / core / components / passengerForm / PassengerForm.js View on Github external
const styles = StyleSheet.create({
  modal: {
    margin: 0,
  },
  formContainer: {
    flex: 1,
    width: '100%',
    backgroundColor: defaultTokens.paletteWhite,
    web: {
      backgroundColor: 'transparent',
    },
  },
  form: {
    alignSelf: 'center',
    backgroundColor: defaultTokens.paletteWhite,
    paddingHorizontal: parseInt(defaultTokens.spaceMedium, 10),
    paddingTop: 72,
    paddingBottom: 120,
    web: {
      paddingTop: parseInt(defaultTokens.spaceMedium, 10),
      paddingBottom: 88,
      borderTopStartRadius: parseInt(defaultTokens.borderRadiusBadge, 10),
      borderTopEndRadius: parseInt(defaultTokens.borderRadiusBadge, 10),
      marginTop: parseInt(defaultTokens.spaceXXLarge, 10),
    },
  },
  widthLimit: {
    width: '100%',
    web: {
      maxWidth: 414,
    },
github kiwicom / margarita / src / Notification / InformativeNotification.js View on Github external
}: Props) {
  return (
    
      
    
  );
}

const styles = StyleSheet.create({
  container: {
    justifyContent: 'center',
    alignItems: 'center',
  },
  content: {
    fontSize: 14,
    color: defaultTokens.paletteWhite,
    padding: 8,
    flex: 1,
  },
});
github kiwicom / margarita / apps / landingPage / containers / Try.js View on Github external
margin-top: 30px;
  color: ${defaultTokens.paletteWhite};
`;

const GithubLogoWrapper = styled.div`
  padding-left: ${defaultTokens.spaceXSmall};
  position: relative;
  top: ${defaultTokens.spaceXXXSmall};
`;

const FixedCardDescription = styled(CardDescription)`
  min-height: 100px;
  margin-top: 20px;
`;
const Anchor = styled.a`
  color: ${defaultTokens.paletteWhite};
`;
github kiwicom / margarita / src / Notification / ImportantNotification.js View on Github external
content: {
    flex: 1,
    flexDirection: 'column',
  },
  leftIcon: {
    paddingHorizontal: 10,
  },
  rightIcon: {
    paddingEnd: 8,
    alignSelf: 'center',
  },
  wrapper: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    fontSize: 14,
    color: defaultTokens.paletteWhite,
    flex: 1,
    paddingVertical: 5,
  },
});
github kiwicom / margarita / packages / universal-components / src / Card / Card.js View on Github external
{children}
      
    );
  }

  return ;
}

const styles = StyleSheet.create({
  wrapper: {
    backgroundColor: defaultTokens.paletteWhite,
    borderStyle: 'solid',
    padding: 10,
    android: {
      marginHorizontal: 8,
      elevation: 1,
      borderRadius: 3,
      overflow: 'hidden',
    },
    web: {
      marginHorizontal: 8,
      borderRadius: 8,
      overflow: 'hidden',
    },
    ios: {
      borderTopWidth: StyleSheet.hairlineWidth,
      borderBottomWidth: StyleSheet.hairlineWidth,