Second pass at adding key files
This commit is contained in:
176
site/slowtwitch.com/www/articles/static/fileman/luna/cluetip.css
Normal file
176
site/slowtwitch.com/www/articles/static/fileman/luna/cluetip.css
Normal file
@ -0,0 +1,176 @@
|
||||
/* global */
|
||||
#cluetip-close img {
|
||||
border: 0;
|
||||
}
|
||||
#cluetip-title {
|
||||
overflow: hidden;
|
||||
}
|
||||
#cluetip-title #cluetip-close {
|
||||
float: right;
|
||||
position: relative;
|
||||
}
|
||||
#cluetip-waitimage {
|
||||
width: 43px;
|
||||
height: 11px;
|
||||
position: absolute;
|
||||
}
|
||||
.cluetip-arrows {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -11px;
|
||||
height: 22px;
|
||||
width: 11px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0 0;
|
||||
}
|
||||
#cluetip-extra {
|
||||
display: none;
|
||||
}
|
||||
/***************************************
|
||||
=cluetipClass: 'default'
|
||||
-------------------------------------- */
|
||||
|
||||
.cluetip-default {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
background: #edf2cb;
|
||||
border: 3px solid #3e3d45;
|
||||
}
|
||||
.cluetip-default #cluetip-outer {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background: #edf2cb;
|
||||
}
|
||||
.cluetip-default h3#cluetip-title {
|
||||
margin: 0 0 0px;
|
||||
font-size: 11px;
|
||||
padding: 3px 5px 2px 5px;
|
||||
background: #5d5b66;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
}
|
||||
.cluetip-default #cluetip-title a {
|
||||
color: #d9d9c2;
|
||||
}
|
||||
.cluetip-default #cluetip-inner {
|
||||
padding: 10px;
|
||||
}
|
||||
.cluetip-default div#cluetip-close {
|
||||
text-align: right;
|
||||
margin: 0 5px 5px;
|
||||
color: #900;
|
||||
}
|
||||
|
||||
/***************************************
|
||||
=cluetipClass: 'jtip'
|
||||
-------------------------------------- */
|
||||
.cluetip-jtip {
|
||||
background-color: transparent;
|
||||
}
|
||||
.cluetip-jtip #cluetip-outer {
|
||||
border: 2px solid #ccc;
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.cluetip-jtip h3#cluetip-title {
|
||||
margin: 0 0 5px;
|
||||
padding: 2px 5px;
|
||||
font-size: 16px;
|
||||
font-weight: normal;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
}
|
||||
.cluetip-jtip #cluetip-inner {
|
||||
padding: 0 5px 5px;
|
||||
display: inline-block;
|
||||
}
|
||||
.cluetip-jtip div#cluetip-close {
|
||||
text-align: right;
|
||||
margin: 0 5px 5px;
|
||||
color: #900;
|
||||
}
|
||||
|
||||
/***************************************
|
||||
=cluetipClass: 'rounded'
|
||||
-------------------------------------- */
|
||||
|
||||
.cluetip-rounded {
|
||||
background: transparent url(images/bl.gif) no-repeat 0 100%;
|
||||
margin-top: 10px;
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.cluetip-rounded #cluetip-outer {
|
||||
background: transparent url(images/tl.gif) no-repeat 0 0;
|
||||
margin-top: -12px;
|
||||
}
|
||||
|
||||
.cluetip-rounded #cluetip-title {
|
||||
background-color: transparent;
|
||||
padding: 12px 12px 0;
|
||||
margin: 0 -12px 0 0;
|
||||
position: relative;
|
||||
}
|
||||
.cluetip-rounded #cluetip-extra {
|
||||
position: absolute;
|
||||
display: block;
|
||||
background: transparent url(images/tr.gif) no-repeat 100% 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 12px;
|
||||
height: 30px;
|
||||
margin: -12px -12px 0 0;
|
||||
}
|
||||
.cluetip-rounded #cluetip-inner {
|
||||
padding: 5px 12px 12px;
|
||||
margin: -18px -12px 0 0;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cluetip-rounded div#cluetip-close {
|
||||
text-align: right;
|
||||
margin: 0 5px 5px;
|
||||
color: #009;
|
||||
background: transparent;
|
||||
}
|
||||
.cluetip-rounded div#cluetip-close a {
|
||||
color: #777;
|
||||
}
|
||||
|
||||
/* rounded arrows */
|
||||
|
||||
.clue-right-rounded .cluetip-arrows {
|
||||
background-image: url(images/rarrowleft.gif);
|
||||
}
|
||||
.clue-left-rounded .cluetip-arrows {
|
||||
background-image: url(images/rarrowright.gif);
|
||||
left: 100%;
|
||||
margin-left: 12px;
|
||||
}
|
||||
.clue-top-rounded .cluetip-arrows {
|
||||
background-image: url(images/rarrowdown.gif);
|
||||
top: 100%;
|
||||
left: 50%;
|
||||
margin-left: -11px;
|
||||
height: 11px;
|
||||
width: 22px;
|
||||
}
|
||||
.clue-bottom-rounded .cluetip-arrows {
|
||||
background-image: url(images/rarrowup.gif);
|
||||
top: -23px;
|
||||
left: 50%;
|
||||
margin-left: -11px;
|
||||
height: 11px;
|
||||
width: 22px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* stupid IE6 HasLayout hack */
|
||||
.cluetip-rounded #cluetip-title,
|
||||
.cluetip-rounded #cluetip-inner {
|
||||
zoom: 1;
|
||||
}
|
@ -0,0 +1,115 @@
|
||||
table.jCalendar {
|
||||
border: 1px solid #000;
|
||||
background: #aaa;
|
||||
border-collapse: separate;
|
||||
border-spacing: 2px;
|
||||
}
|
||||
table.jCalendar th {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
padding: 3px 5px;
|
||||
}
|
||||
table.jCalendar td {
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
padding: 3px 5px;
|
||||
text-align: center;
|
||||
}
|
||||
table.jCalendar td.other-month {
|
||||
background: #ddd;
|
||||
color: #aaa;
|
||||
}
|
||||
table.jCalendar td.today {
|
||||
background: #666;
|
||||
color: #fff;
|
||||
}
|
||||
table.jCalendar td.selected {
|
||||
background: #f66;
|
||||
color: #fff;
|
||||
}
|
||||
table.jCalendar td.selected:hover {
|
||||
background: #f33;
|
||||
color: #fff;
|
||||
}
|
||||
table.jCalendar td:hover, table.jCalendar td.dp-hover {
|
||||
background: #fff;
|
||||
color: #000;
|
||||
}
|
||||
table.jCalendar td.disabled, table.jCalendar td.disabled:hover {
|
||||
background: #bbb;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
/* For the popup */
|
||||
|
||||
/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */
|
||||
|
||||
div.dp-popup {
|
||||
position: relative;
|
||||
background: #ccc;
|
||||
font-size: 10px;
|
||||
font-family: arial, sans-serif;
|
||||
padding: 2px;
|
||||
width: 171px;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
div#dp-popup {
|
||||
position: absolute;
|
||||
z-index: 5000;
|
||||
}
|
||||
div.dp-popup h2 {
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
margin: 2px 0;
|
||||
padding: 0;
|
||||
}
|
||||
a#dp-close {
|
||||
font-size: 11px;
|
||||
padding: 4px 0;
|
||||
text-align: center;
|
||||
display: block;
|
||||
}
|
||||
a#dp-close:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
div.dp-popup a {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
padding: 3px 2px 0;
|
||||
}
|
||||
div.dp-popup div.dp-nav-prev {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 4px;
|
||||
width: 100px;
|
||||
}
|
||||
div.dp-popup div.dp-nav-prev a {
|
||||
float: left;
|
||||
}
|
||||
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
|
||||
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
|
||||
cursor: pointer;
|
||||
}
|
||||
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
|
||||
cursor: default;
|
||||
}
|
||||
div.dp-popup div.dp-nav-next {
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
right: 4px;
|
||||
width: 100px;
|
||||
}
|
||||
div.dp-popup div.dp-nav-next a {
|
||||
float: right;
|
||||
}
|
||||
div.dp-popup a.disabled {
|
||||
cursor: default;
|
||||
color: #aaa;
|
||||
}
|
||||
div.dp-popup td {
|
||||
cursor: pointer;
|
||||
}
|
||||
div.dp-popup td.disabled {
|
||||
cursor: default;
|
||||
}
|
@ -0,0 +1,82 @@
|
||||
@import url(luna_core.css);
|
||||
|
||||
/*
|
||||
This file inherits from luna_core.css, so styles in this file will override
|
||||
styles defined in it. Changes to this file will NOT be overwritten during
|
||||
upgrades.
|
||||
|
||||
Here's a quick tutorial on overriding styles. Say you want to change the
|
||||
background colour of the body. Looking at luna_core.css, the colour is
|
||||
defined in the rule:
|
||||
|
||||
body {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
color: #33332e;
|
||||
background: #ffffff;
|
||||
font: normal 11px tahoma, geneva, verdana, sans-serif;
|
||||
}
|
||||
|
||||
To change the background colour of white (#ffffff) to gray (#dddddd), you would
|
||||
add the following to this file:
|
||||
|
||||
body {
|
||||
background: #dddddd;
|
||||
}
|
||||
|
||||
If you also wanted to change the font as well as the background, then you could
|
||||
use:
|
||||
|
||||
body {
|
||||
background: #dddddd;
|
||||
font: normal 12px times new roman;
|
||||
}
|
||||
|
||||
Also note that every template's body id is assigned the template name (without
|
||||
the .htm extension). So if you want to change the h2 heading in the
|
||||
home.htm template, you can do this by:
|
||||
|
||||
#home h2 {
|
||||
color: red;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
To start you off, some sample overriding styles have been provided below. Note
|
||||
that you will have to uncomment the rules for them to work.
|
||||
*/
|
||||
|
||||
/* Logo size and image source */
|
||||
/*
|
||||
#logo {
|
||||
width: 250px;
|
||||
height: 80px;
|
||||
background-image: url(images/logo.gif);
|
||||
}
|
||||
*/
|
||||
/* If the height of your logo changes from the original, then you will probably
|
||||
want to also change the vertical position of the login link */
|
||||
/*
|
||||
#loginbar a {
|
||||
margin-top: 25px;
|
||||
}
|
||||
*/
|
||||
|
||||
/* Change width of document */
|
||||
/*
|
||||
#wrapper {
|
||||
width: 750px;
|
||||
}
|
||||
*/
|
||||
|
||||
/* Don't want the shadows? */
|
||||
/*
|
||||
.shadowtop, .shadowbottom, .shadowleft, .shadowright {
|
||||
background: none;
|
||||
}
|
||||
.shadowtopleft, .shadowtopright, .shadowbottomleft, .shadowbottomright {
|
||||
width: auto;
|
||||
height: auto;
|
||||
float: none;
|
||||
background: none;
|
||||
}
|
||||
*/
|
1298
site/slowtwitch.com/www/articles/static/fileman/luna/luna_core.css
Normal file
1298
site/slowtwitch.com/www/articles/static/fileman/luna/luna_core.css
Normal file
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user