Browse Source

some stuff item page

master
jules 4 years ago
parent
commit
3d76a038a1
  1. 15
      daapinterface.py
  2. 67
      static/css/style.css
  3. 4
      templates/item.html

15
daapinterface.py

@ -538,13 +538,8 @@ def artwork():
######################### ORGANISATION ######################### ITEM : COLLECTIVE - PERSON - ORGANISATION
######################### CONTRIBUTOR : PERSON - ORGANISATION
@app.route("/item", methods=['GET']) @app.route("/item", methods=['GET'])
def item(): def item():
item_id = request.args.get('id') item_id = request.args.get('id')
@ -884,10 +879,10 @@ def item():
######################### ORGANISATION ######################### ORGANISATION
@app.route("/organisation", methods=['GET']) # @app.route("/organisation", methods=['GET'])
def organisation(): # def organisation():
org_id = request.args.get('id') # org_id = request.args.get('id')
return render_template("organisation.html") # return render_template("organisation.html")
######################### #########################

67
static/css/style.css

@ -42,6 +42,9 @@ font-style: normal;
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital@0;1&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Roboto:ital@0;1&display=swap');
/*test bold font import*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
/***************** ALL RESPONSE TEXT ****************/ /***************** ALL RESPONSE TEXT ****************/
@ -50,53 +53,53 @@ font-style: normal;
/* 12 18 */ body, tbody tr th, .mw-parser-output ul, .mw-parser-output a, .artwork-intro, /* 12 18 */ body, tbody tr th, .mw-parser-output ul, .mw-parser-output a, .artwork-intro,
.date, div.artwork-relatedworks-date, div#header-keyword-search span, .metadata-link p { .date, div.artwork-relatedworks-date, div#header-keyword-search span, .metadata-link p {
font-size: calc(12px + 6 * (100vw - 320px) / 1600); font-size: calc(12px + 6 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 12 18 */ div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p, /* 12 18 */ div#footer-title-br p, div#footer-title-others p, div#footer-title-contact p,
div#footer-title-socials p, thead tr th, .artwork-nav-label, .label-item, .tns-item p:first-of-type { div#footer-title-socials p, thead tr th, .artwork-nav-label, .label-item, .tns-item p:first-of-type {
font-size: calc(12px + 6 * (100vw - 320px) / 1600); font-size: calc(12px + 6 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 12 18 line height diff */ div#footer-socials-links a, a#footer-img-br, a#footer-img-br figcaption, a#footer-img-br figcaption:hover, a#footer-img-br figcaption:visited, a#footer-img-wiki, a#footer-img-wiki figcaption, a#footer-img-wiki figcaption:hover, a#footer-img-wiki figcaption:visited { /* 12 18 line height diff */ div#footer-socials-links a, a#footer-img-br, a#footer-img-br figcaption, a#footer-img-br figcaption:hover, a#footer-img-br figcaption:visited, a#footer-img-wiki, a#footer-img-wiki figcaption, a#footer-img-wiki figcaption:hover, a#footer-img-wiki figcaption:visited {
font-size: calc(12px + 6 * (100vw - 320px) / 1600); font-size: calc(12px + 6 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 14 20 */ div#navigation a, .title, .metadata-link, .metadata-link a, .metadata-link a span, /* 14 20 */ div#navigation a, .title, .metadata-link, .metadata-link a, .metadata-link a span,
div.artwork-relatedworks-tile { div.artwork-relatedworks-tile {
font-size: calc(14px + 8 * (100vw - 320px) / 1600); font-size: calc(14px + 8 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 10 16 - line height 16 */ div#backend-data-button, div#container-backend-data-button, /* 10 16 - line height 16 */ div#backend-data-button, div#container-backend-data-button,
.primary-button, .secondary-button, .artwork-button, #home-top-div .primary-button a, .primary-button, .secondary-button, .artwork-button, #home-top-div .primary-button a,
#home-top-div .primary-button a:visited, #home-top-div .secondary-button a, #home-top-div .primary-button a:visited, #home-top-div .secondary-button a,
#home-top-div .secondary-button a:visited, div.browsebycategory-categories a { #home-top-div .secondary-button a:visited, div.browsebycategory-categories a {
font-size: calc(10px + 6 * (100vw - 320px) / 1600); font-size: calc(10px + 6 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 18 32 */ .mw-parser-output blockquote p { /* 18 32 */ .mw-parser-output blockquote p {
font-size: calc(18px + 12 * (100vw - 320px) / 1600); font-size: calc(18px + 12 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 40 22 */ .heading_A { /* 40 22 */ .heading_A {
font-size: calc(22px + 18 * (100vw - 320px) / 1600); font-size: calc(22px + 18 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 20 25 */ .mw-parser-output h1, .Heading_B, .artwork-title, div.pagetitle, /* 20 25 */ .mw-parser-output h1, .Heading_B, .artwork-title, div.pagetitle,
.mw-parser-output h1, div#header-title { .mw-parser-output h1, div#header-title {
font-size: calc(20px + 5 * (100vw - 320px) / 1600); font-size: calc(20px + 5 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 18 30 */ h2, .artbase-logo, .Heading_C, .mw-parser-output h2 { /* 18 30 */ h2, .artbase-logo, .Heading_C, .mw-parser-output h2 {
font-size: calc(18px + 12 * (100vw - 320px) / 1600); font-size: calc(18px + 12 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 20 25 */ h3, .Heading_D, .mw-parser-output h3 { /* 20 25 */ h3, .Heading_D, .mw-parser-output h3 {
font-size: calc(20px + 5 * (100vw - 320px) / 1600); font-size: calc(20px + 5 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
/* 14 20 */ .Heading_E { /* 14 20 */ .Heading_E {
font-size: calc(14px + 6 * (100vw - 320px) / 1600); font-size: calc(14px + 6 * (100vw - 320px) / 1600);
line-height: 1.2em; line-height: 1.4em;
} }
} }
@ -1668,13 +1671,15 @@ div.browsebycategory-categories:hover {
.des-exh-section .exh { .des-exh-section .exh {
border-top: 2px solid #000; border-top: 2px solid #000;
margin: 0px; margin: 0px;
padding: 20px 0 10px 0 !important; padding: 20px 0 0 0 !important;
} }
.des p, .exh p { p.des + p, p.exh + p {
padding-top: 20px; padding-top: 10px !important;
padding-bottom: 30px !important;
} }
.text-description { .text-description {
grid-column-start: 1; grid-column-start: 1;
grid-column-end: 8; grid-column-end: 8;
@ -1733,7 +1738,8 @@ div.browsebycategory-categories:hover {
align-self: center; align-self: center;
writing-mode: vertical-rl; writing-mode: vertical-rl;
transform: rotate(180deg); transform: rotate(180deg);
max-height: 120px; max-height: 160px;
padding-top: 0;
/* -webkit-transform: rotate(-90deg); /* -webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg); -moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg); -ms-transform: rotate(-90deg);
@ -1975,32 +1981,6 @@ div#tutorials-intro h3, div#tutorials-intro p {
@media screen and (min-width:0px) and (max-width: 768px) { @media screen and (min-width:0px) and (max-width: 768px) {
#message-mobile {
display: none;
position: fixed;
width: 100%;
top: 0;
left: 0;
width: 100%;
z-index: 10000;
height: 100%;
background-color: rgba(255, 255, 255, 0.96);
overflow-y: hidden;
}
#message-mobile p {
text-align: center;
font-family: Roboto Condensed;
font-size: 24px;
line-height: 1.58;
letter-spacing: 1.33px;
margin: 25vw 8vw;
}
#message-mobile ~ * {
overflow: hidden;
position: static;
}
.web-dev-placeholder { .web-dev-placeholder {
display: none; display: none;
padding: 0px 10px; padding: 0px 10px;
@ -2122,6 +2102,11 @@ div#tutorials-intro h3, div#tutorials-intro p {
width: 8.5vw; width: 8.5vw;
min-width: 32px; min-width: 32px;
margin-top: 10px; margin-top: 10px;
margin-right: 10px;
}
#header-keyword-search {
display: none;
} }
/********** MAIN **********/ /********** MAIN **********/

4
templates/item.html

@ -40,10 +40,10 @@
<!-- NAVIGATION HERE? --> <!-- NAVIGATION HERE? -->
<div class="artwork-nav"> <div class="artwork-nav">
<div class="artwork-nav-label artwork-nav-label-about active">ABOUT THIS WORK</div> <div class="artwork-nav-label artwork-nav-label-about active">ABOUT</div>
<!-- <div class="artwork-nav-label">RELATIONSHIPS</div> --> <!-- <div class="artwork-nav-label">RELATIONSHIPS</div> -->
<!-- <div class="artwork-nav-label">LISTS</div> --> <!-- <div class="artwork-nav-label">LISTS</div> -->
<div class="artwork-nav-label artwork-nav-label-record"><a class="det-record" target="_blank" href="https://daap.bannerrepeater.org/wiki/Item:{{ artwork_id }}">DETAILED RECORD</a></div> <div class="artwork-nav-label artwork-nav-label-record"><a class="det-record" target="_blank" href="https://daap.bannerrepeater.org/wiki/Item:{{ item_id }}">DETAILED RECORD</a></div>
</div> </div>
</div> </div>

Loading…
Cancel
Save