Commit 3ae9bd70 authored by Scott Ames's avatar Scott Ames
Browse files

fixed alignment issues and added color back

parent e9f6cf98

app/src/components/presentational/ConsoleAppBar.jsx

+8 −1
Original line number Diff line number Diff line
@@ -60,7 +60,14 @@ export default function ConsoleAppBar(props) { 
            <Divider orientation="vertical" />

            <Grid container item direction="column" xs>

              <ConsoleTargetInfo target={props.target} />

              <Grid container item xs justify="space-around" wrap="nowrap">

              <Grid

                container

                item

                xs

                justify="space-evenly"

                alignItems="center"

                wrap="nowrap"

              >

                <ConsoleLonLatSelects />

                <ConsoleCoordinates />

              </Grid>

app/src/components/presentational/ConsoleCoordinates.jsx

+3 −3
Original line number Diff line number Diff line
@@ -17,20 +17,20 @@ const useStyles = makeStyles({ 
  },

  title: {

    color: "#343a40",

    //fontSize: "12px",

    lineHeight: "1rem",

    paddingBottom: 1,

    fontWeight: 600

  },

  coords: {

    color: "#343a40",

    lineHeight: "1.5rem",

    lineHeight: "1.4rem",

    fontSize: "13px"

  },

  container: {

    display: "flex",

    flexWrap: "noWrap",

    width: "85%",

    width: "90%",

    height: 40,

    margin: "auto",

    "& > *": {

      margin: 0,

app/src/components/presentational/ConsoleLonLatSelects.jsx

+9 −8
Original line number Diff line number Diff line
@@ -47,9 +47,9 @@ const useStyles = makeStyles(theme => ({ 
  },

  paper: {

    display: "flex",

    border: `1px solid ${theme.palette.divider}`,

    border: `1px solid` & fade("#1971c2", 0.7),

    flexWrap: "wrap",

    backgroundColor: "#f8f9fa"

    backgroundColor: fade("#1971c2", 0.7)

  }

}));
@@ -74,8 +74,8 @@ const StyledToggleButton = withStyles(theme => ({ 
    height: 30,

    minHeight: 30,

    maxHeight: 30,

    color: fade("#343a40", 0.8),

    backgroundColor: "#f8f9fa",

    color: fade("#f8f9fa", 0.8),

    backgroundColor: "transparent",

    border: "none",

    borderRadius: 0,

    "&:hover": {
@@ -84,10 +84,10 @@ const StyledToggleButton = withStyles(theme => ({ 
    "&$selected": {

      cursor: "not-allowed",

      pointerEvents: "none",

      color: "#343a40",

      backgroundColor: fade("#dee2e6", 0.75),

      color: "#f8f9fa",

      backgroundColor: "#1971c2",

      "&:hover": {

        backgroundColor: "transparent"

        backgroundColor: "#1971c2"

      }

    }

  },
@@ -101,7 +101,7 @@ const StyledToggleButton = withStyles(theme => ({ 


const StyledToggleButtonGroup = withStyles(theme => ({

  root: {

    backgroundColor: "#f8f9fa"

    backgroundColor: "transparent"

  },

  grouped: {

    margin: theme.spacing(0.5),
@@ -121,6 +121,7 @@ const StyledDivider = withStyles(theme => ({ 
    alignSelf: "stretch",

    height: "auto",

    margin: theme.spacing(1, 0.5),

    backgroundColor: fade("#f8f9fa", 0.8),

    width: 1

  }

}))(Divider);

app/src/components/presentational/CreditsDisplay.jsx

+20 −16
Original line number Diff line number Diff line
@@ -74,10 +74,7 @@ export default function CreditsDisplay() { 
        </Grid>

        <Divider orientation="vertical" />

        <Grid item xs={4}>

          <Typography

            style={{ fontSize: 12, margin: "auto" }}

            variant="caption"

          >

          <Typography style={{ fontSize: 12 }} variant="caption">

            Made by{" "}

            <Link

              variant="caption"
@@ -88,17 +85,17 @@ export default function CreditsDisplay() { 
              CartoCosmos{" "}

            </Link>

          </Typography>

          <div style={{ display: "inline" }}>

          <SvgIcon

            viewBox="0 0 1000 1000"

            style={{

              color: "#343a40",

                fontSize: 16

                //margin: "auto"

              top: 3,

              width: 13,

              height: 13,

              position: "relative"

            }}

            component={CartoCosmosIcon}

          />

          </div>

        </Grid>

        <Divider orientation="vertical" />

        <Grid item xs={2}>
@@ -114,7 +111,14 @@ export default function CreditsDisplay() { 
        <Divider orientation="vertical" />

        <Grid item xs={2}>

          <Link href="https://github.com/CartoCosmos/CartoCosmos/app">

            <GitHubIcon style={{ color: "#343a40", fontSize: 20 }} />

            <GitHubIcon

              style={{

                color: "#343a40",

                fontSize: 16,

                top: 2,

                position: "relative"

              }}

            />

          </Link>

        </Grid>

      </Grid>