Need some help with the CSS of the wordpress leaguemanager plugin

Discussion in 'CSS' started by Pippo09, Sep 13, 2009.

0
  1. #1
    Hello,

    I would like to change some things on the leaguemanager widget. It's a wordpress plugin you can find here: http://wordpress.org/extend/plugins/leaguemanager/ . Here is my site: http://www.passionemilan.com/

    At the moment the widget is like this:

    [​IMG]

    I made something with photoshop to show you how I would like to have it:

    [​IMG]

    I would like to have the team name, the team logos, the location, the date and the time of the match centered like the picture you see.

    Here is the CSS code of the plugin:

       1.
      /*
   2.
      * @section: Backend
   3.
      */
   4.
      p.match_info {
   5.
        font-size: 0.9em;
   6.
        margin-top: 1.5em;
   7.
        }
   8.
       
   9.
      p.leaguemanager_breadcrumb {
  10.
        clear: both;
  11.
        float: right;
  12.
        margin: 1.5em 1.3em 1.3em auto;
  13.
        }
  14.
       
  15.
      .widefat .num {
  16.
        text-align: center;
  17.
        }
  18.
      .widefat .logo {
  19.
        width: 20px;
  20.
        }
  21.
      .widefat .logo img {
  22.
        display: block;
  23.
        margin: 0;
  24.
        padding: 0;
  25.
        }
  26.
      a.colorpicker {
  27.
        border: 1px solid #000000;
  28.
        font-family:Verdana;
  29.
        font-size:10px;
  30.
        width: 20px;
  31.
        height: 12px;
  32.
        text-decoration: none;
  33.
        margin: 1.4em 0.5em 0 1em;
  34.
        }
  35.
      p.table_rows {
  36.
        float: left;
  37.
        padding: 0;
  38.
        margin: 0 2em 0 0;
  39.
        }
  40.
       
  41.
      p.info { margin: 0; padding: 0; float: right; }
  42.
       
  43.
      table#standings tr { cursor: move; }
  44.
       
  45.
      span.loading { margin-left: 5px; }
  46.
      span.loading img { vertical-align: middle; }
  47.
       
  48.
      .leaguemanager_thickbox {
  49.
        text-align: center;
  50.
        }
  51.
      .leaguemanager_thickbox select {
  52.
        display: block;
  53.
        margin: 0.5em auto;
  54.
        }
  55.
       
  56.
      span.team_roster { margin-left: 0.5em; vertical-align: middle; }
  57.
       
  58.
      div.leaguemanager_widget_control label {
  59.
        padding: 0 0.5em 0.5em 0.5em;
  60.
        float: left;
  61.
        width: 7em;
  62.
      }
  63.
      div.leaguemanager_widget_control label.right {
  64.
        float: none;
  65.
        width: auto;
  66.
      }
  67.
      div.leaguemanager_widget_control input {
  68.
        margin-left: 0.5em;
  69.
        display: inline;
  70.
        clear: none;
  71.
        width: auto;
  72.
        border-width: 1px;
  73.
        border-style: solid;
  74.
        border-collapse: separate;
  75.
        border-spacing: 0;
  76.
        -moz-border-radius: 4px;
  77.
        -khtml-border-radius: 4px;
  78.
        -webkit-border-radius: 4px;
  79.
        border-radius: 4px;
  80.
        vertical-align: middle;
  81.
      }
  82.
      div.leaguemanager_widget_control select {
  83.
        margin-left: 0.5em;
  84.
        vertical-align: middle;
  85.
      }
  86.
       
  87.
       
  88.
      /*
  89.
      * @section: Frontend Tables
  90.
      */
  91.
      table.leaguemanager {
  92.
        text-align: left;
  93.
        border: 0;
  94.
        border-collapse: collapse;
  95.
        width: 100%;
  96.
        margin: 1em auto 1.5em auto;
  97.
      }
  98.
      table.leaguemanager th {
  99.
        padding: 2px 5px;
 100.
        margin: 0;
 101.
        border-bottom: 1px solid;
 102.
        }
 103.
      table.leaguemanager td {
 104.
        vertical-align: top;
 105.
        padding: 3px 5px;
 106.
        border: 0;
 107.
        margin: 0;
 108.
        border-bottom: 1px solid #f1f1f1;
 109.
        }
 110.
      table.leaguemanager .num {
 111.
        text-align: center;
 112.
        }
 113.
      table.leaguemanager .logo {
 114.
        width: 20px;
 115.
        }
 116.
      table.leaguemanager .logo img {
 117.
        display: block;
 118.
        margin: 0;
 119.
        padding: 0;
 120.
        }
 121.
      table.leaguemanager .rank {
 122.
        text-align: center;
 123.
        padding: 0;
 124.
        width: 1.2em;
 125.
        }
 126.
      table.leaguemanager .home {
 127.
        font-weight: bold;
 128.
        }
 129.
      table.leaguemanager th.match {
 130.
        text-align: center;
 131.
        }
 132.
      table.leaguemanager .score, table.leaguemanager .ap {
 133.
        vertical-align: bottom;
 134.
        }
 135.
      table.leaguemanager tr.divider {
 136.
        /*border-bottom: 1px solid;*/
 137.
        }
 138.
      table.leaguemanager a {
 139.
        text-decoration: none;
 140.
      }
 141.
       
 142.
      /*--- Crosstable Popup---*/
 143.
      div#leaguemanager_crosstable div { text-align: center; padding-top: 1em;}
 144.
       
 145.
      /*--- Archive ---*/
 146.
      div#leaguemanager_archive_selections { margin-bottom: 1em; }
 147.
       
 148.
      /*--- Single Match ---*/
 149.
      div.match h3 { clear: none; text-align: center;}
 150.
      div.match p.score, div.match p.matchdate { font-weight: bold; font-size: 1.2em; text-align: center; margin-top: 2em; }
 151.
      div.match .home_logo img, div.match .away_logo img { font-size: 1em; vertical-align: middle; }
 152.
      div.match span.home_logo { margin-right: 1em; }
 153.
      div.match span.away_logo { margin-left: 1em; }
 154.
       
 155.
      div.match table { width: 100%; margin-top: 1.5em; clear: both; }
 156.
      div.match table, div.match table th, div.match table td { border: 0; background: transparent; }
 157.
      div.match table th, div.match table td { vertical-align: top; margin: 0; }
 158.
       
 159.
      /*--- Team Page ---*/
 160.
      div.teampage {
 161.
        position: relative;
 162.
      }
 163.
      div.teampage .logo {
 164.
        position: absolute;
 165.
        right: 0;
 166.
        top: 0;
 167.
        margin-bottom: 1em;
 168.
      }
 169.
      div.teampage dl {
 170.
        margin: 1em 0;
 171.
        float: left;
 172.
      }
 173.
      div.teampage dl dt {
 174.
        float: left;
 175.
        font-weight: bold;
 176.
        width: 9em;
 177.
        clear: both;
 178.
        padding: 0.3em 0;
 179.
      }
 180.
      div.teampage dl dd {
 181.
        padding: 0.3em 0;
 182.
        float: left;
 183.
      }
 184.
      div.teampage .matches {
 185.
        margin-top: 90px;
 186.
        float: right;
 187.
      }
 188.
      div.teampage .next_match {
 189.
      }
 190.
      div.teampage .prev_match {
 191.
      }
 192.
      div.teampage .prev_match .score {
 193.
        font-size: 1.3em;
 194.
        font-weight: bold;
 195.
        margin-top: 0.5em;
 196.
      }
 197.
       
 198.
       
 199.
      /*
 200.
      * @section: Widget
 201.
      */
 202.
      .leaguemanager_widget {
 203.
        background-image: none;
 204.
        width: 300px;
 205.
        margin-left: auto;
 206.
        margin-right: auto;
 207.
        }
 208.
      .leaguemanager_widget h4 {
 209.
        position: relative;
 210.
        border-bottom: 1px solid #dddddd;
 211.
        text-align: center;
 212.
        }
 213.
      .leaguemanager_widget h4 .next {
 214.
        position: absolute;
 215.
        right: 0;
 216.
        }
 217.
      .leaguemanager_widget h4 .prev {
 218.
        position: absolute;
 219.
        left: 0;
 220.
        }
 221.
      .leaguemanager_widget h4.standings {
 222.
        margin-top: 1.5em;
 223.
        }
 224.
      .leaguemanager_widget h4 a {
 225.
        text-decoration: none;
 226.
        }
 227.
      .leaguemanager_widget img {
 228.
        border: 0;
 229.
        vertical-align: middle;
 230.
        }
 231.
       
 232.
      /*--- Match Events ---*/
 233.
      .leaguemanager_widget .match_box {
 234.
        margin-bottom: 1.5em;
 235.
        text-align: center;
 236.
        }
 237.
      .leaguemanager_widget .match_box .match {
 238.
        padding: 0.3em 0 0 0;
 239.
        margin: 0.5em 0;
 240.
        }
 241.
      .leaguemanager_widget .match_box .logos {
 242.
        margin: 0.5em auto;
 243.
        }
 244.
      .leaguemanager_widget .match_box .home_logo {
 245.
        margin-right: 0.5em;
 246.
        }
 247.
      .leaguemanager_widget .match_box .away_logo {
 248.
        margin-left: 0.5em;
 249.
        }
 250.
      .leaguemanager_widget .match_box .match_day, .leaguemanager_widget .match_box .date, .leaguemanager_widget .match_box .location {
 251.
        padding: 0;
 252.
        padding-top: 2px;
 253.
        margin: 0.3em 0;
 254.
        text-align: left;
 255.
        }
 256.
      .leaguemanager_widget .match_box .result {
 257.
        font-size: 1.3em;
 258.
        font-weight: bold;
 259.
        }
 260.
      .leaguemanager_widget .match_box .report {
 261.
        text-align: right;
 262.
        }
 263.
       
 264.
      /*--- Standings Table ---*/
 265.
      .leaguemanager_widget table.leaguemanager {
 266.
        font-size: 0.9em;
 267.
        margin: 0 auto 0 auto;
 268.
        padding: 0;
 269.
        }
 270.
      .leaguemanager_widget table.leaguemanager th {
 271.
        background-color: #ffffff;
 272.
        }
 273.
      .leaguemanager_widget table.leaguemanager th, .leaguemanager_widget table.leaguemanager td {
 274.
        padding: 4px;
 275.
        margin: 0;
 276.
        border: 0;
 277.
        border-bottom: 1px solid #dfdfdf;
 278.
        }
 279.
      .leaguemanager_widget table.leaguemanager tr, .leaguemanager_widget table.leaguemanager tr.alternate {
 280.
        background-color: #ffffff;
 281.
        }
    Code (markup):
    Hope someone can help me,

    Thank you
    Pippo09
     
    Pippo09, Sep 13, 2009 IP