Cian-H/invenio-theme-iform
1
0
Fork 0
mirror of https://github.com/Cian-H/invenio-theme-iform.git synced 2025-12-23 05:01:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

modification: add theming variables (#152)

Browse Source
This commit is contained in:
rekt-hard
2021-03-01 18:33:47 +01:00
committed by GitHub
parent ee94d72b65
commit 2b60954fe4
13 changed files with 147 additions and 94 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
invenio_theme_tugraz/assets/scss/invenio_theme_tugraz/variables.scss
View File

@@ -8,4 +8,3 @@
$navbar_background_image: unset; $navbar_background_image: unset;
$navbar_background_color: #ffffff; $navbar_background_color: #ffffff;

46
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/accounts.less
View File

@@ -13,68 +13,68 @@
#login-tug-logo { #login-tug-logo {
& g { & g {
fill: #e4154b; fill: @tugrazRed;
} }
} }
#login-tug-logo:hover { #login-tug-logo:hover {
& g { & g {
fill: #231f20; fill: @tugrazBlack;
} }
} }
.accounts-link { .accounts-link {
margin: 5%; margin: 5%;
color: #fff; color: @primaryLink;
border: 1px solid #fff; border: 1px solid @primaryLink;
background-color: transparent; background-color: transparent;
} }
.accounts-link :hover { .accounts-link :hover {
font-size: smaller !important; font-size: smaller !important;
color: white; color: @primaryLink;
background-color: #000000 !important; background-color: @primaryLinkHoverBackground !important;
} }
.tu-button-style button { .tu-button-style button {
cursor: pointer; cursor: pointer;
border: 1px solid #fff; border: 1px solid @primaryButton;
background-color: transparent; background-color: transparent;
height: 29px; height: 29px;
color: #fff; color: @primaryButton;
font-family: "Source Sans Pro"; font-family: "Source Sans Pro";
font-weight: 300; font-weight: 300;
font-size: 16px; font-size: 16px;
} }
.tu-button-style button:hover { .tu-button-style button:hover {
cursor: pointer; cursor: pointer;
color: white; color: @primaryButton;
background-color: #000000 !important; background-color: @primaryButtonHoverBackground !important;
} }
.form-accounts { .form-accounts {
margin: 15%; margin: 15%;
text-align: left !important; text-align: left !important;
& i { & i {
color: #fff !important; color: @primaryFormAccounts !important;
} }
& label { & label {
display: flex !important; display: flex !important;
font-weight: 300 !important; font-weight: 300 !important;
color: white !important; color: @primaryFormAccounts !important;
} }
& input { & input {
border: 0px none !important; border: 0px none !important;
padding: 0px !important; padding: 0px !important;
border-bottom: 1px solid white !important; border-bottom: 1px solid @primaryFormAccounts !important;
background-color: transparent !important; background-color: transparent !important;
color: white !important; color: @primaryFormAccounts !important;
border-radius: 0 !important; border-radius: 0 !important;
width: 100% !important; width: 100% !important;
} }
& input::placeholder { & input::placeholder {
opacity: 1 !important; opacity: 1 !important;
color: silver !important; color: @formAccountsInputPlaceholder !important;
} }
& th { & th {
display: block; display: block;
@@ -85,7 +85,7 @@
} }
.field > input::selection { .field > input::selection {
background: #50a2ce; background: @fieldInputSelectionBackground;
} }
.accounts-header { .accounts-header {
@@ -96,7 +96,7 @@
login and sign-up pages form background color login and sign-up pages form background color
*/ */
.sign-form { .sign-form {
background-color: #245b78 !important; background-color: @signInBackground !important;
padding: 0 !important; padding: 0 !important;
height: 100%; height: 100%;
} }
@@ -104,10 +104,10 @@ login and sign-up pages form background color
.tug-button-login { .tug-button-login {
display: flex; display: flex;
align-items: center; align-items: center;
fill: #e4154b; fill: @tugrazRed;
} }
.tug-button-login :hover { .tug-button-login :hover {
fill: #000000; fill: @primaryButtonHoverBackground;
} }
.login-page-button { .login-page-button {
margin: 5%; margin: 5%;
@@ -118,20 +118,20 @@ login and sign-up pages form background color
cursor: pointer; cursor: pointer;
} }
& a:hover { & a:hover {
background-color: #000; background-color: @primaryLinkHoverBackground;
color: #fff !important; color: @primaryLink !important;
text-decoration: none; text-decoration: none;
} }
} }
.login-page-button-white { .login-page-button-white {
color: #fff !important; color: @primaryButton !important;
font-family: "Source Sans Pro"; font-family: "Source Sans Pro";
font-size: initial; font-size: initial;
} }
.login-page-button-black { .login-page-button-black {
color: #000 !important; color: @primaryButtonInverted !important;
font-family: "Source Sans Pro"; font-family: "Source Sans Pro";
font-size: initial; font-size: initial;
} }

10
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/footer.less
View File

@@ -7,7 +7,7 @@
*/ */
#footer { #footer {
color: #5E5E5E; color: @footerGrey;
/*background-image: url("/static/images/footer.jpg");*/ /*background-image: url("/static/images/footer.jpg");*/
-webkit-background-size: 100% 100%; -webkit-background-size: 100% 100%;
@@ -22,18 +22,18 @@
background-attachment: fixed; background-attachment: fixed;
&.footer-bottom { &.footer-bottom {
background-color: #f2f2f2; background-color: @footerBottomBackground;
padding-top: 15px; padding-top: 15px;
padding-bottom: 15px; padding-bottom: 15px;
font-size: 16px; font-size: 16px;
a { a {
text-decoration: none; text-decoration: none;
color: #5E5E5E; color: @footerGrey;
&:hover, &:focus { &:hover, &:focus {
color: #ffffff; color: @primaryLink;
background-color: #000000; background-color: @primaryLinkHoverBackground;
} }
} }
} }

6
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/frontpage.less
View File

@@ -22,12 +22,12 @@ h2 {
} }
.record-version { .record-version {
color: #777777; color: @greyDark;
background-color: #f2f2f2 !important; background-color: @recordVersionBackground !important;
} }
.random-records-frontpage article { .random-records-frontpage article {
border-bottom: 1px solid rgba(34,36,38,.15); border-bottom: 1px solid @randomRecordsFrontpageArticle;
margin-bottom: 1rem; margin-bottom: 1rem;
padding-bottom: 1rem; padding-bottom: 1rem;
} }

42
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/header.less
View File

@@ -10,7 +10,7 @@
width: 18px; width: 18px;
height: 18px; height: 18px;
vertical-align: top; vertical-align: top;
fill: #e4154b; fill: @tugrazRed;
} }
/*****logo section******/ /*****logo section******/
@@ -18,18 +18,18 @@
vertical-align: middle; vertical-align: middle;
white-space: nowrap; white-space: nowrap;
& a { & a {
fill: #e4154b; fill: @tugrazRed;
} }
} }
.affiliation-logo :hover { .affiliation-logo :hover {
text-decoration: none; text-decoration: none;
fill: #000000; fill: @primaryLinkHoverBackground;
color: #000000; color: @primaryLinkHoverBackground;
} }
.affiliation { .affiliation {
background-color: white; background-color: @primaryLink;
display: table; display: table;
margin: 0 auto 80px; margin: 0 auto 80px;
max-width: 1060px; max-width: 1060px;
@@ -78,12 +78,12 @@ a {
.short-menu-right { .short-menu-right {
display: table-cell; display: table-cell;
width: 50%; width: 50%;
color: #000000; color: @primaryLinkInverted;
} }
.short-menu-right :hover { .short-menu-right :hover {
background-color: #000000; background-color: @primaryLinkHoverBackground;
color: #ffffff; color: @primaryLink;
} }
.short-menu-right-button { .short-menu-right-button {
@@ -104,15 +104,15 @@ a {
& a { & a {
padding: 5px; padding: 5px;
background-color: transparent; background-color: transparent;
color: #000; color: @primaryLinkInverted;
text-decoration: none; text-decoration: none;
} }
} }
.short-menu-left-lang:hover { .short-menu-left-lang:hover {
& a { & a {
background-color: #000; background-color: @primaryLinkHoverBackground;
color: #fff; color: @primaryLink;
text-decoration: none; text-decoration: none;
} }
} }
@@ -126,7 +126,7 @@ a {
& svg { & svg {
& g { & g {
stroke-linejoin: round; stroke-linejoin: round;
stroke: #000; stroke: @primaryLinkInverted;
stroke-miterlimit: 10; stroke-miterlimit: 10;
stroke-width: 2; stroke-width: 2;
fill: none; fill: none;
@@ -137,11 +137,11 @@ a {
.search-icon-header:hover { .search-icon-header:hover {
& a { & a {
background-color: #000; background-color: @primaryLinkHoverBackground;
text-decoration: none; text-decoration: none;
& svg { & svg {
& g { & g {
stroke: #fff; stroke: @primaryLink;
} }
} }
} }
@@ -150,7 +150,7 @@ a {
.short-menu-left-search { .short-menu-left-search {
display: inline-block; display: inline-block;
margin: 12px 9px 6px 0; margin: 12px 9px 6px 0;
color: #000000; color: @primaryLinkInverted;
} }
.short-menu-right-main-menu { .short-menu-right-main-menu {
@@ -181,8 +181,8 @@ svg:not(:root) {
} }
.main-menu-entry a:hover { .main-menu-entry a:hover {
background-color: #000; background-color: @primaryLinkHoverBackground;
color: #fff; color: @primaryLink;
text-decoration: none; text-decoration: none;
} }
@@ -191,7 +191,7 @@ svg:not(:root) {
} }
.main-menu-underline-line { .main-menu-underline-line {
border: 2px solid #e0e1e2 !important; border: 2px solid @greyLight !important;
border-radius: 0; border-radius: 0;
} }
@@ -200,13 +200,13 @@ svg:not(:root) {
} }
.affiliation-text a:hover { .affiliation-text a:hover {
background-color: #000000; background-color: @primaryLinkHoverBackground;
color: #ffffff; color: @primaryLink;
text-decoration: none; text-decoration: none;
} }
.main-menu { .main-menu {
border-bottom: 1px solid #000; border-bottom: 1px solid @primaryLinkInverted;
box-sizing: border-box; box-sizing: border-box;
height: 39px; height: 39px;
margin-top: -1px; margin-top: -1px;

8
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/login.less
View File

@@ -1,5 +1,5 @@
.ui.inverted.header{ .ui.inverted.header{
color:#000; color: @primaryLinkInverted;
} }
.login-page-button { .login-page-button {
@@ -10,14 +10,14 @@
cursor: pointer; cursor: pointer;
} }
& a:hover { & a:hover {
background-color: #000; background-color: @primaryLinkHoverBackground;
color: #fff !important; color: @primaryLink !important;
text-decoration: none; text-decoration: none;
} }
} }
.text-color{ .text-color{
color: #000; color: @primaryLinkInverted;
} }
@media (max-width: 767px) { @media (max-width: 767px) {

2
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/macros.less
View File

@@ -14,5 +14,5 @@
} }
.text-muted { .text-muted {
color: #777; color: @greyDark;
} }

44
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/overrides.less
View File

@@ -12,7 +12,7 @@
* to #ffffff * to #ffffff
***/ ***/
.section-content-light-bg { .section-content-light-bg {
background-color: #ffffff; background-color: @primaryBackground;
} }
/*** /***
@@ -21,7 +21,7 @@
* to #000000 * to #000000
***/ ***/
.section-title { .section-title {
color: #000000; color: @primaryText;
} }
@@ -32,7 +32,7 @@
***/ ***/
.cover-page { .cover-page {
//text-align: center; //text-align: center;
background-color: #ffffff; background-color: @primaryBackground;
} }
@@ -42,7 +42,7 @@
* To #000000 * To #000000
***/ ***/
.panel-free-title { .panel-free-title {
color: #000000; color: @primaryText;
} }
@@ -75,16 +75,16 @@ pre {
***/ ***/
/*.ui.button,*/ /*.ui.button,*/
.ui.search.button { .ui.search.button {
background-color:#e4154b; background-color: @tugrazRed;
} }
.ui.button:hover, .ui.button:hover,
.ui.search.button:hover { .ui.search.button:hover {
background-color:#000000; background-color: @primaryButtonHoverBackground;
} }
.ui.button:hover { .ui.button:hover {
color:#fff; color: @primaryButton;
} }
/*** /***
@@ -123,3 +123,33 @@ pre {
.ui.label { .ui.label {
font-weight: 400; font-weight: 400;
} }
.ui.label.access-right {
float: right;
color: @accessRight;
background-color: white;
&.open {
color: @accessRightOpen;
background-color: white;
}
&.restricted {
color: @accessRightRestricted;
background-color: white;
}
&.embargoed {
color: @accessRightEmbargoed;
background-color: white;
}
&.closed {
color: @accessRightClosed;
background-color: white;
}
}

7
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/record.less
View File

@@ -5,11 +5,6 @@
* it under the terms of the MIT License; see LICENSE file for more details. * it under the terms of the MIT License; see LICENSE file for more details.
*/ */
.access-right {
color: #e9711c;
float: right;
}
.title .dropdown { .title .dropdown {
display: none; display: none;
} }
@@ -21,6 +16,6 @@
.label.label-keyword { .label.label-keyword {
font-size: 0.71428571rem; font-size: 0.71428571rem;
font-weight: 400; font-weight: 400;
background-color: #E8E8E8; background-color: @labelKeywordBackground;
border: unset; border: unset;
} }

19
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/search.less
View File

@@ -14,7 +14,7 @@
} }
.creator:not(:last-child):after { .creator:not(:last-child):after {
color: #777; color: @greyDark;
content: ';'; content: ';';
} }
@@ -26,20 +26,3 @@
.identifiers { .identifiers {
display: inline; display: inline;
} }
.ui.access-right {
color: #FFFFFF;
&.open {
color: @accessRightOpen;
}
&.restricted {
color: @accessRightRestricted;
}
&.embargoed {
color: @accessRightEmbargoed;
}
&.closed {
color: @accessRightClosed;
}
}

47
invenio_theme_tugraz/assets/semantic-ui/less/invenio_theme_tugraz/variables.less
View File

@@ -12,11 +12,56 @@
***/ ***/
//@import "../invenio_app_rdm/variables.less"; //@import "../invenio_app_rdm/variables.less";
//@navbar_background_image: unset; //@navbar_background_image: unset;
//@navbar_background_color: #ffffff; //@navbar_background_color: #ffffff;
// badge colors, accessibility
@accessRight : #e9711c;
@accessRightOpen : #e9711c; @accessRightOpen : #e9711c;
@accessRightRestricted: #fbbd08; @accessRightRestricted: #fbbd08;
@accessRightEmbargoed : #db2828; @accessRightEmbargoed : #db2828;
@accessRightClosed : #db2828; @accessRightClosed : #db2828;
// primary colors TU Graz
@tugrazBlack: #231f20;
@tugrazRed : #e4154b;
// accent colors
@greyDark : #777;
@greyLight : #E0E1E2;
@labelKeywordBackground: #E8E8E8;
// link and button colors
@primaryLinkInverted : #000;
@primaryLinkBackgroundInverted: #fff;
@primaryLink : #fff;
@primaryLinkHoverBackground : #000;
@primaryButton : #fff;
@primaryButtonHoverBackground : #000;
@primaryButtonInverted : #000f;
// general
@primaryBackground: #fff;
@primaryText : #000;
//account (signin, signup) specific
@primaryFormAccounts : #fff;
@formAccountsInputPlaceholder : silver;
@fieldInputSelectionBackground: #50a2ce;
@signInBackground : #245b78;
// footer specific
@footerGrey : #5E5E5E;
@footerBottomBackground: #f2f2f2;
// record specific
@recordVersionBackground : #f2f2f2;
@randomRecordsFrontpageArticle: rgba(34, 36, 38, .15);

1
invenio_theme_tugraz/templates/invenio_theme_tugraz/index.html
View File

@@ -93,6 +93,7 @@
</small> </small>
</div> </div>
</div> </div>
<!--Disabled on feb-relase - enable when stable--> <!--Disabled on feb-relase - enable when stable-->
<!-- <div class="right floated column"> <!-- <div class="right floated column">
<span class="access-right"> <span class="access-right">

2
invenio_theme_tugraz/templates/invenio_theme_tugraz/record_landing_page.html
View File

@@ -56,7 +56,7 @@
</div> </div>
<div class="right floated column"> <div class="right floated column">
<span class="access-right"> <span class="ui label access-right">
<i class="icon lock open"></i> <i class="icon lock open"></i>
{{ record.access.access_right | make_dict_like('access_right') | vocabulary_title('access_right') }} {{ record.access.access_right | make_dict_like('access_right') | vocabulary_title('access_right') }}
{%- for right in record.metadata.rights %} {%- for right in record.metadata.rights %}