html: break out most CSS into separate file

The quantity of CSS has grown a lot and bundling in every request
doesn't seem like the correct thing any more.

1 files changed, 231 insertions, 0 deletions

diff --git a/fatcat_scholar/static/scholar.css b/fatcat_scholar/static/scholar.css
new file mode 100644
index 0000000..5f63e6c
--- /dev/null
+++ b/fatcat_scholar/static/scholar.css
@@ -0,0 +1,231 @@
+a {
+    /* accessibility/contrast */
+    color: #28629c;
+}
+.ui.basic.blue.label {
+    color: #28629c!important;
+    border-color: #28629c!important;
+}
+.ui.basic.orange.label {
+    color: #c54e00!important;
+    border-color: #c54e00!important;
+}
+.ui.card .meta, .ui.cards>.card .meta {
+    color: rgba(0,0,0,0.55);
+}
+
+/* bnewbold: fix light grey bars in header, and "rounded" header */
+nav.ui.inverted.menu .item:before { background: none; }
+nav.ui.menu { border-radius: 0; }
+
+.ui.button.serp-button {
+    border-radius: 0;
+    margin-bottom: 0.4em;
+    text-align: left;
+}
+
+.ui.blue.button.serp-button {
+    background-color: #6b6ebb;
+}
+
+.ui.labeled.icon.button.serp-button {
+    padding-left: 3.0em!important;
+    padding-right: 1em!important;
+    width: 14em;
+    box-shadow: 1px 1px 2px 1px rgba(0, 0, 0, 0.3);
+}
+
+.ui.labeled.icon.button.serp-button .menu.fulltext-thumbnail {
+    left: calc(-100% + 0.3em);
+    margin-top: -2.4em;
+    background-color: black;
+    min-width: 186px;
+    border: 3px solid black;
+    border-bottom: 0;
+    box-shadow: none;
+}
+
+.ui.labeled.icon.button.serp-button .menu.fulltext-thumbnail:after {
+    z-index: -1;
+    background-color: black;
+}
+
+.action-bar {
+    display: flex;
+    justify-content: center;
+    column-gap: 0.3em;
+    min-width: 14em;
+    max-width: 15em;
+}
+
+@media only screen and (max-width: 767px) {
+    .mobile-hide { display: none !important; }
+    .ui.items>.item>.image:not(.ui) { width: auto };
+}
+@media only screen and (min-width: 768px) {
+    .mobile-only { display: none !important; }
+}
+@media only screen and (max-width: 991px) {
+    .tablet-hide { display: none !important; }
+    .ui.items>.item>.image:not(.ui) { width: auto };
+    .ui.grid>[class*="fourteen wide"].column.serp-column {
+    width: 100% !important;
+    box-shadow: none !important;
+    }
+}
+@media only screen and (min-width: 992px) {
+    .tablet-only { display: none !important; }
+}
+@media only screen and (min-width: 1200px) {
+    .ui.container {
+    font-size: 16px;
+    line-height: 20px;
+    }
+    div.fulltext-link {
+    width: 180px;
+    }
+    div.biblio-record {
+    padding-left: 1.1em;
+    }
+}
+
+.ui.serp.card {
+    max-width: 180px;
+    margin-bottom: 0.2em;
+    border-radius: 0;
+}
+.hit-count {
+    font-weight: bold;
+    line-height: 1.28571429em;
+}
+
+.biblio-record .biblio-title {
+    margin-bottom: 0.1em;
+    font-size: 1.2em;
+    font-weight: bold;
+    line-height: 1.2em;
+}
+.biblio-record .biblio-title a {
+    color: #2224c7;
+}
+.biblio-record .release-type {
+    text-transform: uppercase;
+    font-weight: bold;
+}
+.biblio-record .original-title {
+    font-style: italic;
+    font-weight: normal;
+}
+.biblio-record .author-row {
+    margin-top: 0;
+    margin-bottom: 0.2em;
+    font-size: 1.1em;
+}
+.biblio-record .release-stage {
+    color: brown;
+    font-weight: bold;
+    text-transform: uppercase;
+}
+.biblio-record details > summary {
+    list-style-type: none;
+    color: #28629c;
+    text-decoration: underline;
+    margin-left: 0.3em;
+}
+.biblio-record details > summary::-webkit-details-marker {
+    display: none;
+}
+
+/* for fulltext search result highlighting */
+.search_highlights em {
+    {# yellow #}
+    {# background-color: #FFFFBB; #}
+    font-style: normal;
+    font-weight: bold;
+}
+
+.search_filters summary::marker {
+    display: none;
+}
+.search_filters summary::-webkit-details-marker {
+    display: none;
+}
+
+footer p a {
+    color: rgba(255, 255, 255, 0.5);
+}
+footer p a:hover {
+    color: rgba(255, 255, 255, 1.0);
+    opacity: 1.0;
+}
+
+.ui.label.small {
+    border-radius: 0;
+}
+
+a:hover .ui.card {
+    opacity: 0.75;
+}
+
+.text-button {
+    border: none;
+    background-color: inherit;
+    padding: 0;
+    font-family: inherit;
+    cursor: pointer;
+    display: inline-block;
+}
+
+details.access-options summary {
+    text-decoration: none;
+    color: inherit;
+}
+details.access-options .menu {
+    margin: 0.5em;
+    margin-top: 1.5em;
+    width: auto;
+}
+details.access-options .meta {
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-decoration: underline;
+}
+
+details.serp-action-menu[open] > summary .ui.basic.button {
+    box-shadow: 0 0 0 1px rgba(0,0,0,.15) inset, 0 1px 4px 0 rgba(34,36,38,.15) inset;
+    background: #f8f8f8!important;
+}
+details.serp-action-menu > summary {
+    list-style: none;
+}
+details.serp-action-menu > summary::-webkit-details-marker {
+    display: none;
+}
+details.serp-action-menu > .citation-menu {
+    min-width: 50em;
+    height: auto;
+    position: absolute;
+    display: block;
+    background: #fff;
+    box-shadow: 0 2px 3px 0 rgba(34,36,38,.15);
+    border: 1px solid rgba(34,36,38,.15);
+    z-index: 11;
+    min-width: 30em;
+    border-radius: .28571429rem;
+    right: 50%;
+    margin-top: -2em;
+    margin-right: 1.5em;
+    padding: 1em;
+}
+@media only screen and (max-width: 767px) {
+    details.serp-action-menu > .citation-menu {
+        overflow-x: scroll;
+        width: calc(100vw - 3em);
+        height: auto;
+        min-width: 0;
+        left: 0.5em;
+        margin-top: 0em;
+    }
+}