Skip to content

Commit

Permalink
Merge pull request #1107 from ecds/ui-reader
Browse files Browse the repository at this point in the history 
UI reader
  • Loading branch information
@yl5682
yl5682 authored Oct 29, 2024
2 parents e735964 + dfc216d commit 03d791b
Show file tree
Hide file tree
Showing 14 changed files with 238 additions and 209 deletions.
2 changes: 1 addition & 1 deletion apps/static/css/_components/uk-switch.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@

/* Slider active color */
input:checked+.uk-switch-slider {
background-color: $rx-color-accent-1 !important;
background-color: #1D3557 !important;
}

/* Pointer active animation */
Expand Down
97 changes: 40 additions & 57 deletions apps/static/css/project.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,9 +38,9 @@ em {
filter: contrast(var(--contrast));
}

.uk-button-default {
font-size: 1.25rem;
}
// .uk-button-default {
// font-size: 1.25rem;
// }

#search-form .uk-button-danger {
background-color: #f0506e;
Expand Down Expand Up @@ -835,13 +835,14 @@ p {
font-family: 'Consolas', 'Monaco', 'Andale Mono', 'Ubuntu Mono', 'monospace' !important;

&:active {
background-color: $rx-color-accent-2 !important;
border: 1px solid $rx-color-accent-2 !important;
background-color: #1D3557 !important;
border: 1px solid #1D3557 !important;
opacity: 1;
}

&:hover {
background: var(--link-color);
background: #1D3557;
border-color: #1D3557;
color: white !important;
font-size: 0.75rem;
letter-spacing: 0.1rem;
Expand All @@ -851,7 +852,8 @@ p {
}

.rx-action-btn:hover .rx-label-copy {
background: var(--link-color);
background: #1D3557;
border-color: #1D3557;
color: white !important;
font-size: 0.75rem;
letter-spacing: 0.1rem;
Expand All @@ -860,9 +862,9 @@ p {
}

.rx-label-solid {
background: var(--link-color);
background: #1D3557;
color: white;
border: var(--link-color) 1px solid;
border: #1D3557 1px solid;
font-size: 0.75rem;
letter-spacing: 0.1rem;
opacity: 0.75;
Expand All @@ -871,13 +873,14 @@ p {
font-weight: 600;

&:active {
background-color: $rx-color-accent-2 !important;
border: 1px solid $rx-color-accent-2 !important;
background-color: darken(#1D3557, 5%) !important;
border: 1px solid darken(#1D3557, 5%) !important;
opacity: 1;
}

&:hover {
background: var(--link-color);
background: #1D3557;
border-color: #1D3557;
color: white !important;
font-size: 0.75rem;
letter-spacing: 0.1rem;
Expand Down Expand Up @@ -1361,26 +1364,6 @@ fieldset {
}
}

// properly indent bullet items in the breadcrumb
.uk-navbar li {
text-indent: -1em !important; /* Negative indent to pull first line back */
padding-left: 1em !important; /* Padding to offset the negative indent */

// &::marker {
// content: "↳ "; /* Custom bullet symbol */
// position: absolute;
// left: 0;
// }
}

.uk-navbar li:first-child {
// &::marker {
// content: ""; /* Custom bullet symbol */
// position: absolute;
// left: 0;
// }
}

.long-and-truncated.rx-volume-title {
display: flex;
align-items: center;
Expand Down Expand Up @@ -1671,20 +1654,20 @@ fieldset {
color: white;
}

&:active {
background-color: $rx-color-accent-2 !important;
border: 1px solid $rx-color-accent-2 !important;
opacity: 1;
}
// &:active {
// background-color: $rx-color-accent-2 !important;
// border: 1px solid $rx-color-accent-2 !important;
// opacity: 1;
// }

&:hover {
background: var(--link-color);
color: white !important;
font-size: 0.85rem;
letter-spacing: 0.1rem;
cursor: pointer;
opacity: 1;
}
// &:hover {
// background: var(--link-color);
// color: white !important;
// font-size: 0.85rem;
// letter-spacing: 0.1rem;
// cursor: pointer;
// opacity: 1;
// }
}

.rx-accordion-handle {
Expand Down Expand Up @@ -1742,9 +1725,9 @@ a.nav-link {
filter: contrast(var(--contrast));
}

.uk-button-default {
font-size: 1.25rem;
}
// .uk-button-default {
// font-size: 1.25rem;
// }

.uk-tab > .uk-active > a {
border-color: var(--link-color) !important;
Expand Down Expand Up @@ -1792,9 +1775,9 @@ a.nav-link {
bottom: 0px;
/* background: none !important; */

height: -webkit-calc(100% - 40px);
height: -moz-calc(100% - 40px);
height: calc(100% - 40px);
height: -webkit-calc(100% - 36px);
height: -moz-calc(100% - 36px);
height: calc(100% - 36px);
width: 100%;
/* Remove any browser-default margins. */
margin: 0;
Expand Down Expand Up @@ -3614,26 +3597,26 @@ ol#search-results dl {

/* Override the minus sign in UI Kit accordion */
.uk-open > .uk-accordion-title::before {
/* "-" Change the stroke color of the accordion icons to white */
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23950953%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E);
/* "-" Change the stroke color of the accordion icons to #1D3557 */
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E);
}

.uk-open > .uk-accordion-title:hover {
/* "-" Change the stroke color of the accordion icons to white */
/* "-" Change the stroke color of the accordion icons to #1D3557 */
&::before {
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E)
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E)
}
}

.uk-accordion-title::before {
/* "+" Change the stroke color of the accordion icons to white */
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23950953%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23950953%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E);
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E);
}

.uk-accordion-title:hover {
/* "+" Change the stroke color of the accordion icons to white */
&::before {
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E);
background-image: url(data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22%231D3557%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E);
}
}

Expand Down
11 changes: 6 additions & 5 deletions apps/static/css/readux2/collection.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,11 +38,12 @@
justify-content: center;
transition: background-color 0.3s ease;
}
.uk-button-default {
background-color: #222; /* Removed gradient background */
border: none;
color: white;
}

// .uk-button-default {
// background-color: #222; /* Removed gradient background */
// border: none;
// color: white;
// }

.modal-bg {
background-size: cover;
Expand Down
3 changes: 3 additions & 0 deletions apps/static/css/readux2/login.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,4 +64,7 @@
.sign-in-btn {
background-color: #1D3557;
color: #F1FAEE;
&:hover {
background-color: darken(#1D3557, 10%);
}
}
7 changes: 5 additions & 2 deletions apps/static/css/readux2/main.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -624,7 +624,6 @@ iframe {
color: white;
}


.description-button {
transition: ease 0.1s;
&:hover {
Expand All @@ -637,4 +636,8 @@ iframe {

.justify-content-normal {
justify-content: normal !important;
}
}

.unset-min-height {
min-height: unset !important;
}
44 changes: 44 additions & 0 deletions apps/static/css/readux2/reader.scss
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
.reader-navbar {
padding: 0 1rem; height: 36px;
}

.rx-accordion-head {
background-color: #F1FAEE;
color: #1D3557;
border: none;
&:hover {
color: #1D3557 !important;
background-color: darken(#F1FAEE, 5%) !important;
border: none;
.rx-accordion-head::before {
color: #1D3557 !important;
}
}
&:active {
border: none;
}
}

.rx-accordion-head::before {
color: #1D3557 !important;
}

.rx-anchor {
color: #1D3557 !important;
}

.rx-btn {
&:hover {
background-color: #1D3557 !important;
border-color: #1D3557 !important;
}
}

.uk-tab > .uk-active > a {
border-color: #1D3557 !important;
color: #1D3557 !important;
}

.uk-search-default .uk-search-input:focus, .uk-input:focus, .uk-select:focus, .uk-textarea:focus {
border-color: #1D3557;
}
6 changes: 0 additions & 6 deletions apps/static/css/readux2/search.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -229,12 +229,6 @@ ol#search-results dl {
background-color: #1D3557 !important;
}

#reset-filters {
&:hover {
background-color: darken(#EFEFEF, 10%);
}
}

.uk-search-default .uk-search-input:focus, .uk-input:focus, .uk-select:focus, .uk-textarea:focus {
border-color: #1D3557;
}
Expand Down
10 changes: 5 additions & 5 deletions apps/static/js/vue-readux.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -182,7 +182,7 @@ Vue.component("v-volume-annotations", {
<div class="uk-accordion-content rx-accordion-content">
<li v-for="annotation in annotationData" :key="annotation.canvas__pid" >
<div v-if="annotation.canvas__position__count">
<a :href="annotation.canvas__pid"><span class="uk-label rx-label-copy rx-fixed-width-100">Canvas {{ annotation.canvas__position }}</span></a> ‧ {{annotation.canvas__position__count}} annotations
<a :href="annotation.canvas__pid"><span class="rx-btn rx-fixed-width-100">Canvas {{ annotation.canvas__position }}</span></a> ‧ {{annotation.canvas__position__count}} annotations
</div>
</li>
</div>
Expand Down Expand Up @@ -244,7 +244,7 @@ Vue.component("v-info-content-url-single", {
<div class="rx-info-content-label uk-flex-between rx-flex">
<span>{{label}}</span>
<div>
<span class="uk-label rx-label-copy"
<span class="rx-btn"
v-clipboard:copy="url"
v-clipboard:success="onCopy"
v-clipboard:error="onError">Copy</span>
Expand Down Expand Up @@ -273,7 +273,7 @@ Vue.component("v-info-content-url-unit", {
<a v-bind:href="url" class="rx-anchor"
target="_blank">{{url}}</a>
<div>
<span class="uk-label rx-label-copy"
<span class="rx-btn"
v-clipboard:copy="url"
v-clipboard:success="onCopy"
v-clipboard:error="onError">Copy</span>
Expand Down Expand Up @@ -317,7 +317,7 @@ Vue.component("v-info-content-url-external", {
<div class="rx-info-content-label uk-flex-between rx-flex ">
<span>{{label}}</span>
<div>
<span class="uk-label rx-label-copy"
<span class="rx-btn"
v-clipboard:copy="localUrl"
v-clipboard:success="onCopy"
v-clipboard:error="onError">Copy</span>
Expand Down Expand Up @@ -368,7 +368,7 @@ Vue.component("v-info-content-url-image-link", {
<div class="rx-info-content-label uk-flex-between rx-flex ">
<span v-if="localUrls !== undefined">{{label}}</span>
<div>
<span class="uk-label rx-label-copy"
<span class="rx-btn"
v-clipboard:copy="localUrls"
v-clipboard:success="onCopy"
v-clipboard:error="onError" v-if="localUrls !== undefined">Copy</span>
Expand Down
Loading

0 comments on commit 03d791b

Please sign in to comment.