Lexiconga/css/styles.css

434 lines
6.8 KiB
CSS

body {
padding: 0;
margin: 0;
border: none;
font-family: Georgia, 'Times New Roman', Times, serif;
}
contents {
display: block;
width: 100%;
}
footer {
width: 100%;
text-align: center;
vertical-align: middle;
position:fixed;
bottom: 0px;
left: 0px;
background: #aaaaaa;
padding: 6px;
max-height: 32px; /* Update Dictionary Container's bottom margin to account for footer */
}
table {
border-collapse: collapse;
width: 100%;
}
tr, thead {
border-bottom: 1px solid #afafaf;
}
tr:last-child {
border-bottom: none;
}
td, th {
border-right: 1px solid #afafaf;
padding: 3px 10px;
}
td:last-child, th:last-child {
border-right: none;
}
.inline {
display: inline !important;
}
#leftColumn {
float: left;
}
form {
padding: 15px;
}
#wordEntryForm {
width: 30%;
max-width: 400px;
min-width: 260px;
margin: 15px 0 15px 15px;
border: outset 3px;
}
label {
display: block;
margin-bottom: 10px;
}
label span {
display: block;
font-weight: bold;
}
label span .helperlink {
font-size: 10px;
}
label label {
margin-left: 20px;
}
label span.checkboxlabel {
display: inline;
margin-left: 10px;
}
input, textarea {
display: block;
padding-left: 5px;
}
input[type=checkbox] {
display: inline;
margin: 5px;
}
#longDefinition {
width: 80%;
min-width: 260px;
height: 150px;
}
#updateConflict {
width: 260px;
}
#errorMessage, #updateConflictMessage, #settingsErrorMessage {
display: block;
color: maroon;
font-weight: bold;
}
#dictionaryWarn {
margin-top: 10px;
font-size: 12px;
font-weight: bold;
font-style: italic;
}
.exportWarnText {
display: inline;
color: red;
cursor: pointer;
text-decoration: underline;
}
#formLockButton {
float: right;
}
#createAccountSubmitButton, #accountSettingsSubmitButton {
margin-top: 10px;
}
#aboutButton {
display: inline;
margin: 0 10px 0 0;
}
#announcementArea, #notificationArea {
text-align:center;
padding:10px;
border-radius:5px;
margin:0 auto;
width:50%;
min-width:200px;
}
#dictionaryContainer {
margin: 15px 0 36px 15px; /* bottom margin must clear footer */
width: 60%;
min-width: 260px;
max-width: 600px;
float: left;
}
#dictionaryName {
margin: 0 0 5px;
}
#dictionaryDescription {
width: 100%;
max-height: 400px;
overflow-y: auto;
padding: 15px;
border: 1px solid #cacaca;
margin: 10px;
}
.clickable, .helperlink {
display: inline;
font-weight: bold;
font-size: 13px;
padding: 4px;
background: #dddddd;
border-radius: 5px;
}
.clickable {
cursor: pointer;
}
#descriptionToggle, #searchFilterToggle {
display: inline-block;
margin: 8px;
font-weight: bold;
font-size: 12px;
cursor: pointer;
}
#wordFilter {
margin: 10px 0;
}
#filterWordCount {
margin: 10px 10px;
display: block;
font-weight: bold;
font-style: italic;
}
entry {
display: block;
width: 90%;
min-width: 200px;
padding: 10px 10px 3px;
border: outset 3px;
margin-bottom: 5px;
}
.wordLink {
text-decoration: none;
float: right;
font-size: 13px;
padding: 2px;
line-height: 10px;
}
word {
font-weight: bold;
font-size: 20px;
}
pronunciation {
font-size: 12px;
margin-left:10px;
}
partofspeech {
font-style: italic;
font-weight: bold;
font-size: 10px;
margin-left:10px;
}
simpledefinition {
display: block;
font-style: italic;
}
longdefinition {
display: block;
margin-left: 20px;
}
longDefinition h1, longDefinition h2, longDefinition h3, longDefinition h4, longDefinition h5, longDefinition h6 {
margin: 5px 0 8px;
font-weight: bold;
}
longDefinition h1 {
font-size: 22px;
}
longDefinition h2 {
font-size: 20px;
}
longDefinition h3 {
font-size: 20px;
font-weight: normal;
}
longDefinition h4 {
font-size: 18px;
}
longDefinition h5 {
font-size: 18px;
font-weight: normal;
}
longDefinition h6 {
font-size: 17px;
}
longDefinition p {
margin: 3px 0 8px;
}
searchTerm {
display: inline;
color: #ff0000;
background: #ffff00;
padding: 1px;
text-decoration: underline;
font-style: italic;
font-weight: bold;
}
.management {
display: block;
right: 5px;
width: 100px;
padding: 3px;
border: inset 3px;
margin: 10px;
}
.editButton, .deleteButton, .deleteConfirmButton, .deleteCancelButton {
display: inline;
font-size: 10px;
margin: 5px;
}
.deleteConfirm {
display: block;
font-size: 10px;
margin: 10px;
}
#settingsBackgroundFade, #infoBackgroundFade, #loadAfterDeleteFade,
#accountSettingsBackgroundFade, #fullScreenTextboxBackgroundFade {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #aaaaaa;
opacity: 0.75;
}
#settingsOptions, #infoPage, #loadAfterDeletePage,
#accountSettingsPage, #fullScreenTextboxPage {
position: fixed;
top: 6%;
left: 6%;
right: 6%;
bottom: 6%;
min-width: 260px;
min-height: 260px;
padding: 5px 5% 5%;
overflow-y: auto;
overflow-x: hidden;
background: #ffffff;
opacity: 1;
border-radius: 5px;
border: 1px solid black;
}
#announcementCloseButton, #notificationCloseButton,
#settingsButton, #settingsScreenCloseButton,
#settingsSaveButtons button, #infoScreenCloseButton,
#fullScreenTextboxScreenCloseButton {
float: right;
font-size: 12px;
}
#fullScreenTextboxPage {
padding: 5px 3% 4%;
overflow-y: hidden;
}
#fullScreenTextbox {
position: relative;
width: 100%;
height: 100%;
}
#settingsForm {
width: 100%;
padding: 0;
margin: 0;
}
#publicLink {
font-size:12px;
font-style: italic;
}
#dictionaryDescriptionEdit, #dictionaryPartsOfSpeechEdit {
width: 100%;
max-width: 360px;
min-width: 200px;
}
#dictionaryDescriptionEdit {
height: 200px;
}
#settingsErrorMessage {
float: right;
clear: both;
}
#settingsSaveButtons {
position: fixed;
right: 10%;
bottom: 8%;
font-size: 14px;
display: block;
width: 50%;
}
.settingsCol {
display: block;
float: left;
width: 30%;
min-width: 260px;
max-width: 400px;
margin: 0 30px 0 0;
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
footer {
position: relative;
clear: both;
max-height: 100%;
}
#dictionaryContainer {
margin-bottom: 15px !important;
}
#formLockButton {
display: none;
}
#showFullScreenTextbox {
display: none;
}
#settingsSaveButtons {
position: relative;
right: 0;
bottom: 0;
clear: both;
width: 100%;
}
}