From 9e202ee524f7fd4657be343c2c020c8e5191180f Mon Sep 17 00:00:00 2001 From: Kristóf Marussy Date: Tue, 16 Apr 2024 21:00:37 +0200 Subject: docs: update landing page --- README.md | 4 +- subprojects/docs/src/components/Features/fi1.svg | 1 + .../docs/src/components/Features/fi1.svg.license | 4 + subprojects/docs/src/components/Features/fi2.svg | 1 + .../docs/src/components/Features/fi2.svg.license | 4 + subprojects/docs/src/components/Features/fi3.svg | 1 + .../docs/src/components/Features/fi3.svg.license | 4 + subprojects/docs/src/components/Features/fi4.svg | 1 + .../docs/src/components/Features/fi4.svg.license | 4 + subprojects/docs/src/components/Features/fi5.svg | 1 + .../docs/src/components/Features/fi5.svg.license | 4 + .../docs/src/components/Features/index.module.css | 126 ++++++++++++++++ subprojects/docs/src/components/Features/index.tsx | 114 ++++++++++++++ subprojects/docs/src/css/custom.css | 2 + subprojects/docs/src/css/sr-only.css | 22 +++ subprojects/docs/src/pages/index.module.css | 4 + subprojects/docs/src/pages/index.tsx | 166 ++++++++++++++++++++- 17 files changed, 460 insertions(+), 3 deletions(-) create mode 100644 subprojects/docs/src/components/Features/fi1.svg create mode 100644 subprojects/docs/src/components/Features/fi1.svg.license create mode 100644 subprojects/docs/src/components/Features/fi2.svg create mode 100644 subprojects/docs/src/components/Features/fi2.svg.license create mode 100644 subprojects/docs/src/components/Features/fi3.svg create mode 100644 subprojects/docs/src/components/Features/fi3.svg.license create mode 100644 subprojects/docs/src/components/Features/fi4.svg create mode 100644 subprojects/docs/src/components/Features/fi4.svg.license create mode 100644 subprojects/docs/src/components/Features/fi5.svg create mode 100644 subprojects/docs/src/components/Features/fi5.svg.license create mode 100644 subprojects/docs/src/components/Features/index.module.css create mode 100644 subprojects/docs/src/components/Features/index.tsx create mode 100644 subprojects/docs/src/css/sr-only.css diff --git a/README.md b/README.md index 1f9eccee..23574886 100644 --- a/README.md +++ b/README.md @@ -42,8 +42,8 @@ J. Object Technol. **19**(3): 3:1-22 (2020) [[doi](https://doi.org/10.5381/jot.2 ### Consitent graph generation techniques * O. Semeráth, A. Nagy, D. Varró: “A graph solver for the automated generation of consistent domain-specific models.” _ICSE 2018:_ 969-980 [[doi](https://doi.org/10.1145/3180155.3180186)] [[pdf](https://dl.acm.org/doi/pdf/10.1145/3180155.3180186)] -* K. Marussy, O. Semeráth, D. Varró: _Automated Generation of Consistent Graph Models With Multiplicity Reasoning._ IEEE Trans. Software Eng. **48**(5): 1610-1629 (2022) [[doi](https://doi.org/10.1109/TSE.2020.3025732)] [[pdf](https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=9201551)] -* A.. Babikian, O. Semeráth, A. Li, K. Marussy, D. Varró: _Automated generation of consistent models using qualitative abstractions and exploration strategies._ Softw. Syst. Model. **21**(5): 1763-1787 (2022) [[doi](https://doi.org/10.1007/s10270-021-00918-6)] [[pdf](https://link.springer.com/content/pdf/10.1007/s10270-021-00918-6.pdf?pdf=button)] +* K. Marussy, O. Semeráth, D. Varró: _Automated Generation of Consistent Graph Models With Multiplicity Reasoning._ IEEE Trans. Softw. Eng. **48**(5): 1610-1629 (2022) [[doi](https://doi.org/10.1109/TSE.2020.3025732)] [[pdf](https://ieeexplore.ieee.org/stamp/stamp.jsp?tp=&arnumber=9201551)] +* A. Babikian, O. Semeráth, A. Li, K. Marussy, D. Varró: _Automated generation of consistent models using qualitative abstractions and exploration strategies._ Softw. Syst. Model. **21**(5): 1763-1787 (2022) [[doi](https://doi.org/10.1007/s10270-021-00918-6)] [[pdf](https://link.springer.com/content/pdf/10.1007/s10270-021-00918-6.pdf?pdf=button)] ### Diverse and realistic graph generation diff --git a/subprojects/docs/src/components/Features/fi1.svg b/subprojects/docs/src/components/Features/fi1.svg new file mode 100644 index 00000000..0acaf3f0 --- /dev/null +++ b/subprojects/docs/src/components/Features/fi1.svg @@ -0,0 +1 @@ + diff --git a/subprojects/docs/src/components/Features/fi1.svg.license b/subprojects/docs/src/components/Features/fi1.svg.license new file mode 100644 index 00000000..15aca74d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi1.svg.license @@ -0,0 +1,4 @@ +SPDX-FileCopyrightText: 2024 The Refinery Authors + +SPDX-License-Identifier: EPL-2.0 + diff --git a/subprojects/docs/src/components/Features/fi2.svg b/subprojects/docs/src/components/Features/fi2.svg new file mode 100644 index 00000000..c1cba58d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi2.svg @@ -0,0 +1 @@ + diff --git a/subprojects/docs/src/components/Features/fi2.svg.license b/subprojects/docs/src/components/Features/fi2.svg.license new file mode 100644 index 00000000..15aca74d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi2.svg.license @@ -0,0 +1,4 @@ +SPDX-FileCopyrightText: 2024 The Refinery Authors + +SPDX-License-Identifier: EPL-2.0 + diff --git a/subprojects/docs/src/components/Features/fi3.svg b/subprojects/docs/src/components/Features/fi3.svg new file mode 100644 index 00000000..a901aa56 --- /dev/null +++ b/subprojects/docs/src/components/Features/fi3.svg @@ -0,0 +1 @@ + diff --git a/subprojects/docs/src/components/Features/fi3.svg.license b/subprojects/docs/src/components/Features/fi3.svg.license new file mode 100644 index 00000000..15aca74d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi3.svg.license @@ -0,0 +1,4 @@ +SPDX-FileCopyrightText: 2024 The Refinery Authors + +SPDX-License-Identifier: EPL-2.0 + diff --git a/subprojects/docs/src/components/Features/fi4.svg b/subprojects/docs/src/components/Features/fi4.svg new file mode 100644 index 00000000..b7ad5a1d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi4.svg @@ -0,0 +1 @@ + diff --git a/subprojects/docs/src/components/Features/fi4.svg.license b/subprojects/docs/src/components/Features/fi4.svg.license new file mode 100644 index 00000000..15aca74d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi4.svg.license @@ -0,0 +1,4 @@ +SPDX-FileCopyrightText: 2024 The Refinery Authors + +SPDX-License-Identifier: EPL-2.0 + diff --git a/subprojects/docs/src/components/Features/fi5.svg b/subprojects/docs/src/components/Features/fi5.svg new file mode 100644 index 00000000..65d61c3c --- /dev/null +++ b/subprojects/docs/src/components/Features/fi5.svg @@ -0,0 +1 @@ + diff --git a/subprojects/docs/src/components/Features/fi5.svg.license b/subprojects/docs/src/components/Features/fi5.svg.license new file mode 100644 index 00000000..15aca74d --- /dev/null +++ b/subprojects/docs/src/components/Features/fi5.svg.license @@ -0,0 +1,4 @@ +SPDX-FileCopyrightText: 2024 The Refinery Authors + +SPDX-License-Identifier: EPL-2.0 + diff --git a/subprojects/docs/src/components/Features/index.module.css b/subprojects/docs/src/components/Features/index.module.css new file mode 100644 index 00000000..aa136724 --- /dev/null +++ b/subprojects/docs/src/components/Features/index.module.css @@ -0,0 +1,126 @@ +/* + * SPDX-FileCopyrightText: 2024 The Refinery Authors + * + * SPDX-License-Identifier: EPL-2.0 + */ + +:global(.fibackground) { + fill: url(#fi-lg); +} + +:global(.fiforeground) { + fill: #303846; +} + +:global(.fiempty) { + fill: #fff; +} + +[data-theme='dark'] :global(.fiforeground) { + fill: #ebebff; +} + +[data-theme='dark'] :global(.fiempty) { + fill: var(--ifm-background-color); +} + +.lg { + position: absolute; + visibility: hidden; + top: 0; + left: 0; + width: 0; + height: 0; +} + +.lg__start { + stop-color: var(--ifm-color-primary-lighter); +} + +.lg__end { + stop-color: var(--ifm-color-primary); +} + +[data-theme='dark'] .lg__start { + stop-color: var(--ifm-color-primary-light); +} + +[data-theme='dark'] .lg__end { + stop-color: var(--ifm-color-primary-darker); +} + +.feature__container { + display: flex; + flex-direction: column; + container-type: inline-size; + justify-content: stretch; +} + +.feature { + display: flex; + flex-direction: column; + align-items: center; + margin-bottom: var(--ifm-leading); + gap: 1rem; +} + +.feature__icon { + display: flex; + width: 100%; + max-width: 220px; + height: auto; + aspect-ratio: 1/1; +} + +.feature__icon svg { + width: 100%; + height: 100%; +} + +.feature__contents { + display: flex; + flex-direction: column; + align-items: center; + gap: 1rem; +} + +.feature__title { + margin: 0; +} + +.feature__text { + margin: 0; + text-align: center; +} + +@container (min-width: 660px) { + .feature { + flex-direction: row; + } + + .feature--even { + flex-direction: row-reverse; + } + + .feature__icon { + flex-shrink: 0; + } + + .feature__contents { + align-items: flex-start; + } + + .feature--even .feature__contents { + align-items: flex-end; + } + + .feature__title, + .feature__text { + text-align: left; + } + + .feature--even .feature__title, + .feature--even .feature__text { + text-align: right; + } +} diff --git a/subprojects/docs/src/components/Features/index.tsx b/subprojects/docs/src/components/Features/index.tsx new file mode 100644 index 00000000..57012725 --- /dev/null +++ b/subprojects/docs/src/components/Features/index.tsx @@ -0,0 +1,114 @@ +/* + * SPDX-FileCopyrightText: 2024 The Refinery Authors + * + * SPDX-License-Identifier: EPL-2.0 + */ + +import clsx from 'clsx'; + +import Fi1 from './fi1.svg'; +import Fi2 from './fi2.svg'; +import Fi3 from './fi3.svg'; +import Fi4 from './fi4.svg'; +import Fi5 from './fi5.svg'; +import styles from './index.module.css'; + +function Feature({ + icon, + title, + offset, + even, + children, +}: { + icon: React.ReactNode; + title: string; + offset?: number; + even?: boolean; + children: React.ReactNode; +}) { + return ( +
+
+
{icon}
+
+

{title}

+

{children}

+
+
+
+ ); +} + +Feature.defaultProps = { + offset: undefined, + even: false, +}; + +export default function Features() { + return ( +
+ + + + + + + + +

Features

+
+ } title="Diverse graph generation"> + Refinery provides a framework for the automated generation of graphs. + + } title="Model with uncertainty" even> + Partial modeling allows us to explicitly represent unknown or + uncertain knowledge in our models. The Refinery framework enables us + to explore design alternatives systematically. + + } title="Formal logic reasoning"> + Refinery combines the mathematical precision of formal logic + structures with the expressiveness of graph-based models. Underlying + solver algorithms ensure formal correctness and completeness of + generation processes. + +
+
+ } + title="Advanced web-based editor" + offset={2} + even + > + Designers are supported with state-of-the-art web-based editors with + advanced IDE features and visualization techniques. The framework can + be applied as a simple command-line interface program or deployed on + the cloud. + + } title="Powerful graph algorithms"> + Refinery is equipped with powerful algorithms such as incremental + query evaluation, efficient graph isomorphism checking, and + version-controlled data structures to solve various modeling and graph + processing problems. + +
+
+ ); +} diff --git a/subprojects/docs/src/css/custom.css b/subprojects/docs/src/css/custom.css index 8646ba5f..a359649b 100644 --- a/subprojects/docs/src/css/custom.css +++ b/subprojects/docs/src/css/custom.css @@ -9,6 +9,8 @@ @import '@fontsource-variable/jetbrains-mono/wght.css'; @import '@fontsource-variable/jetbrains-mono/wght-italic.css'; +@import './sr-only.css'; + :root { --ifm-font-family-base: 'Open Sans Variable', 'Open Sans', diff --git a/subprojects/docs/src/css/sr-only.css b/subprojects/docs/src/css/sr-only.css new file mode 100644 index 00000000..dbd65fd3 --- /dev/null +++ b/subprojects/docs/src/css/sr-only.css @@ -0,0 +1,22 @@ +/* + * Copyright (c) 2010–2021 Kitty Giraudel + * + * SPDX-License-Identifier: MIT + * + * This snippet was copied from + * https://kittygiraudel.com/snippets/sr-only-class/ + */ + +.sr-only { + border: 0 !important; + clip: rect(1px, 1px, 1px, 1px) !important; + -webkit-clip-path: inset(50%) !important; + clip-path: inset(50%) !important; + height: 1px !important; + overflow: hidden !important; + margin: -1px !important; + padding: 0 !important; + position: absolute !important; + width: 1px !important; + white-space: nowrap !important; +} diff --git a/subprojects/docs/src/pages/index.module.css b/subprojects/docs/src/pages/index.module.css index 533e8db1..572e5eef 100644 --- a/subprojects/docs/src/pages/index.module.css +++ b/subprojects/docs/src/pages/index.module.css @@ -26,6 +26,10 @@ } } +.section__title { + text-align: center; +} + .section--video { background: var(--ifm-background-surface-color); } diff --git a/subprojects/docs/src/pages/index.tsx b/subprojects/docs/src/pages/index.tsx index 713223c2..7caf5727 100644 --- a/subprojects/docs/src/pages/index.tsx +++ b/subprojects/docs/src/pages/index.tsx @@ -5,7 +5,6 @@ */ import Link from '@docusaurus/Link'; -// import PlayCircle from 'vg'; import Layout from '@theme/Layout'; import clsx from 'clsx'; import { useState } from 'react'; @@ -13,6 +12,8 @@ import { useState } from 'react'; import styles from './index.module.css'; import videoCover from './video-cover.webp?url'; +import Features from '@site/src/components/Features'; + function Hero() { return (
@@ -65,6 +66,7 @@ function Video() { const [started, setStarted] = useState(false); return (
+

Check out the intro video

{started ? ( @@ -106,11 +108,173 @@ function Video() { ); } +function Publication({ + doi, + pdf, + video, + children, +}: { + doi?: string; + pdf?: string; + video?: string; + children?: React.ReactNode; +}) { + return ( +
  • + {children} + {doi && ( + <> + {' '} + [doi] + + )} + {pdf && ( + <> + {' '} + [pdf] + + )} + {video && ( + <> + {' '} + [video] + + )} +
    • + ); +} + +Publication.defaultProps = { + doi: undefined, + pdf: undefined, + video: undefined, + children: undefined, +}; + +function Publications() { + return ( +
    +
    +

    Related publications

    +
    +
    +

    Tool demonstration

    +
      + + K. Marussy, A. Ficsor, O. Semeráth, D. Varró: “Refinery: + Graph Solver as a Service”{' '} + ICSE 2024 Demonstrations + +
    +

    Partial model specification language

    +
      + + K. Marussy, O. Semeráth, A. Babikian, D. Varró:{' '} + + A Specification Language for Consistent Model Generation based + on Partial Models. + {' '} + J. Object Technol. 19(3): 3:1-22 (2020) + +
    +

    Diverse and realistic graph generation

    +
      + + O. Semeráth, R. Farkas, G. Bergmann, D. Varró:{' '} + + Diversity of graph models and graph generators in mutation + testing. + {' '} + Int. J. Softw. Tools Technol. Transf. 22(1): 57-78 (2020) + + + O. Semeráth, A. Babikian, B. Chen, C. Li, K. Marussy, G. + Szárnyas, D. Varró:{' '} + + Automated generation of consistent, diverse and structurally + realistic graph models. + {' '} + Softw. Syst. Model. 20(5): 1713-1734 (2021) + +
    +
    +
    +

    Consistent graph generation techniques

    +
      + + O. Semeráth, A. Nagy, D. Varró: “A graph solver for the + automated generation of consistent domain-specific + models.” ICSE 2018: 969-980 + + + K. Marussy, O. Semeráth, D. Varró:{' '} + + Automated Generation of Consistent Graph Models With + Multiplicity Reasoning. + {' '} + IEEE Trans. Softw. Eng. 48(5): 1610-1629 (2022) + + + A. Babikian, O. Semeráth, A. Li, K. Marussy, D. Varró:{' '} + + Automated generation of consistent models using qualitative + abstractions and exploration strategies. + {' '} + Softw. Syst. Model. 21(5): 1763-1787 (2022) + +
    +

    Correctness proofs

    +
      + + D. Varró, O. Semeráth, G. Szárnyas, Á. Horváth: “Towards + the Automated Generation of Consistent, Diverse, Scalable and + Realistic Graph Models.”{' '} + Graph Transformation, Specifications, and Nets 2018: + 285-312 + +
    +
    +
    +
    +
    + ); +} + export default function Home() { return ( +
    + +
    ); } -- cgit v1.2.3-54-g00ecf