Ignore:
Timestamp:
23 Jan 2014, 07:30:17 (11 years ago)
Author:
Henrik Bettermann
Message:

Line up and harmonize boxes.

Location:
main/waeup.kofa/branches/uli-diazo-themed/layout
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • main/waeup.kofa/branches/uli-diazo-themed/layout/static/css/base.css

    r10957 r10960  
    55.breadcrumb {
    66    background-color: #fff;
    7     margin-bottom: 10px;
    8     margin-top: 10px;
    9     padding-left: 20px;
    10     padding-right: 20px;
     7    margin-bottom: 0px;
     8    margin-top: 0px;
     9    padding: 2px 15px;
     10}
     11
     12.kofa-sidebar, .kofa-content-wide,
     13.kofa-content-narrow , .kofa-breadcrumbs-box {
     14    padding: 0px 5px 0px 5px;
    1115}
    1216
    1317.well {
    1418    background-color: #fff;
     19    padding: 5px 5px;
     20    margin-bottom: 10px;
    1521}
    1622
    17 .kofa-sidebar .well {
    18     padding: 5px;
     23.kofa-content-wide .well, .kofa-content-narrow .well {
     24    padding: 0px 15px 10px 15px;
    1925}
     26
    2027
    2128.kofa-sidebar-title {
    … …  
    2330    font-size: 14px;
    2431    color: #555;
    25     padding-top: 15px;
    26     padding-bottom: 10px;
    27     padding-left: 8px;
     32    padding: 15px 0px 10px 8px;
    2833}
    2934

  • main/waeup.kofa/branches/uli-diazo-themed/layout/theme.html

    r10959 r10960  
    4141          <span class="icon-bar"></span>
    4242        </button>
    43         <a class="navbar-brand active kofa-brand-link" href="/">EkoDisco</a>
     43        <a class="navbar-brand active kofa-brand-link" href="/">WAeUP.Kofa</a>
    4444      </div>
    4545      <div class="navbar-collapse collapse"
    … …  
    7171    </div><!-- /.navbar -->
    7272
    73     <div class="container kofa-breadcrumbs-box">
    74       <div class="row">
    75 
    76         <ol class="breadcrumb kofa-breadcrumbs">
    77           <li class="kofa-breadcrumb">
    78             <a href="#">
    79               Home
    80             </a>
    81           </li>
    82           <li class="kofa-breadcrumb">
    83             <a href="#">
    84               Subtopic
    85             </a>
    86           </li>
    87         </ol><!-- /kofa-breadcrumbs -->
    88 
    89       </div>
    90     </div>
    91 
    9273    <div class="container">
    9374
    9475      <div class="row">
    95         <div class="col-md-3 kofa-sidebar">
     76        <div class="col-md-12 container kofa-breadcrumbs-box">
     77          <div class="well">
     78            <ol class="breadcrumb kofa-breadcrumbs">
     79              <li class="kofa-breadcrumb">
     80                <a href="#">
     81                  Home
     82                </a>
     83              </li>
     84              <li class="kofa-breadcrumb">
     85                <a href="#">
     86                  Subtopic
     87                </a>
     88              </li>
     89            </ol><!-- /kofa-breadcrumbs -->
     90          </div> <!-- /well -->
     91        </div> <!-- /kofa-breadcrumbs-box -->
     92      </div> <!-- /row -->
     93
     94      <div class="row">
     95        <div class="col-md-2 kofa-sidebar">
    9696          <div class="sidebar-nav well">
    9797            <ul class="nav nav-list">
    … …  
    106106            </ul>
    107107          </div> <!-- /well -->
    108         </div><!-- /kofa-sidebar -->
    109         <div class="col-md-9 content well kofa-content kofa-content-narrow">
     108        </div> <!-- /kofa-sidebar -->
     109        <div class="col-md-10 content kofa-content kofa-content-narrow">
     110          <div class="well">
     111            <div class="hero-unit kofa-content-label-box">
     112              <h1 class="kofa-content-label-title">waeup.kofa theme</h1>
     113              <p class="kofa-content-label-descr">
     114                A sample theme for waeup.kofa</p>
     115            </div>
     116            <p>
     117              Donec id elit non mi porta gravida at eget metus. Fusce
     118              dapibus, tellus ac cursus commodo, tortor mauris
     119              condimentum nibh, ut fermentum massa justo sit amet
     120              risus. Etiam porta sem malesuada magna mollis
     121              euismod. Donec sed odio dui.
     122            </p>
     123            <img src="static/img/bg.png" />
     124          </div> <!-- /well -->
     125        </div> <!-- /kofa-content-narrow -->
     126      </div> <!-- /row -->
    110127
    111           <div class="hero-unit kofa-content-label-box">
    112             <h1 class="kofa-content-label-title">waeup.kofa theme</h1>
    113             <p class="kofa-content-label-descr">
    114               A sample theme for waeup.kofa</p>
    115           </div>
     128      <div class="row">
     129        <div class="col-md-12 content kofa-content kofa-content-wide">
     130          <div class="well">
     131            <div class="hero-unit">
     132              <h1>Hello there!</h1>
     133              <p>this is...</p>
     134            </div>
     135            <div>...content that spans the whole page.</div>
     136            <div id="#sampleform">
     137              <form method="post">
     138                <fieldset id="form-fieldset">
     139                  <legend>A Sample Form</legend>
     140                  <div class="form-field">
     141                    <label>Some Label</label>
     142                    <input type="text" class="textType"
     143                           name="myinput[]" placeholder="A name..." />
     144                  </div>
     145                  <button type="submit" class="btn rowadd">
     146                    Add row
     147                  </button>
     148                  <br />
     149                  <button type="submit" class="btn btn-primary">Save</button>
     150                </fieldset>
     151              </form>
     152            </div> <!-- /sampleform -->
     153          </div> <!-- /well -->
     154        </div> <!-- /kofa-content-wide -->
     155      </div> <!-- /row -->
    116156
    117           <p>
    118             Donec id elit non mi porta gravida at eget metus. Fusce
    119             dapibus, tellus ac cursus commodo, tortor mauris
    120             condimentum nibh, ut fermentum massa justo sit amet
    121             risus. Etiam porta sem malesuada magna mollis
    122             euismod. Donec sed odio dui.
     157      <div class="row">
     158        <div class="footer">
     159          <hr />
     160          <p class="credit muted text-right">
     161            <a href="//waeup.org">&copy; WAeUP Group 2014</a>
    123162          </p>
     163        </div>
     164      </div> <!-- /row -->
    124165
    125           <img src="static/img/bg.png" />
    126 
    127         </div>
    128       </div><!-- /row-fluid -->
    129 
    130       <div class="row-fluid">
    131         <div class="span12 content well kofa-content kofa-content-wide">
    132           <div class="hero-unit">
    133             <h1>Hello there!</h1>
    134             <p>this is...</p>
    135           </div>
    136           <div>...content that spans the whole page.</div>
    137 
    138           <div id="#sampleform">
    139             <form method="post">
    140               <fieldset id="form-fieldset">
    141                 <legend>A Sample Form</legend>
    142                 <div class="form-field">
    143                   <label>Some Label</label>
    144                   <input type="text" class="textType"
    145                          name="myinput[]" placeholder="A name..." />
    146                 </div>
    147                 <button type="submit" class="btn rowadd">
    148                   Add row
    149                 </button>
    150                 <br />
    151                 <button type="submit" class="btn btn-primary">Save</button>
    152               </fieldset>
    153             </form>
    154           </div><!-- /sampleform -->
    155 
    156         </div>
    157       </div><!-- /row-fluid -->
    158 
    159       <div class="footer">
    160         <hr />
    161         <p class="credit muted text-right">
    162           <a href="//waeup.org">&copy; WAeUP Group 2014</a>
    163         </p>
    164       </div>
    165 
    166 
    167     </div><!-- /container-fluid -->
    168 
     166    </div> <!-- /container -->
    169167
    170168    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
Note: See TracChangeset for help on using the changeset viewer.