Merge dev into main (#2)
Reviewed-on: https://gitpot.dev/sangelo/explorecraft-testing/pulls/2
4
.prettierrc
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"tabWidth": 2,
|
||||||
|
"useTabs": false
|
||||||
|
}
|
|
@ -4,7 +4,7 @@
|
||||||
|
|
||||||
/* Write your global styles here, in SCSS syntax. Variables and mixins from the src/variables.scss file are available here without importing */
|
/* Write your global styles here, in SCSS syntax. Variables and mixins from the src/variables.scss file are available here without importing */
|
||||||
|
|
||||||
body {
|
h1, h2, h3, h4, h5, h6, body {
|
||||||
font-family: 'IBM Plex Mono', monospace;
|
font-family: 'IBM Plex Mono', monospace;
|
||||||
// background-color: #ffffff;
|
// background-color: #ffffff;
|
||||||
// color: #000000;
|
// color: #000000;
|
||||||
|
@ -48,6 +48,11 @@ body {
|
||||||
--switch-checked-background-color: var(--primary);
|
--switch-checked-background-color: var(--primary);
|
||||||
}
|
}
|
||||||
|
|
||||||
p {
|
p, li {
|
||||||
cursor: text;
|
cursor: text;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
article {
|
||||||
|
border-radius: 10px;
|
||||||
|
box-shadow: 0px 0px 15px rgba(32, 32, 32, 0.2);
|
||||||
|
}
|
1
src/lib/modules/Modal.svelte
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<!-- WIP -->
|
67
src/lib/modules/MsgBox.svelte
Normal file
|
@ -0,0 +1,67 @@
|
||||||
|
<script>
|
||||||
|
import { onMount } from 'svelte';
|
||||||
|
|
||||||
|
export let type, message, prefix;
|
||||||
|
|
||||||
|
const colors = {
|
||||||
|
info: ['rgba(0, 123, 255, 0.2)', '#004690', '#007bff', '#b7d7ff'],
|
||||||
|
warning: ['rgba(255, 193, 7, 0.2)', '#644c03', '#ffc107', '#ffd067'],
|
||||||
|
error: ['rgba(220, 53, 69, 0.2)', '#691a22', '#dc3545', '#ff818d'],
|
||||||
|
default: ['rgba(0, 0, 0, 0.1)', '#333', '#929292', '#d3d3d3']
|
||||||
|
};
|
||||||
|
|
||||||
|
let [backgroundColor, fontColor, borderColor, darkFontColor] = colors[type] || colors.default;
|
||||||
|
prefix = prefix || (type === 'info' ? 'Info:' : type === 'warning' ? 'Warning:' : type === 'error' ? 'Error:' : '');
|
||||||
|
|
||||||
|
let bgStyle = `background-color: ${backgroundColor}; color: ${fontColor}; border-color: ${borderColor}`;
|
||||||
|
|
||||||
|
const changeColorScheme = (event) => {
|
||||||
|
fontColor = event.matches ? darkFontColor : colors[type][1];
|
||||||
|
bgStyle = `background-color: ${backgroundColor}; color: ${fontColor}; border-color: ${borderColor}`;
|
||||||
|
};
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
|
||||||
|
mediaQuery.addEventListener('change', changeColorScheme);
|
||||||
|
changeColorScheme(mediaQuery);
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div class="msg-box {type}" style="{bgStyle}">
|
||||||
|
<p>
|
||||||
|
{#if prefix}<b>{prefix}</b>{/if}
|
||||||
|
{@html message}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.msg-box {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 1em;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-weight: normal;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
text-align: center;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.msg-box p {
|
||||||
|
margin: 0;
|
||||||
|
line-height: 1.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.msg-box.bright {
|
||||||
|
background-color: var(--backgroundColor);
|
||||||
|
color: var(--fontColor);
|
||||||
|
border-color: var(--borderColor);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (prefers-color-scheme: dark) {
|
||||||
|
.msg-box.bright {
|
||||||
|
color: var(--darkFontColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
16
src/routes/+error.svelte
Normal file
|
@ -0,0 +1,16 @@
|
||||||
|
<script>
|
||||||
|
import { page } from '$app/stores';
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<h1>
|
||||||
|
{$page.status} | {$page.error.message}
|
||||||
|
</h1>
|
||||||
|
<p>Looks like you're lost in space. Try flying back to earth!</p>
|
||||||
|
<a href="/" role="button" class="link">Fly back to Earth</a>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.link {
|
||||||
|
height: auto;
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -1,8 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import "../app.scss";
|
import "../app.scss";
|
||||||
import Header from "./Header.svelte";
|
import Header from "./Header.svelte";
|
||||||
// import gitpot from "$lib/assets/logo/gitpot_icon.svg"
|
|
||||||
import "./styles.css";
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="app">
|
<div class="app">
|
||||||
|
|
|
@ -1,7 +1,15 @@
|
||||||
<script>
|
<script>
|
||||||
import Counter from './Counter.svelte';
|
import { onMount } from 'svelte';
|
||||||
import welcome from '$lib/images/svelte-welcome.webp';
|
|
||||||
import welcome_fallback from '$lib/images/svelte-welcome.png';
|
function rand(min, max) {
|
||||||
|
return Math.floor(Math.random() * (max - min + 1) + min)
|
||||||
|
}
|
||||||
|
|
||||||
|
onMount(() => {
|
||||||
|
document.getElementById('banner').src = document.getElementById('banner').src.replace("pic0", `pic${rand(1,14)}`);
|
||||||
|
console.log(document.getElementById('banner').src);
|
||||||
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<svelte:head>
|
<svelte:head>
|
||||||
|
@ -11,54 +19,33 @@
|
||||||
|
|
||||||
<div class="text-column">
|
<div class="text-column">
|
||||||
<h1>ExploreCraft</h1>
|
<h1>ExploreCraft</h1>
|
||||||
<p>Welcome to the ExploreCraft website!</p>
|
<p>
|
||||||
|
This is ExploreCraft! A modpack for Minecraft 1.19.2 (Quilt) designed to keep you moving.<br>
|
||||||
|
You may never know what you'll find, after all
|
||||||
|
</p>
|
||||||
|
<p>Have a look around. You can download the modpack and play, have a look in our gallery, or take a look at our modlist.</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="grid buttons">
|
||||||
|
<a href="/downloads" role="button">Download</a>
|
||||||
|
<a href="/modlist" role="button" class="secondary outline">Modlist</a>
|
||||||
|
</div>
|
||||||
|
<!-- svelte-ignore a11y-img-redundant-alt -->
|
||||||
|
<a href="/gallery" class="banner" data-tooltip="See more..."><img src="assets/images/gallery/pic0.png" id="banner" alt="Random picture from the gallery."></a>
|
||||||
|
|
||||||
<!-- <section>
|
<style>
|
||||||
<h1>
|
a.banner img {
|
||||||
<span class="welcome">
|
border-radius: 1em;
|
||||||
<picture>
|
transition: all 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
|
||||||
<source srcset={welcome} type="image/webp" />
|
align-self: center;
|
||||||
<img src={welcome_fallback} alt="Welcome" />
|
|
||||||
</picture>
|
|
||||||
</span>
|
|
||||||
|
|
||||||
to your new<br />SvelteKit app
|
|
||||||
</h1>
|
|
||||||
|
|
||||||
<h2>
|
|
||||||
try editing <strong>src/routes/+page.svelte</strong>
|
|
||||||
</h2>
|
|
||||||
|
|
||||||
<Counter />
|
|
||||||
</section> -->
|
|
||||||
|
|
||||||
<!-- <style>
|
|
||||||
section {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex: 0.6;
|
|
||||||
}
|
}
|
||||||
|
a.banner img:hover {
|
||||||
h1 {
|
transform: scale(1.005);
|
||||||
width: 100%;
|
box-shadow: 0px 0px 16px rgba(32, 32, 32, 0.4);
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.buttons {
|
||||||
.welcome {
|
margin-left: 25%;
|
||||||
display: block;
|
margin-right: 25%;
|
||||||
position: relative;
|
margin-bottom: 2em;
|
||||||
width: 100%;
|
|
||||||
height: 0;
|
|
||||||
padding: 0 0 calc(100% * 495 / 2048) 0;
|
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
.welcome img {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
top: 0;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
</style> -->
|
|
|
@ -1,102 +0,0 @@
|
||||||
<script>
|
|
||||||
import { spring } from 'svelte/motion';
|
|
||||||
|
|
||||||
let count = 0;
|
|
||||||
|
|
||||||
const displayed_count = spring();
|
|
||||||
$: displayed_count.set(count);
|
|
||||||
$: offset = modulo($displayed_count, 1);
|
|
||||||
|
|
||||||
function modulo(n, m) {
|
|
||||||
// handle negative numbers
|
|
||||||
return ((n % m) + m) % m;
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<div class="counter">
|
|
||||||
<button on:click={() => (count -= 1)} aria-label="Decrease the counter by one">
|
|
||||||
<svg aria-hidden="true" viewBox="0 0 1 1">
|
|
||||||
<path d="M0,0.5 L1,0.5" />
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<div class="counter-viewport">
|
|
||||||
<div class="counter-digits" style="transform: translate(0, {100 * offset}%)">
|
|
||||||
<strong class="hidden" aria-hidden="true">{Math.floor($displayed_count + 1)}</strong>
|
|
||||||
<strong>{Math.floor($displayed_count)}</strong>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<button on:click={() => (count += 1)} aria-label="Increase the counter by one">
|
|
||||||
<svg aria-hidden="true" viewBox="0 0 1 1">
|
|
||||||
<path d="M0,0.5 L1,0.5 M0.5,0 L0.5,1" />
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.counter {
|
|
||||||
display: flex;
|
|
||||||
border-top: 1px solid rgba(0, 0, 0, 0.1);
|
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
|
||||||
margin: 1rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.counter button {
|
|
||||||
width: 2em;
|
|
||||||
padding: 0;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
border: 0;
|
|
||||||
background-color: transparent;
|
|
||||||
touch-action: manipulation;
|
|
||||||
font-size: 2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.counter button:hover {
|
|
||||||
background-color: var(--color-bg-1);
|
|
||||||
}
|
|
||||||
|
|
||||||
svg {
|
|
||||||
width: 25%;
|
|
||||||
height: 25%;
|
|
||||||
}
|
|
||||||
|
|
||||||
path {
|
|
||||||
vector-effect: non-scaling-stroke;
|
|
||||||
stroke-width: 2px;
|
|
||||||
stroke: #444;
|
|
||||||
}
|
|
||||||
|
|
||||||
.counter-viewport {
|
|
||||||
width: 8em;
|
|
||||||
height: 4em;
|
|
||||||
overflow: hidden;
|
|
||||||
text-align: center;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.counter-viewport strong {
|
|
||||||
position: absolute;
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
font-weight: 400;
|
|
||||||
color: var(--color-theme-1);
|
|
||||||
font-size: 4rem;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.counter-digits {
|
|
||||||
position: absolute;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hidden {
|
|
||||||
top: -100%;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
</style>
|
|
|
@ -1,27 +1,25 @@
|
||||||
<script>
|
<script>
|
||||||
import { page } from '$app/stores';
|
import { page } from '$app/stores';
|
||||||
import logo from '$lib/assets/logo/explorecraft.svg';
|
|
||||||
import github from '$lib/images/github.svg';
|
|
||||||
import Switcher from './Switcher.svelte';
|
import Switcher from './Switcher.svelte';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="header-container">
|
<div class="header-container">
|
||||||
<a class="link contrast" href="/">
|
<a class="link contrast" href="/">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<img class="logo" src="{logo}" alt="ExploreCraft Logo" />
|
<img class="logo" src="/assets/logo/explorecraft.svg" alt="ExploreCraft Logo" />
|
||||||
<div>ExploreCraft</div>
|
<div>ExploreCraft</div>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
<nav id="navigation-bar">
|
<nav class="navigation-bar">
|
||||||
<ul>
|
<ul>
|
||||||
<li aria-current={$page.url.pathname === '/' ? 'page' : undefined}>
|
<li>
|
||||||
<a href="/" class="contrast">Home</a>
|
<a href="/" class="contrast {$page.url.pathname === '/' ? 'current-page' : undefined}">Home</a>
|
||||||
</li>
|
</li>
|
||||||
<li aria-current={$page.url.pathname === '/download' ? 'page' : undefined}>
|
<li>
|
||||||
<a href="/download" class="contrast">Download</a>
|
<a href="/downloads" class="contrast {$page.url.pathname === '/downloads' ? 'current-page' : undefined}">Download</a>
|
||||||
</li>
|
</li>
|
||||||
<li aria-current={$page.url.pathname.startsWith('/gallery') ? 'page' : undefined}>
|
<li>
|
||||||
<a href="/gallery" class="contrast">Gallery</a>
|
<a href="/gallery" class="contrast {$page.url.pathname === '/gallery' ? 'current-page' : undefined}">Gallery</a>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
<li>
|
||||||
<Switcher/>
|
<Switcher/>
|
||||||
|
@ -63,53 +61,69 @@
|
||||||
.header {
|
.header {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between; /* Add this to align the logo and navigation on opposite sides */
|
justify-content: space-between;
|
||||||
padding: 0.5em;
|
padding-top: 0.5em;
|
||||||
padding-right: 1.5em; /* Change padding-left to padding-right */
|
padding-bottom: 0.5em;
|
||||||
|
padding-right: 0.5em;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1.5em;
|
font-size: 1.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation-bar {
|
.navigation-bar {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
margin-right: 2em;
|
margin-right: 2.5%;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation-bar li {
|
.navigation-bar li {
|
||||||
margin-left: 1em;
|
margin-left: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation-bar a {
|
.navigation-bar a {
|
||||||
font-family: 'IBM Plex Mono', monospace;
|
font-family: 'IBM Plex Mono', monospace;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 500;
|
font-weight: 400;
|
||||||
font-size: 1em;
|
font-size: 1em;
|
||||||
/* color: #000000; */
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
transition: font-style;
|
transition: font-style;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation-bar a:hover {
|
[data-theme="dark"] .navigation-bar a {
|
||||||
font-style: italic;
|
font-family: 'IBM Plex Mono', monospace;
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 300;
|
||||||
|
font-size: 1em;
|
||||||
|
text-decoration: none;
|
||||||
|
transition: font-style;
|
||||||
}
|
}
|
||||||
|
|
||||||
#navigation-bar a.current-page {
|
.navigation-bar a.current-page {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="dark"] .navigation-bar a.current-page {
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navigation-bar a:hover {
|
||||||
font-style: italic;
|
font-style: italic;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-theme="dark"] .navigation-bar a:hover {
|
||||||
|
font-style: italic;
|
||||||
|
font-weight: 200;
|
||||||
}
|
}
|
||||||
|
|
||||||
.link {
|
.link {
|
||||||
/* color: #000000; */
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
transition: font-style;
|
/* transition: font-style; */
|
||||||
|
margin-left: 2.5%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.link:hover {
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
|
@ -1,8 +1,6 @@
|
||||||
<!-- Switcher.svelte -->
|
<!-- Switcher.svelte -->
|
||||||
<script>
|
<script>
|
||||||
import { onMount } from "svelte";
|
import { onMount } from "svelte";
|
||||||
import sun from "$lib/assets/icons/sun.svg";
|
|
||||||
import moon from "$lib/assets/icons/moon.svg";
|
|
||||||
|
|
||||||
let isDarkMode = false;
|
let isDarkMode = false;
|
||||||
|
|
||||||
|
@ -25,9 +23,9 @@
|
||||||
|
|
||||||
<button class:dark={isDarkMode} class="switcher" on:click={toggleDarkMode}>
|
<button class:dark={isDarkMode} class="switcher" on:click={toggleDarkMode}>
|
||||||
{#if isDarkMode}
|
{#if isDarkMode}
|
||||||
<img src={sun} class="icon" alt="Light Mode" />
|
<img src="/assets/icons/sun.svg" class="icon" alt="Light Mode" />
|
||||||
{:else}
|
{:else}
|
||||||
<img src={moon} class="icon" alt="Dark Mode" />
|
<img src="/assets/icons/moon.svg" class="icon" alt="Dark Mode" />
|
||||||
{/if}
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
|
@ -5,7 +5,6 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { onMount } from 'svelte';
|
import { onMount } from 'svelte';
|
||||||
import celebrate from '$lib/assets/audio/8bit-win.mp3';
|
|
||||||
|
|
||||||
let characters = ['🥳', '🎉', '✨'];
|
let characters = ['🥳', '🎉', '✨'];
|
||||||
|
|
||||||
|
@ -51,7 +50,7 @@
|
||||||
<div class="text-column">
|
<div class="text-column">
|
||||||
<h1>Yahoo!</h1>
|
<h1>Yahoo!</h1>
|
||||||
<h2>Celebrate good times COME ON!</h2>
|
<h2>Celebrate good times COME ON!</h2>
|
||||||
<audio loop="true" autoplay="true" src="{celebrate}" />
|
<audio loop="true" autoplay="true" src="assets/audio/8bit-win.mp3" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|
|
@ -1,9 +0,0 @@
|
||||||
import { dev } from '$app/environment';
|
|
||||||
|
|
||||||
// we don't need any JS on this page, though we'll load
|
|
||||||
// it in dev so that we get hot module replacement
|
|
||||||
export const csr = dev;
|
|
||||||
|
|
||||||
// since there's no dynamic data here, we can prerender
|
|
||||||
// it so that it gets served as a static asset in production
|
|
||||||
export const prerender = true;
|
|
|
@ -1,9 +0,0 @@
|
||||||
<svelte:head>
|
|
||||||
<title>Downloads</title>
|
|
||||||
<meta name="description" content="About this app" />
|
|
||||||
</svelte:head>
|
|
||||||
|
|
||||||
<div class="text-column">
|
|
||||||
<h1>Downloads</h1>
|
|
||||||
<p>Here you'll find all downloads.</p>
|
|
||||||
</div>
|
|
141
src/routes/downloads/+page.svelte
Normal file
|
@ -0,0 +1,141 @@
|
||||||
|
<script>
|
||||||
|
import MsgBox from "$lib/modules/MsgBox.svelte";
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<svelte:head>
|
||||||
|
<title>Downloads</title>
|
||||||
|
<meta name="description" content="About this app" />
|
||||||
|
</svelte:head>
|
||||||
|
|
||||||
|
<div class="text-column">
|
||||||
|
<h1>Downloads</h1>
|
||||||
|
<p>You've decided to download ExploreCraft?<br>Here you'll find all the download links and instructions to install ExploreCraft!</p>
|
||||||
|
</div>
|
||||||
|
<MsgBox
|
||||||
|
type="warning"
|
||||||
|
message="<br>Currently WIP. You'll find downloads on this page,<br>but they may not work properly."
|
||||||
|
prefix="ℹ️ Note ℹ️"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<article class="main-card">
|
||||||
|
<div>
|
||||||
|
<h4>ExploreCraft: Marbled</h4>
|
||||||
|
<p>
|
||||||
|
The main way to play ExploreCraft. This is also the most stable version,
|
||||||
|
so you're better off playing with this rather than the other ones.
|
||||||
|
</p>
|
||||||
|
<a role="button" href="https://gitpot.dev/attachments/7a690df1-d78f-41fd-a9f7-610eacb369a9">Download</a>
|
||||||
|
<a href="#instructions" role="button" class="outline">Instructions</a>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Unstable Versions -->
|
||||||
|
<details>
|
||||||
|
<!-- svelte-ignore a11y-no-redundant-roles -->
|
||||||
|
<summary class="secondary" role="button" id="unstable">Unstable Releases
|
||||||
|
</summary>
|
||||||
|
<div class="grid">
|
||||||
|
<article>
|
||||||
|
<div>
|
||||||
|
<h4>ExploreCraft: Legacy</h4>
|
||||||
|
<div class="msg-box"><MsgBox type="error" message="Unmaintained!" prefix="Warning:" /></div>
|
||||||
|
<p>
|
||||||
|
If you'd like to keep playing the legacy version of ExploreCraft, you
|
||||||
|
can download it here. Not recommended as it is not maintained anymore and incompatible with Marbled.
|
||||||
|
</p>
|
||||||
|
<a role="button" href="https://gitpot.dev/attachments/f249e088-14f3-4372-8aff-97f45810a763">Download</a>
|
||||||
|
<a href="#instructions" role="button" class="outline">Instructions</a>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
<article>
|
||||||
|
<h4>ExploreCraft: Dev</h4>
|
||||||
|
<div class="msg-box"><MsgBox type="warning" message="Unstable!" /></div>
|
||||||
|
<p>
|
||||||
|
ExploreCraft's Beta instance. Here be dragons! This is the in-dev version
|
||||||
|
of ExploreCraft which may have game-breaking bugs, unfinished features and
|
||||||
|
world corruptions.
|
||||||
|
</p>
|
||||||
|
<a href="https://gitpot.dev/ExploreCraft/modpack" role="button">Download</a>
|
||||||
|
<a href="#instructions" role="button" class="outline">Instructions</a>
|
||||||
|
</article>
|
||||||
|
</div>
|
||||||
|
</details>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- Instructions -->
|
||||||
|
<h2 id="instructions">Instructions</h2>
|
||||||
|
<p>Need help installing ExploreCraft? No problem! Just follow these few easy steps.</p>
|
||||||
|
|
||||||
|
<h3>Installation</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
To install this modpack, you'll either need
|
||||||
|
<a href="https://prismlauncher.org" rel="noopener noreferrer" target="_blank"><b>PrismLauncher</b> (Recommended)</a> or
|
||||||
|
<a href="https://multimc.org" rel="noopener noreferrer" target="_blank"><b>MultiMC</b></a>.
|
||||||
|
<br>Additionaly, you'll need to download one of the above instances (.zip files).
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Create a new instance by using Ctrl-N (Or CMD-N on MacOS).<br>
|
||||||
|
Open the "Import from ZIP" tab, and choose the file you just downloaded.<br>
|
||||||
|
You can also give it a catchy name and a snazzy icon while you're at it.
|
||||||
|
<img class="guide" alt="instance creation" src="assets/images/guide/instance-creation.png">
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Once the import is complete, you can configure your instance however you like by pressing Ctrl-I (or CMD-I on a Mac.)
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
It is time to launch!<br>
|
||||||
|
You should see a "packwiz" window appear which will download all the mods you need.<br>
|
||||||
|
This tool is also responsible for keeping the modpack up to date.
|
||||||
|
<ul>
|
||||||
|
<li class="indented">
|
||||||
|
A window will appear asking you which optional mods you'd like to download. As it implies, none of them are necessary but recommended.
|
||||||
|
</li>
|
||||||
|
<li class="indented">
|
||||||
|
Mods downloading:
|
||||||
|
</li>
|
||||||
|
<li class="indented">
|
||||||
|
If a screen similar to this one appears, don't fret!
|
||||||
|
Just follow the guide
|
||||||
|
<a href="https://gitpot.dev/ExploreCraft/modpack/src/branch/marbled/manual-download.md" rel="noopener noreferrer" target="_blank">here</a>
|
||||||
|
to continue:
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
The game will now boot up, and you'll be ready to rock! Have fun :D
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.main-card {
|
||||||
|
width: 50%;
|
||||||
|
justify-self: center;
|
||||||
|
}
|
||||||
|
a[role="button"]{
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
li {
|
||||||
|
list-style: decimal;
|
||||||
|
}
|
||||||
|
li .indented {
|
||||||
|
list-style: disc;
|
||||||
|
}
|
||||||
|
img.guide {
|
||||||
|
margin-top: 1em;
|
||||||
|
margin-bottom: 1em;
|
||||||
|
justify-self: center;
|
||||||
|
align-self: center;
|
||||||
|
border-radius: 1em;
|
||||||
|
transition: all 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
|
||||||
|
}
|
||||||
|
img.guide:hover {
|
||||||
|
transform: scale(1.005);
|
||||||
|
box-shadow: 0px 0px 1em rgba(32, 32, 32, 0.6);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
</style>
|
13
src/routes/examples/+page.svelte
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
<script>
|
||||||
|
import Modal from "$lib/modules/Modal.svelte";
|
||||||
|
let showModal = false;
|
||||||
|
const openModal = () => {
|
||||||
|
showModal = true;
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<button on:click={openModal}>Open Modal</button>
|
||||||
|
{#if showModal}
|
||||||
|
<Modal title="Modal Title" msg="Modal Message" submit="https://example.com" bind:isOpen={showModal} />
|
||||||
|
{/if}
|
||||||
|
|
|
@ -1,9 +0,0 @@
|
||||||
import { dev } from '$app/environment';
|
|
||||||
|
|
||||||
// we don't need any JS on this page, though we'll load
|
|
||||||
// it in dev so that we get hot module replacement
|
|
||||||
export const csr = dev;
|
|
||||||
|
|
||||||
// since there's no dynamic data here, we can prerender
|
|
||||||
// it so that it gets served as a static asset in production
|
|
||||||
export const prerender = true;
|
|
|
@ -1,9 +1,65 @@
|
||||||
<svelte:head>
|
<svelte:head>
|
||||||
<title>Gallery</title>
|
<title>Gallery</title>
|
||||||
<meta name="description" content="About this app" />
|
<meta name="description" content="Some sweet screenshots from ExploreCraft!" />
|
||||||
</svelte:head>
|
</svelte:head>
|
||||||
|
|
||||||
<div class="text-column">
|
<div class="text-column">
|
||||||
<h1>Gallery</h1>
|
<h1>Gallery</h1>
|
||||||
<p>Here you'll find the sweet screenshots 😉.</p>
|
<p>Here you'll find the sweet screenshots 😉.</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic1.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic2.png" alt="2"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic3.png" alt="3"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic9.png" alt="1"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic4.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic5.png" alt="2"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic6.png" alt="3"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic7.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic8.png" alt="2"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic10.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic11.png" alt="2"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic12.png" alt="3"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic13.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic14.png" alt="2"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic15.png" alt="3"></div>
|
||||||
|
</div>
|
||||||
|
<div class="grid">
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic16.png" alt="1"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic17.png" alt="2"></div>
|
||||||
|
<div><img class="gallery-image" src="assets/images/gallery/pic18.png" alt="3"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<style>
|
||||||
|
img.gallery-image {
|
||||||
|
border-radius: 1em;
|
||||||
|
transition: all 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
img.gallery-image:hover {
|
||||||
|
transform: scale(1.005);
|
||||||
|
box-shadow: 0px 0px 1em rgba(32, 32, 32, 0.6);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.gallery-image {
|
||||||
|
border-radius: 10px;
|
||||||
|
object-fit: fill;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.grid {
|
||||||
|
margin-bottom: 1em;
|
||||||
|
}
|
||||||
|
</style>
|
185
src/routes/modlist/+page.svelte
Normal file
|
@ -0,0 +1,185 @@
|
||||||
|
<h1>Modlist</h1>
|
||||||
|
<div class="container">
|
||||||
|
<div class="column">
|
||||||
|
<ul>
|
||||||
|
<ul>
|
||||||
|
<li>Accurate Maps</li>
|
||||||
|
<li>Ad Astra!</li>
|
||||||
|
<li>Ada Paxels</li>
|
||||||
|
<li>Adorn</li>
|
||||||
|
<li>Advancement Plaques</li>
|
||||||
|
<li>AdventureZ</li>
|
||||||
|
<li>Alloy Forgery</li>
|
||||||
|
<li>Amethyst Tools</li>
|
||||||
|
<li>Angling Mod</li>
|
||||||
|
<li>Another Furniture</li>
|
||||||
|
<li>AntiGhost</li>
|
||||||
|
<li>Applied Energistics 2</li>
|
||||||
|
<li>Architectury</li>
|
||||||
|
<li>Auditory</li>
|
||||||
|
<li>Balm</li>
|
||||||
|
<li>Biome Makeover</li>
|
||||||
|
<li>Blocks</li>
|
||||||
|
<li>Boat Item View Fabric</li>
|
||||||
|
<li>Botarium</li>
|
||||||
|
<li>Chisel Refabricated</li>
|
||||||
|
<li>Chunky</li>
|
||||||
|
<li>Cloth Config v8</li>
|
||||||
|
<li>Continuity</li>
|
||||||
|
<li>Controlling For Fabric</li>
|
||||||
|
<li>Crafting Tweaks</li>
|
||||||
|
<li>Create Crafts and Additions</li>
|
||||||
|
<li>Croptopia</li>
|
||||||
|
<li>Detail Armor Bar</li>
|
||||||
|
<li>Eating Animaton</li>
|
||||||
|
<li>EldritchMobs</li>
|
||||||
|
<li>Enchanted Vertical Slabs</li>
|
||||||
|
<li>Enchanting Infuser</li>
|
||||||
|
<li>EntityCulling-Fabric</li>
|
||||||
|
<li>Extractinator</li>
|
||||||
|
<li>ExtrasSounds</li>
|
||||||
|
<li>Fabric language Kotlin</li>
|
||||||
|
<li>Fabric Waystones</li>
|
||||||
|
<li>Factory Blocks Mod</li>
|
||||||
|
<li>Falling Leaves</li>
|
||||||
|
<li>Fastback</li>
|
||||||
|
<li>FerriteCore</li>
|
||||||
|
<li>Frame</li>
|
||||||
|
<li>Global Packs</li>
|
||||||
|
<li>Hold That Chunk</li>
|
||||||
|
<li>Icarus</li>
|
||||||
|
<li>Iceberg</li>
|
||||||
|
<li>Indium</li>
|
||||||
|
<li>Interactic</li>
|
||||||
|
<li>Jade Addons</li>
|
||||||
|
<li>Konkrete</li>
|
||||||
|
<li>Ksyxis</li>
|
||||||
|
<li>Labels</li>
|
||||||
|
<li>Language Reload</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<ul>
|
||||||
|
<li>Legendary Tooltips</li>
|
||||||
|
<li>Limits' Grapple</li>
|
||||||
|
<li>Ma Enchants</li>
|
||||||
|
<li>Macaw's Bridges</li>
|
||||||
|
<li>Macaw's Bridges BYG</li>
|
||||||
|
<li>Macaw's Doors</li>
|
||||||
|
<li>Macaw's Fences and Walls</li>
|
||||||
|
<li>Macaw's Furniture</li>
|
||||||
|
<li>Macaw's Paintings</li>
|
||||||
|
<li>Macaw's Paths and Pavings</li>
|
||||||
|
<li>Macaw's Roofs BYG</li>
|
||||||
|
<li>Macaw's Trapdoors</li>
|
||||||
|
<li>Macaw's Trapdoors</li>
|
||||||
|
<li>Macaw's Windows</li>
|
||||||
|
<li>Main Menu Credits</li>
|
||||||
|
<li>Mimic</li>
|
||||||
|
<li>Missing Wilds</li>
|
||||||
|
<li>MixinTrace</li>
|
||||||
|
<li>Mod Menu</li>
|
||||||
|
<li>Moonlight</li>
|
||||||
|
<li>More Chat History</li>
|
||||||
|
<li>MoreCreativeTabs</li>
|
||||||
|
<li>Mythic Metals</li>
|
||||||
|
<li>Mythic Upgrades</li>
|
||||||
|
<li>Naturalist</li>
|
||||||
|
<li>Nature's Compass</li>
|
||||||
|
<li>NiceLoad</li>
|
||||||
|
<li>No chat Reports</li>
|
||||||
|
<li>No Mob Farm</li>
|
||||||
|
<li>NotEnoughAnimations</li>
|
||||||
|
<li>Numismatic Overhaul</li>
|
||||||
|
<li>OPAC Create Mod Support</li>
|
||||||
|
<li>Open parties and claims</li>
|
||||||
|
<li>Pehkui</li>
|
||||||
|
<li>Polymorph</li>
|
||||||
|
<li>Powah!</li>
|
||||||
|
<li>Prism</li>
|
||||||
|
<li>Puzzle</li>
|
||||||
|
<li>Quartz Elevator</li>
|
||||||
|
<li>Quilt Loading Screen</li>
|
||||||
|
<li>Quiltgoslightyfasterlol</li>
|
||||||
|
<li>Recipe Book Is Pain</li>
|
||||||
|
<li>Reesse's Sodium Options</li>
|
||||||
|
<li>Resourcefulconfig</li>
|
||||||
|
<li>Roughly Enough Items</li>
|
||||||
|
<li>Satin</li>
|
||||||
|
<li>ServerCore</li>
|
||||||
|
<li>Sky Villages</li>
|
||||||
|
<li>Smooth boot</li>
|
||||||
|
<li>Sodium</li>
|
||||||
|
<li>Sodium Extra</li>
|
||||||
|
<li>Sound physics Remastered</li>
|
||||||
|
<li>Starlight</li>
|
||||||
|
<li>TerraBlender</li>
|
||||||
|
<li>Travaler's Backpack</li>
|
||||||
|
<li>Twigs</li>
|
||||||
|
<li>Villager Hats</li>
|
||||||
|
<li>Xareo's Minimap</li>
|
||||||
|
<li>Xareo's World Map</li>
|
||||||
|
<li>Your'e in Grave Danger</li>
|
||||||
|
<li>Your Reputation</li>
|
||||||
|
<li>YUNG's Better Desert Temples</li>
|
||||||
|
<li>YUNG's Better Dungeons</li>
|
||||||
|
<li>YUNG's Better Mineshaft</li>
|
||||||
|
<li>YUNG's Better Ocean Monuments</li>
|
||||||
|
<li>YUNG's Better Strongholds</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<details>
|
||||||
|
<summary role="button" class="secondary">Optional Mods</summary>
|
||||||
|
<div class="container">
|
||||||
|
<div class="column">
|
||||||
|
<ul>
|
||||||
|
<li>3D Skin Layers</li>
|
||||||
|
<li>Animatica</li>
|
||||||
|
<li>AppleSkin</li>
|
||||||
|
<li>Better F3</li>
|
||||||
|
<li>CapeTweaks</li>
|
||||||
|
<li>Chat Heads</li>
|
||||||
|
<li>Chunks fade in</li>
|
||||||
|
<li>CIT Resewn</li>
|
||||||
|
<li>ClickTrough</li>
|
||||||
|
<li>DashLoader</li>
|
||||||
|
<li>Draggable Resource Packs</li>
|
||||||
|
<li>Dynamic FPS</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="column">
|
||||||
|
<ul>
|
||||||
|
<li>Effective 💦</li>
|
||||||
|
<li>EmuNO</li>
|
||||||
|
<li>Iris shaders</li>
|
||||||
|
<li>Jade 🔍</li>
|
||||||
|
<li>Kappa</li>
|
||||||
|
<li>LambdaBetterGrass</li>
|
||||||
|
<li>LambDynamicLights</li>
|
||||||
|
<li>Mouse Wheelie</li>
|
||||||
|
<li>Ok Zoomer</li>
|
||||||
|
<li>Presence Footsteps</li>
|
||||||
|
<li>Reese’s Sodium Options</li>
|
||||||
|
<li>Too many Binds</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</details>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
|
||||||
|
.container {
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.column {
|
||||||
|
width: 50%;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
|
@ -1,107 +0,0 @@
|
||||||
/* @import '@fontsource/fira-mono';
|
|
||||||
|
|
||||||
:root {
|
|
||||||
--font-body: Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
|
|
||||||
Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
||||||
--font-mono: 'Fira Mono', monospace;
|
|
||||||
--color-bg-0: rgb(202, 216, 228);
|
|
||||||
--color-bg-1: hsl(209, 36%, 86%);
|
|
||||||
--color-bg-2: hsl(224, 44%, 95%);
|
|
||||||
--color-theme-1: #ff3e00;
|
|
||||||
--color-theme-2: #4075a6;
|
|
||||||
--color-text: rgba(0, 0, 0, 0.7);
|
|
||||||
--column-width: 42rem;
|
|
||||||
--column-margin-top: 4rem;
|
|
||||||
font-family: var(--font-body);
|
|
||||||
color: var(--color-text);
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
min-height: 100vh;
|
|
||||||
margin: 0;
|
|
||||||
background-attachment: fixed;
|
|
||||||
background-color: var(--color-bg-1);
|
|
||||||
background-size: 100vw 100vh;
|
|
||||||
background-image: radial-gradient(
|
|
||||||
50% 50% at 50% 50%,
|
|
||||||
rgba(255, 255, 255, 0.75) 0%,
|
|
||||||
rgba(255, 255, 255, 0) 100%
|
|
||||||
),
|
|
||||||
linear-gradient(180deg, var(--color-bg-0) 0%, var(--color-bg-1) 15%, var(--color-bg-2) 50%);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
p {
|
|
||||||
font-weight: 400;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: var(--color-theme-1);
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
font-size: 2rem;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
font-size: 1rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre {
|
|
||||||
font-size: 16px;
|
|
||||||
font-family: var(--font-mono);
|
|
||||||
background-color: rgba(255, 255, 255, 0.45);
|
|
||||||
border-radius: 3px;
|
|
||||||
box-shadow: 2px 2px 6px rgb(255 255 255 / 25%);
|
|
||||||
padding: 0.5em;
|
|
||||||
overflow-x: auto;
|
|
||||||
color: var(--color-text);
|
|
||||||
}
|
|
||||||
|
|
||||||
.text-column {
|
|
||||||
display: flex;
|
|
||||||
max-width: 48rem;
|
|
||||||
flex: 0.6;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
button {
|
|
||||||
font-size: inherit;
|
|
||||||
font-family: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:focus:not(:focus-visible) {
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (min-width: 720px) {
|
|
||||||
h1 {
|
|
||||||
font-size: 2.4rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.visually-hidden {
|
|
||||||
border: 0;
|
|
||||||
clip: rect(0 0 0 0);
|
|
||||||
height: auto;
|
|
||||||
margin: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
padding: 0;
|
|
||||||
position: absolute;
|
|
||||||
width: 1px;
|
|
||||||
white-space: nowrap;
|
|
||||||
} */
|
|
Before Width: | Height: | Size: 711 B After Width: | Height: | Size: 711 B |
Before Width: | Height: | Size: 724 B After Width: | Height: | Size: 724 B |
0
static/assets/images/gallery/pic0.png
Normal file
Before Width: | Height: | Size: 3.4 MiB After Width: | Height: | Size: 3.4 MiB |
Before Width: | Height: | Size: 4.3 MiB After Width: | Height: | Size: 4.3 MiB |
Before Width: | Height: | Size: 4.1 MiB After Width: | Height: | Size: 4.1 MiB |
Before Width: | Height: | Size: 259 KiB After Width: | Height: | Size: 259 KiB |
Before Width: | Height: | Size: 167 KiB After Width: | Height: | Size: 167 KiB |
Before Width: | Height: | Size: 4.6 MiB After Width: | Height: | Size: 4.6 MiB |
BIN
static/assets/images/gallery/pic15.png
Normal file
After Width: | Height: | Size: 5.4 MiB |
BIN
static/assets/images/gallery/pic16.png
Normal file
After Width: | Height: | Size: 3.6 MiB |
BIN
static/assets/images/gallery/pic17.png
Normal file
After Width: | Height: | Size: 3.1 MiB |
BIN
static/assets/images/gallery/pic18.png
Normal file
After Width: | Height: | Size: 2.9 MiB |
Before Width: | Height: | Size: 582 KiB After Width: | Height: | Size: 582 KiB |
Before Width: | Height: | Size: 5.3 MiB After Width: | Height: | Size: 5.3 MiB |
Before Width: | Height: | Size: 1.8 MiB After Width: | Height: | Size: 1.8 MiB |
Before Width: | Height: | Size: 4.4 MiB After Width: | Height: | Size: 4.4 MiB |
Before Width: | Height: | Size: 4.4 MiB After Width: | Height: | Size: 4.4 MiB |
Before Width: | Height: | Size: 4.7 MiB After Width: | Height: | Size: 4.7 MiB |
Before Width: | Height: | Size: 4.3 MiB After Width: | Height: | Size: 4.3 MiB |
Before Width: | Height: | Size: 4.4 MiB After Width: | Height: | Size: 4.4 MiB |
BIN
static/assets/images/guide/instance-creation.png
Normal file
After Width: | Height: | Size: 57 KiB |
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 4.4 KiB After Width: | Height: | Size: 4.4 KiB |
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 5.9 KiB |