Skip to content

Commit

Permalink
Merge branch 'main' into feat/Tapis-v3-redesign
Browse files Browse the repository at this point in the history
  • Loading branch information
jarosenb authored May 6, 2024
2 parents c08bb58 + 77b5464 commit 820d67b
Show file tree
Hide file tree
Showing 6 changed files with 182 additions and 131 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,15 @@ <h3 class="c-app-card__title"><i class="ds-icon ds-icon-{{app.icon}}"></i> {{app

<p class="c-app-card__desc">{{app.description}}</p>

{% if app.tags|length > 0 %}
<ul class="c-app-card__types">
{% for tag in app.tags %}
<li>{{tag}}</li>
{% endfor %}
</ul>
{% else %}
<!-- No tags -->
{% endif %}

<ul class="c-app-card__flags">
{% if app.is_popular %}
Expand Down
149 changes: 27 additions & 122 deletions designsafe/static/styles/DesignSafe-Icons.css
Original file line number Diff line number Diff line change
@@ -1,125 +1,30 @@
@font-face {
font-family: 'DesignSafe-Icons';
src: url('/static/fonts/DesignSafe-Icons.eot?nvbv6c');
src: url('/static/fonts/DesignSafe-Icons.eot?nvbv6c#iefix') format('embedded-opentype'),
url('/static/fonts/DesignSafe-Icons.ttf?nvbv6c') format('truetype'),
url('/static/fonts/DesignSafe-Icons.woff2') format('woff2'),
url('/static/fonts/DesignSafe-Icons.woff?nvbv6c') format('woff'),
url('/static/fonts/DesignSafe-Icons.svg?nvbv6c#DesignSafe-Icons') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}

[class^='ds-icon-'],
[class*=' ds-icon-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'DesignSafe-Icons' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
@import url('./DesignSafe-Icons.font.css');

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* TODO: Consider isolating and importing main.css & main-ef.css .ds-icon's */

.ds-icon-Contract:before {
content: '\e91d';
}
.ds-icon-Expand:before {
content: '\e923';
}
.ds-icon-Job-Status:before {
content: '\e929';
}
.ds-icon-All-Hazards:before {
content: '\e908';
}
.ds-icon-New-Tab:before {
content: '\ea7e';
}
.ds-icon-NGL-without-text:before {
content: '\e903';
}
.ds-icon-Potree:before {
content: '\e906';
}
.ds-icon-Generic-Vis:before {
content: '\e907';
}
.ds-icon-HVSR:before {
content: '\e90d';
}
.ds-icon-MPM:before {
content: '\e90e';
}
.ds-icon-Generic-App:before {
content: '\e960';
}
.ds-icon-GiD:before {
content: '\e90f';
}
.ds-icon-Earth:before {
content: '\e910';
}
.ds-icon-Water:before {
content: '\e912';
}
.ds-icon-Wind:before {
content: '\e915';
}
.ds-icon-rWHALE:before {
content: '\e905';
}
.ds-icon-Extract:before {
content: '\e959';
}
.ds-icon-Hazmapper:before {
content: '\e904';
}
.ds-icon-Compress:before {
content: '\e958';
}
.ds-icon-STKO:before {
content: '\e91c';
}
.ds-icon-OpenFOAM:before {
content: '\e900';
}
.ds-icon-Blender:before {
content: '\e901';
}
.ds-icon-MATLAB:before {
content: '\e902';
}
.ds-icon-Paraview:before {
content: '\e911';
}
.ds-icon-Jupyter:before {
content: '\e913';
}
.ds-icon-QGIS:before {
content: '\e914';
}
.ds-icon-OpenSees:before {
content: '\e916';
}
.ds-icon-LS-DYNA:before {
content: '\e917';
}
.ds-icon-Dakota:before {
content: '\e918';
}
.ds-icon-Clawpack:before {
content: '\e919';
}
.ds-icon-Ansys:before {
content: '\e91a';
}
.ds-icon-SWBatch:before {
content: '\e91b';
/* To globally adjust sizes of specific font icons */
.ds-icon-All-Hazards::before,
.ds-icon-Earth::before,
.ds-icon-Water::before,
.ds-icon-Wind::before,
.ds-icon-OpenSees::before {
display: block;
}
.ds-icon-All-Hazards::before,
.ds-icon-Earth::before,
.ds-icon-Water::before,
.ds-icon-Wind::before {
font-size: 1.2em;
/* To restore alignment after font-size changes it */
margin-top: -0.15em; /* FAQ: -0.2em did not re-align it perfectly */
}
.ds-icon-OpenSees::before {
font-size: 1.5em;
/* To restore alignment after font-size changes it */
margin-top: -0.3em; /* FAQ: -0.2em did not re-align it perfectly */
}
.ds-icon-All-Hazards::before,
.ds-icon-OpenSees::before {
/* To move icon down */
translate: 0 0.25em;
}
125 changes: 125 additions & 0 deletions designsafe/static/styles/DesignSafe-Icons.font.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,125 @@
@font-face {
font-family: 'DesignSafe-Icons';
src: url('/static/fonts/DesignSafe-Icons.eot?nvbv6c');
src: url('/static/fonts/DesignSafe-Icons.eot?nvbv6c#iefix') format('embedded-opentype'),
url('/static/fonts/DesignSafe-Icons.ttf?nvbv6c') format('truetype'),
url('/static/fonts/DesignSafe-Icons.woff2') format('woff2'),
url('/static/fonts/DesignSafe-Icons.woff?nvbv6c') format('woff'),
url('/static/fonts/DesignSafe-Icons.svg?nvbv6c#DesignSafe-Icons') format('svg');
font-weight: normal;
font-style: normal;
font-display: block;
}

[class^='ds-icon-'],
[class*=' ds-icon-'] {
/* use !important to prevent issues with browser extensions that change fonts */
font-family: 'DesignSafe-Icons' !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;

/* Better Font Rendering =========== */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}

.ds-icon-Contract:before {
content: '\e91d';
}
.ds-icon-Expand:before {
content: '\e923';
}
.ds-icon-Job-Status:before {
content: '\e929';
}
.ds-icon-All-Hazards:before {
content: '\e908';
}
.ds-icon-New-Tab:before {
content: '\ea7e';
}
.ds-icon-NGL-without-text:before {
content: '\e903';
}
.ds-icon-Potree:before {
content: '\e906';
}
.ds-icon-Generic-Vis:before {
content: '\e907';
}
.ds-icon-HVSR:before {
content: '\e90d';
}
.ds-icon-MPM:before {
content: '\e90e';
}
.ds-icon-Generic-App:before {
content: '\e960';
}
.ds-icon-GiD:before {
content: '\e90f';
}
.ds-icon-Earth:before {
content: '\e910';
}
.ds-icon-Water:before {
content: '\e912';
}
.ds-icon-Wind:before {
content: '\e915';
}
.ds-icon-rWHALE:before {
content: '\e905';
}
.ds-icon-Extract:before {
content: '\e959';
}
.ds-icon-Hazmapper:before {
content: '\e904';
}
.ds-icon-Compress:before {
content: '\e958';
}
.ds-icon-STKO:before {
content: '\e91c';
}
.ds-icon-OpenFOAM:before {
content: '\e900';
}
.ds-icon-Blender:before {
content: '\e901';
}
.ds-icon-MATLAB:before {
content: '\e902';
}
.ds-icon-Paraview:before {
content: '\e911';
}
.ds-icon-Jupyter:before {
content: '\e913';
}
.ds-icon-QGIS:before {
content: '\e914';
}
.ds-icon-OpenSees:before {
content: '\e916';
}
.ds-icon-LS-DYNA:before {
content: '\e917';
}
.ds-icon-Dakota:before {
content: '\e918';
}
.ds-icon-Clawpack:before {
content: '\e919';
}
.ds-icon-Ansys:before {
content: '\e91a';
}
.ds-icon-SWBatch:before {
content: '\e91b';
}
25 changes: 20 additions & 5 deletions designsafe/static/styles/app-card.css
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,16 @@

/* Title */
.c-app-card__title {
margin-top: 1em;
margin-bottom: 0;
margin-block: 1em 0;
padding-inline: 1rem;
}
.c-app-card__title > .icon::before {
font-size: unset; /* to undo 5vw from ng-designsafe.css */
.c-app-card__title > .ds-icon {
width: unset; /* overwrite .ds-icon from main.css */
height: unset; /* overwrite .ds-icon from main.css */

/* To add space between icon and text */
/* FAQ: Using `rem` cuz some icons are globally resized via `em` */
margin-right: 0.5rem;
}

/* Description */
Expand Down Expand Up @@ -53,14 +58,24 @@
box-shadow: 3px 2px 2px #00000029;
}
.c-app-card:hover {
outline: 2px solid #0000FF;
outline: 2px solid var(--ds-active-color);
outline-offset: calc( var(--border-width) * -1 );
box-shadow: none;
}
.c-app-card:hover,
.c-app-card:focus {
color: inherit;
text-decoration: none;
}
a.c-app-card:active {
outline-width: 1px;
}

/* Title */
.c-app-card:hover .c-app-card__title {
color: var(--ds-active-color);
}

/* Description */
.c-app-card__desc {
line-height: 1.8;
Expand Down
7 changes: 4 additions & 3 deletions designsafe/static/styles/app-page.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@
@import url("./app-grid.css");
@import url("./app-version-list.css");

/* To make width of page content line up with width of header. */
/* TODO: Verify whether this is safe to put into `main.css` */
.s-app-page > .container-fluid {
/* To make width of page content line up with width of header */
.s-app-page > .container-fluid /* FAQ: To support Style wrapper (as fallback) */,
.s-app-page main > .container-fluid {
/* HELP: Is this safe to replace the .container-fluid margin in main.css? */
margin: 0 50px;
}

Expand Down
3 changes: 2 additions & 1 deletion designsafe/static/styles/main.css
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
:root {
--ds-accent-color: #47a59d;
--ds-active-color: #337AB7;
}

body, html {
Expand Down Expand Up @@ -977,4 +978,4 @@ li .popover.right {
.reg-left-col {
padding-right:75px;
}
}
}

0 comments on commit 820d67b

Please sign in to comment.