footnotes/css/settings.css

/**
 * Created by Stefan Herndler.
 * User: Stefan
 * Created-Date: 15.05.14
 * Created-Time: 16:21
 * Since: 1.0
 *
 * Version: 2.3.0
 *
 * Last modified: 2020-12-31T1026+0100
 */


/************************************************************
MCI Footnotes logo

The classes with 'heading' fix display in dashboard
See class/config.php and css/public.css
*/

 .postbox-header {
    position: relative;
    padding: 0 20px;
}
.footnotes_logo_heading {
    display: inline-block;
    float: left;
    position: absolute;
}
.footnotes_logo_part1_heading {
    left: 20px;
}
.footnotes_logo_part2_heading {
    left: 51px;
}
.footnotes_heart_heading {
    color:#ff6d3b;
    font-weight:bold;
    position: absolute;
    left: 96px;
}

/************************************************************
Input fields

On User Request:
Limited to a number of IDs to not affect all dashboards
<https://wordpress.org/support/topic/all-input-have-width-80/>
*/
/*input[type=text], input[type=password], textarea, select*/
#footnote_inputfield_readon_label,
#footnote_inputfield_references_label,
#footnote_inputfield_love {
    padding-left: 8px !important;
    padding-right: 8px !important;
    width: 80% !important;
}

#footnote_inputfield_reference_container_place {
    width: 310px;
}

#footnote_inputfield_counter_style,
#footnotes_inputfield_page_layout_support {
    width: 505px;
}

#footnote_inputfield_placeholder_start,
#footnote_inputfield_placeholder_end,
#footnote_inputfield_custom_mouse_over_box_excerpt_length {
    width: 180px;
}
#footnote_inputfield_placeholder_start_user_defined,
#footnote_inputfield_placeholder_end_user_defined {
    width: 320px;
}

#footnote_inputfield_combine_identical,
#footnotes_inputfield_scroll_offset,
#footnotes_inputfield_scroll_duration,
#footnote_inputfield_custom_mouse_over_box_excerpt_enabled,
#footnote_inputfield_custom_mouse_over_box_offset_x,
#footnote_inputfield_custom_mouse_over_box_offset_y,
#footnote_inputfield_custom_mouse_over_box_max_width,
#footnotes_inputfield_alternative_mouse_over_box_offset_x,
#footnotes_inputfield_alternative_mouse_over_box_offset_y,
#footnotes_inputfield_alternative_mouse_over_box_width,
#footnotes_inputfield_mouse_over_box_fade_in_delay,
#footnotes_inputfield_mouse_over_box_fade_in_duration,
#footnotes_inputfield_mouse_over_box_fade_out_delay,
#footnotes_inputfield_mouse_over_box_fade_out_duration,
#footnote_inputfield_custom_mouse_over_box_border_width,
#footnote_inputfield_custom_mouse_over_box_border_radius {
    width: 80px;
}

#footnote_inputfield_custom_hyperlink_symbol,
#footnotes_inputfield_backlinks_terminator_option,
#footnotes_inputfield_backlinks_separator_option {
    width: 230px;
}

#footnotes_inputfield_reference_container_top_margin,
#footnotes_inputfield_reference_container_bottom_margin,
#footnotes_inputfield_backlinks_column_width_scalar,
#footnotes_inputfield_backlinks_column_max_width_scalar,
#footnotes_inputfield_mouse_over_box_font_size_scalar {
    width: 85px;
}

#footnotes_inputfield_backlinks_column_width_unit,
#footnotes_inputfield_backlinks_column_max_width_unit,
#footnotes_inputfield_mouse_over_box_font_size_unit {
    width: 140px;
}

/************************************************************
Headings and labels
*/

label {
    display: inline-block;
}

.postbox > h3 {
    height: 32px !important;
    line-height: 32px !important;
}

.postbox > h3 > span {
    padding: 0 10px;
}

.postbox > .inside > table {
    border: none !important;
}

.postbox > .inside >table > tbody > tr > td:first-child {
    width: 15% !important;
    font-weight: bold !important;
}

.footnote_placeholder_box_container {
    text-align: center !important;
}

span.footnote_highlight_placeholder {
    font-weight: bold !important;
    padding: 0 8px !important;
}

.footnote_placeholder_box_example {
    border: 2px solid #2bb975 !important;
    border-radius: 4px !important;
    padding: 16px 0 !important;
    width: 50% !important;
    display: block !important;
    margin: 20px auto !important;
    text-align: center !important;
}

/************************************************************
Special table layout

Hooks and priority levels:
initialized from style attributes in templates
IE doesn’t support nth child, but these are not critical
*/
#expert_lookup tr th:first-child,
#expert_lookup tr td:first-child {
    width: 170px !important;
}
#expert_lookup tr th:nth-child(2),
#expert_lookup tr td:nth-child(2) {
    width: 65px !important;
}
#expert_lookup tr th:nth-child(3),
#expert_lookup tr td:nth-child(3) {
    width: 200px !important;
}
#expert_lookup tr td:nth-child(3) input {
    width: 190px;
}
#expert_lookup tr th:last-child,
#expert_lookup tr td:last-child {
    white-space: nowrap;
}

/*
Custom CSS

Localized notices are dropped to ease translators’ task.
16 CSS classes are listed directly in the template
templates/dashboard/customize-css.html

</p> end tags are omitted per HTML5 standard, to improve
maintainability and readability of the source list.
<https://stackoverflow.com/questions/8460993/p-end-tag-p-is-not-needed-in-html>

The textarea has monospace font, but no other features 
helping edit CSS, as tab support and syntactic colors.
*/
#customize_css_new tr td:first-child {
    width: 44% !important;
    font-weight: normal !important;
}
#customize_css_new tr td:first-child span:first-child {
    font-weight: bold !important;
}
#customize_css_new .list {
    padding-top: 10px;
}
#customize_css_new .list p {
    font-family: monospace;
    padding: 0 10px;
    text-indent: -10px;
    margin: .5em 0;
}

#footnote_inputfield_custom_css_new {
    height: 500px;
}
#footnote_inputfield_custom_css,
#footnote_inputfield_custom_css_new {
    width: 90%;
    resize: both;
    overflow: scroll;
    font-family: monospace;
}

/************************************************************
Notices

These spans were previously formatted using the em element.
But the intended semantics was not emphasis.
In locales using boldface to emphasize, the effect is the
exact opposite of the intention.

So we must use spans with explicit italic font style.
Scripts not featuring italic fonts fall back to normal,
and that is just fine, as italic is only needed here for
scripts that do have italic, and failing to use it would
look weird.

since 2.1.4
*/
.footnotes_notice {
    font-style: italic;
    display: inline-block;
    text-align: end;
}

/************************************************************
Descriptions

padded div above or below a settings table

Use case: more extensive information not fitting into a brief
notice after the end of the settings box.
*/
.footnotes_description {
    padding: 0 6%;
}
.footnotes_description p {
    font-size: 1.2em;
    font-style: italic;
}