id	summary	reporter	owner	description	type	status	priority	milestone	component	resolution	keywords	cc	parents
833	Mobile-responsive CSS for main site	msjoinder		"Adding the following to the end of static/css/base.css makes the main site much easier to read and navigate on a mobile device -- I have created a fork on Gitorious but I am having a headache learning to use it. Try this for yourselves by changing base.css and narrowing the browser window:

@media (max-width: 550px) {
  body {
    width: 100%;
    max-width: 100%;
    min-width: 100%;
  }
  .mediagoblin_header {
    height: auto;
  }
  .mediagoblin_header_right {
    float: left;
  }
  img {
    max-width: 100%;
  }
  li {
    max-width: 75%;
  }
  .connector {
    display: none;
  }
  .mediagoblin_footer {
    height: auto;
    bottom: 12px;
  }
  .container_16,
  .container_16 .grid_1,
  .container_16 .grid_2,
  .container_16 .grid_3,
  .container_16 .grid_4,
  .container_16 .grid_5,
  .container_16 .grid_6,
  .container_16 .grid_7,
  .container_16 .grid_8,
  .container_16 .grid_9,
  .container_16 .grid_10,
  .container_16 .grid_11,
  .container_16 .grid_12,
  .container_16 .grid_13,
  .container_16 .grid_14,
  .container_16 .grid_15,
  .container_16 .grid_16 {
    width: 96%;
    max-width: 96%;
    min-width: 96%;
    float: left;
    overflow-x: hidden;
  }
}"	enhancement	closed	minor		graphic design/interface	fixed	mobile, responsive