fml
This commit is contained in:
BlackMageMathos
972
client/package-lock.json
generated
972
client/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -29,6 +29,7 @@
|
||||
"dependencies": {
|
||||
"axios": "^0.19.2",
|
||||
"core-js": "^3.6.4",
|
||||
"jquery": "^3.5.1",
|
||||
"vue": "^2.6.11"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
||||
@@ -18,5 +18,6 @@
|
||||
</noscript>
|
||||
<div id="srs"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
<script>console.log("test");console.log(window.$);</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
8
client/public/libs/bootstrap.min.css
vendored
8
client/public/libs/bootstrap.min.css
vendored
File diff suppressed because one or more lines are too long
@@ -1,4 +1,5 @@
|
||||
<template>
|
||||
<div class="sticky-top">
|
||||
<nav class="navbar navbar-expand-sm navbar-dark bg-dark">
|
||||
<a class="navbar-brand font-display font-weight-700" href="#">Auracle</a>
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
@@ -12,6 +13,7 @@
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
<!--<nav class="navbar navbar-dark">
|
||||
<ul v-if="links.length != 0">
|
||||
<li v-for="(link, index) in links" :key="index">
|
||||
@@ -22,7 +24,6 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
name: 'navbar',
|
||||
data() {
|
||||
@@ -49,78 +50,4 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*
|
||||
nav {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
padding-left: 2rem;
|
||||
|
||||
ul {
|
||||
display: flex;
|
||||
li {
|
||||
a {
|
||||
position: relative;
|
||||
margin-right: 1rem;
|
||||
padding: 1.5rem;
|
||||
display: block;
|
||||
font-size: .83rem;
|
||||
font-weight: $font-bold;
|
||||
text-transform: uppercase;
|
||||
text-shadow: none;
|
||||
transition: text-shadow .5s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
|
||||
&:after {
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 3px;
|
||||
content: '';
|
||||
box-shadow: none;
|
||||
transition: width .5s cubic-bezier(0.645, 0.045, 0.355, 1), box-shadow .5s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.router-link-exact-active {
|
||||
@include blue-glow-text(.5);
|
||||
&:after {
|
||||
width: 80%;
|
||||
transition: width .5s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
@include blue-glow-box(.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.navbar-light {
|
||||
ul {
|
||||
li {
|
||||
a {
|
||||
color: $black;
|
||||
&:after {
|
||||
background: $black;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.navbar-dark {
|
||||
ul {
|
||||
li {
|
||||
a {
|
||||
color: $white;
|
||||
&:after {
|
||||
background: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
*/
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
<template>
|
||||
<article class="spell-card">
|
||||
<div class="col-12 col-sm-6 col-lg-4 col-xl-3 mb-4 grid-item grid-sizer">
|
||||
<div class="bg-white p-4 rounded text-dark border-primary shadow-sm" style="border-left:4px solid;">
|
||||
<div class="h3 font-display font-weight-bold text-wrap word-break line-height-100" :title="name"><a class="text-decoration-none text-primary" href="/spell/XXX">{{name}}</a></div>
|
||||
<div class="font-weight-700 text-muted d-inline-block">Niveau {{level}}</div> <div class="text-muted d-inline-block">· <span v-for="(school, index) in schools" :key="index"><span v-if="index!=0">, </span>{{school.name}}</span></div>
|
||||
<div class="small text-muted font-italic">{{description|truncate(256,"…")}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--<article class="spell-card">
|
||||
<div class="content">
|
||||
<header>
|
||||
<h3>{{ name }}</h3>
|
||||
@@ -54,7 +61,7 @@
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</article>
|
||||
</article>-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -85,124 +92,4 @@ export default {
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*
|
||||
.spell-card {
|
||||
max-width: 35rem;
|
||||
padding: .5rem;
|
||||
margin: .5rem auto .5rem;
|
||||
background: $spell-card--innerborder;
|
||||
border: solid 1px rgba($primary--base, .5);
|
||||
border-radius: .5rem;
|
||||
box-shadow: .0 .0 .75rem rgba($primary--base, .25);
|
||||
|
||||
> .content {
|
||||
max-width: 35rem;
|
||||
height: 100%;
|
||||
padding: .75rem;
|
||||
background: $white;
|
||||
|
||||
header {
|
||||
h3 {
|
||||
padding: .5rem;
|
||||
text-align: center;
|
||||
color: $white;
|
||||
text-transform: uppercase;
|
||||
background: $black;
|
||||
}
|
||||
}
|
||||
|
||||
.casting-header {
|
||||
display: flex;
|
||||
> * {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.casting-infos {
|
||||
margin: .75rem 0;
|
||||
padding-right: .75rem;
|
||||
border-right: 1px solid rgba($black, .25);
|
||||
.type {
|
||||
margin-bottom: .5rem;
|
||||
display: flex;
|
||||
> * {
|
||||
width: 50%;
|
||||
}
|
||||
.level {
|
||||
.label {
|
||||
margin-right: .25rem;
|
||||
display: inline-block;
|
||||
}
|
||||
var {
|
||||
display: inline-block;
|
||||
font-size: 2.3em;
|
||||
}
|
||||
}
|
||||
}
|
||||
.cost, .charge {
|
||||
font-size: 0.9rem;
|
||||
> * {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.label {
|
||||
display: inline-block;
|
||||
width: 30%;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
var {
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.casting-ingredients {
|
||||
margin: .75rem 0;
|
||||
padding-left: .75rem;
|
||||
.title {
|
||||
margin-bottom: .25rem;
|
||||
font-size: .9rem;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.content {
|
||||
padding-top: 1rem;
|
||||
font-size: .85rem;
|
||||
text-align: justify;
|
||||
text-align-last: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.spell-description {
|
||||
padding: .75rem 0;
|
||||
font-size: .85rem;
|
||||
p {
|
||||
&:not(:last-of-type) {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
padding: .75rem 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.label {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
.variables {
|
||||
.xyz {
|
||||
span {
|
||||
font-size: 1.1rem;
|
||||
font-weight: bold;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
*/
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="spells-list">
|
||||
<div class="row grid">
|
||||
<spell-card v-for="(spell, index) in spells" :key="index" v-bind="spell"/>
|
||||
</div>
|
||||
</template>
|
||||
@@ -36,13 +36,11 @@ export default {
|
||||
this.loading = true
|
||||
const displaySpells = await this.fetchSpells();
|
||||
this.loading = false
|
||||
this.spells = displaySpells.slice(0, 10)
|
||||
this.spells = displaySpells
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
@@ -4,9 +4,20 @@ import App from './app.vue'
|
||||
|
||||
import routes from './routes'
|
||||
|
||||
window.$ = window.jQuery = require('jquery');
|
||||
|
||||
Vue.config.productionTip = false
|
||||
Vue.use(VueRouter)
|
||||
|
||||
var filter = function(text, length, clamp){
|
||||
clamp = clamp || '...';
|
||||
var node = document.createElement('div');
|
||||
node.innerHTML = text;
|
||||
var content = node.textContent;
|
||||
return content.length > length ? content.slice(0, length) + clamp : content;
|
||||
};
|
||||
Vue.filter('truncate', filter);
|
||||
|
||||
const router = new VueRouter({
|
||||
mode: 'history',
|
||||
routes,
|
||||
|
||||
@@ -1,15 +1,15 @@
|
||||
<template>
|
||||
<div class="home-page">
|
||||
<section class="landing">
|
||||
<div class="splash-title">
|
||||
<h1>Auracle</h1>
|
||||
<div>
|
||||
<p>Recueil de savoirs arcaniques et ésotériques des contrées lointaines de Léïm</p>
|
||||
<p>Découvrez ses sortilèges et maléfices...</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
<div class="container">
|
||||
<section class="fullpage">
|
||||
<div class="px-4">
|
||||
<div class="display-2 text-dark mb-4 font-display" style="line-height:100%;font-weight:900;">"C'est magique, ta gueule."</div>
|
||||
<div class="lead font-display font-weight-bold">— N'importe quel MJ, une fois dans sa vie</div>
|
||||
<hr class="w-50">
|
||||
<div class="lead"><span class="font-display" style="font-weight:700;">Auracle</span> est une base de données publique en ligne pour sortilèges, en soutien au jeu de rôle sur table <span class="font-weight-bold text-secondary">Wunderwelt</span>.</div>
|
||||
<!--<a class="mt-4 btn btn-primary btn-lg font-display text-uppercase" href="/register" role="button" style="font-weight:800;">Create a free account</a>-->
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -19,39 +19,10 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.home-page {
|
||||
.landing {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: $dull--black;
|
||||
|
||||
.splash-title {
|
||||
padding-bottom: 1rem;
|
||||
color: $white;
|
||||
text-align: center;
|
||||
@include blue-glow-text(.8);
|
||||
|
||||
h1 {
|
||||
margin-bottom: 1.5rem;
|
||||
font-size: 4rem;
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-weight: $font-bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
div {
|
||||
padding-top: 1rem;
|
||||
p {
|
||||
margin-bottom: 1.5rem;
|
||||
font-size: 1.2rem;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.fullpage{
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
@@ -1,23 +1,24 @@
|
||||
<template>
|
||||
<section class="spells-page">
|
||||
<spell-list/>
|
||||
</section>
|
||||
<div class="container-fluid p-4">
|
||||
<spell-list/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
// Components
|
||||
import spellslist from "../components/spells/spells-list"
|
||||
|
||||
export default {
|
||||
import spellslist from "../components/spells/spells-list"
|
||||
export default {
|
||||
name: 'spells',
|
||||
components: {
|
||||
'spell-list': spellslist,
|
||||
'spell-list': spellslist,
|
||||
},
|
||||
mounted(){
|
||||
window.$(".grid").masonry({
|
||||
itemSelector:".grid-item",
|
||||
columnWidth:".grid-sizer",
|
||||
percentPosition: true
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
<style lang="scss"></style>
|
||||
Reference in New Issue
Block a user