Alexandro Colorado wrote:
> ok if you can do that that{s great, just want to encourage to clean up
> the current state of the site where there are different css running
> aound on different paths that are just hard to manage and some of them
> might be deprectated. An example, would be having 4 css files on root.
> exceptions.css home.css sitemap.css styles.css
Oh in that sense, yes, I agree.
The current structure is a bit funny to deal with, yes you have the file
"where you need it", but it may result in conflicts and it may not even
be so easy to find what you are looking for (it's just my feeling
though, maybe because I'm used to work with a single huge file).
See the attachment with the cleaned up code and the comments (idea
borrowed from another project I'm contributing to).
I noticed there is the possibility to specify an id for the body tag,
that is cool and may already help to target specific pages with custom
styles if needed.
I wonder also about the "local" websites (I mean the different
languages). I see... several variants in respect to both design and
content. Is there the intention to move them to a standard appearance or
just let them be with whatever style they have?
Emanuele
/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
/* INTRODUCTION
/* This is the standard site css.
/* If you need specific styles for a certain page, add them here in the
/* appropriate section.
/* If the section doesn't exist create one and add it to the list here below.
/* ------------------------------------------------------- */
/* $CONTENTS
/*
/* $COMMON..........Common styles, tags and so on.
/* $BOOTSTRAP.......Site-wide overrides for Bootstrap standard styles.
/* $HEADER..........Styles that apply to anything above the linktree (included).
/* $CONTAINER.......The main content of each page (between header and footer).
/* $FOOTER..........There is an header, a content, and here it is the footer.
/* $HOME............The home page is a bit special, these are the custom styles.
/* $PRODUCT.........Tweaks for the pages in the /product/ directory.
/* $WHY.............Special class required for the "Why AOO" pages.
/* $MEDIAQUERY......Responsive FTW!
/* ------------------------------------------------------- */
/* $COMMON */
/* ------------- */
body {
font-family: Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif;
padding-top: 30px;
}
a, a:hover {
text-decoration:underline;
}
a, a:visited, a:hover {
color: #107EC0;
}
a img {
border: none;
}
h1,h2,h3,h4,h5,h6 {
color: #193240;
}
h1 {
border: 0;
margin: 0;
padding: 0;
background: 0;
text-align: center;
}
/* @todo review on pages different than the home */
h2,h3,h4,h5,h6 {
margin: 10px 0 15px;
padding: 5px 0;
}
table {
border-collapse:collapse;
margin: auto;
}
th {
height: 40px;
background: #f5f8fa;
border: 1px solid #a3afb6;
vertical-align: middle;
font-size: 0.9em;
}
td {
vertical-align: top;
border: 1px solid #a3afb6;
padding: 0.4em 0.5em 0.4em 0.5em;
font-size: 0.9em;
}
input {
border: 1px solid #999;
background-color: #EEE;
padding: 1px;
}
/* $BOOTSTRAP */
/* ---------------- */
.navbar-brand {
padding: 0;
overflow: hidden;
text-indent: -9999px;
background: url(../images/AOO_logos/AOO4_website_logo.png) -5px -10px no-repeat;
background-size: auto 70px;
width: 0;
}
/* A light blue for bootstrap boxes */
.verylightblue {
background-color: #fbfcfd;
border-color: #c6cbdd;
}
/* $HEADER */
/* ------------- */
#aoo_heading {
overflow: hidden;
}
#aoo_heading img {
margin: -20px 0;
}
#bannera {
font-size:12pt;
}
#languagesdiv {
float: right;
padding: 0 20pt 4pt 16pt;
}
.page-header h1 small {
display: block;
padding-bottom: 0.2em;
}
/* $CONTAINER */
/* -------------- */
#content {
margin: 0 auto 20px;
padding: 12px 3% 32px;
color: #333;
overflow: auto;
max-width: 1280px;
}
#content h2 {
font-size: 1.2em;
padding: 0.5em 1em;
border-bottom: 1px solid #c6cbdd;
}
#content h3,h4,h5,h6 {
border-bottom: none;
font-size: 1em;
margin-bottom: 0;
}
#content li {
margin-bottom: 0.5em;
}
/* $FOOTER */
/* ------------- */
#footera {
border-top: 2px solid #ccc;
color:#666;
font-size: 8pt;
}
#footera .links {
text-align:center;
padding-top: 20px;
}
#footera .links, #footera .disclaimer {
padding-left: 20px;
padding-bottom: 5px;
}
#footera .poweredby {
float: right;
width: 210px;
height: 100px;
padding-top: 10px;
}
/* $HOME */
/* ------------- */
/* Carousel area */
#announce {
height: 24pt;
border-top: 1px solid #c6cbdd;
background-color: #fbfcfd;
font-size: 1.2em;
text-align: center;
overflow: auto;
min-height: 180px;
}
#announce p {
padding: 0.75em 5em 0px;
color: #555555;
}
.carousel-control.right,
.carousel-control.left {
background: transparent;
}
.carousel-control {
width: 3em;
}
.carousel-indicators {
bottom: 0;
margin-bottom: 0;
padding-bottom: 0;
}
.carousel-indicators li {
border-color: #107EC0;
}
.inlinec {
display: inline-block;
width: 74%;
}
/* Central space */
#blogposts {
display: inline-block;
width: 25%;
padding-top: 15px;
}
#actionstatements ul, #blogposts {
vertical-align: top;
}
#actionstatements {
margin: 1em 3%;
}
#actionstatements a {
text-decoration: none;
}
#actionstatements h2 {
font-size: 1.5em;
margin: 0;
padding: 0px;
border: none;
padding-left: 50px;
}
#actionstatements a h2 {
color: #444;
line-height: 0;
}
#actionstatements p {
margin: 5px 5px 5px 55px;
padding: 10px 0 0;
color: #666;
font-size: .8em;
}
#actionstatements ul {
display: table-row;
}
#actionstatements li {
list-style: none;
border-top: 1px dotted #CCC;
padding-top:10px;
width: 50%;
display: table-cell;
}
#actionstatements ul:last-child li {
border-bottom: 1px dotted #CCC;
}
#actionstatements li:hover {
background: url(../images/action-b.png) #E8F0FD repeat-x;
}
#actionstatements li h2:before {
content: '';
display: inline-block;
padding: 25px;
vertical-align: middle;
margin-left: -50px;
background: url(../images/action-i.png) no-repeat;
}
#actionstatements .action-info h2:before {background-position: 0 9px;}
#actionstatements .action-info:hover h2:before {background-position: 0 -41px;}
#actionstatements .action-participate h2:before {background-position: 0 -91px}
#actionstatements .action-participate:hover h2:before {background-position: 0 -141px}
#actionstatements .action-social h2:before {background-position: 0 -191px}
#actionstatements .action-social:hover h2:before {background-position: 0 -241px}
#actionstatements .action-help h2:before {background-position: 0 -291px}
#actionstatements .action-help:hover h2:before {background-position: 0 -341px}
#actionstatements .action-extend h2:before {background-position: 0 -391px}
#actionstatements .action-extend:hover h2:before {background-position: 0 -441px}
#actionstatements .action-download h2:before {background-position: 0 -491px}
#actionstatements .action-download:hover h2:before {background-position: 0 -541px}
#actionstatements .action-social .action-social-extra a {
white-space: nowrap;
padding: 5px 10px 5px 5px;
}
/* $PRODUCT */
/* ------------ */
#leftnav {
float: left;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
/* $WHY */
/* ------------ */
.rfloatimg {
margin: 10px;
float: right;
}
/* $MEDIAQUERY */
/* ------------- */
@media screen and (max-width: 64em) {
#content {
padding-right: 0.5em;
padding-left: 0.5em;
}
#actionstatements {
padding: 0;
margin: 0;
}
}
@media screen and (max-width: 55em) {
#headerform:after {
content: '';
display: block;
clear: both;
}
#headerform .navbar-form {
margin-right: 0;
padding-right: 0;
}
#headerform>div {
display: inline-block;
vertical-align: top;
width: 50%;
}
#blogposts {
max-width: 20em;
}
#blogposts, .inlinec {
display: block;
width: 100%;
padding-top: 15px;
}
#actionstatements ul {
display: block;
width: 100%;
padding: 0;
}
#cse-search-box-header-menu .form-group {
margin-top: 8px;
padding: 0 10px 0 190px;
}
#cse-search-box-header-menu .form-control {
display: inline-block;
width: auto;
vertical-align: middle;
}
}
@media screen and (max-width: 767px) {
.navbar-brand {
display: inline;
}
}
@media screen and (max-width: 30em) {
#cse-search-box-header-menu {
float: right;
}
#cse-search-box-header-menu .form-group {
padding: 0 5px;
}
#headerform>div {
width: 100%;
float: none;
display: block;
padding: 0.5em 1em;
}
#bannerright .form-group input {
width: 100%;
}
.page-header h1 small {
display: none;
}
#actionstatements li {
display: block;
width: 100%;
}
}
---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscr...@openoffice.apache.org
For additional commands, e-mail: dev-h...@openoffice.apache.org
