Added new theme: 95.scss
This commit is contained in:
Nikurasu
parent
125c93b9ec
commit
1cd2d9903c
|
|
@ -20,6 +20,7 @@ It's very simple, follow these steps.
|
||||||
- The `design` refers to the style of your page the currently available styles are:
|
- The `design` refers to the style of your page the currently available styles are:
|
||||||
- [main](examples/images/main.png)
|
- [main](examples/images/main.png)
|
||||||
- [blurywhite](examples/images/blurywhite.png)
|
- [blurywhite](examples/images/blurywhite.png)
|
||||||
|
- [98](examples/images/blurywhite.png) (CSS taken from [jdan/95.css](https://github.com/jdan/98.css))
|
||||||
- List as much links as you like in the `links` array:
|
- List as much links as you like in the `links` array:
|
||||||
- With the `color` property you can give the link the color of the social
|
- With the `color` property you can give the link the color of the social
|
||||||
media plaform of your choice, but this feature is optional, the link will
|
media plaform of your choice, but this feature is optional, the link will
|
||||||
|
|
|
||||||
41
source/_assets/sass/98.scss
Normal file
41
source/_assets/sass/98.scss
Normal file
|
|
@ -0,0 +1,41 @@
|
||||||
|
.linkBox{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.alignMiddle {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
background-color: #008080;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mainContainer {
|
||||||
|
display: flex;
|
||||||
|
max-width: 95%;
|
||||||
|
width: 750px;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.linkBox {
|
||||||
|
}
|
||||||
|
|
||||||
|
.imageBox {
|
||||||
|
margin-top: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
|
||||||
|
.window-body{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
height: 8rem;
|
||||||
|
width: 8rem;
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -6,6 +6,9 @@
|
||||||
<link rel="canonical" href="{{ $page->getUrl() }}">
|
<link rel="canonical" href="{{ $page->getUrl() }}">
|
||||||
<meta name="description" content="{{ $page->description }}">
|
<meta name="description" content="{{ $page->description }}">
|
||||||
<title>{{ $page->author . " | " . $page->title }}</title>
|
<title>{{ $page->author . " | " . $page->title }}</title>
|
||||||
|
@if ($page->design == '98')
|
||||||
|
<link rel="stylesheet" href="https://unpkg.com/98.css" />
|
||||||
|
@endif
|
||||||
<link rel="stylesheet" href="{{ mix('css/'. $page->design. '.css', 'assets/build') }}">
|
<link rel="stylesheet" href="{{ mix('css/'. $page->design. '.css', 'assets/build') }}">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
||||||
44
source/_partials/98.blade.php
Normal file
44
source/_partials/98.blade.php
Normal file
|
|
@ -0,0 +1,44 @@
|
||||||
|
<!-- _partials/default.blade.php -->
|
||||||
|
<div class="mainContainer">
|
||||||
|
<div class="window imageBox">
|
||||||
|
<div class="title-bar">
|
||||||
|
<span class="title-bar-text">ImageViewer.exe</span>
|
||||||
|
<div class="title-bar-controls">
|
||||||
|
<button aria-label="Minimize"></button>
|
||||||
|
<button aria-label="Restore"></button>
|
||||||
|
<button aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="window-body">
|
||||||
|
<img src="{{ 'assets/images/' . $page->imageName }}">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="window linkBox">
|
||||||
|
<div class="title-bar">
|
||||||
|
<span class="title-bar-text">{{$page->author}}.exe</span>
|
||||||
|
<div class="title-bar-controls">
|
||||||
|
<button aria-label="Minimize"></button>
|
||||||
|
<button aria-label="Restore"></button>
|
||||||
|
<button aria-label="Close"></button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="window-body">
|
||||||
|
<p>Here you can find all my awesome links:</p>
|
||||||
|
<div>
|
||||||
|
<div class="field-row-stacked alignMiddle">
|
||||||
|
@foreach ($page->links as $link)
|
||||||
|
@if (isset($link['text']) && isset($link['color']))
|
||||||
|
<a href="{{$link->link}}" class="{{strtolower($link->color)}}"><button>{{ ucwords($link->text) }}</button></a>
|
||||||
|
@elseif (!isset($link['text']) && isset($link['color']))
|
||||||
|
<a href="{{$link->link}}" class="{{strtolower($link->color)}}"><button>{{ ucwords($link->platform) }}</button></a>
|
||||||
|
@elseif (isset($link['text']) && !isset($link['color']))
|
||||||
|
<a href="{{$link->link}}"><button>{{ ucwords($link->text) }}</button></a>
|
||||||
|
@else
|
||||||
|
<a href="{{$link->link}}"><button>{{ ucwords($link->platform) }}</button></a>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
26
source/_partials/default.blade.php
Normal file
26
source/_partials/default.blade.php
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
<!-- _partials/default.blade.php -->
|
||||||
|
<div class="mainContainer">
|
||||||
|
<img src="{{ 'assets/images/' . $page->imageName }}">
|
||||||
|
<h1 class="">{{ $page->author }}</h1>
|
||||||
|
<div class="linkBox">
|
||||||
|
@foreach ($page->links as $link)
|
||||||
|
@if (isset($link['text']) && isset($link['color']))
|
||||||
|
<a href="{{$link->link}}" class="{{strtolower($link->color)}}">
|
||||||
|
{{ strtoupper($link->text) }}
|
||||||
|
</a>
|
||||||
|
@elseif (!isset($link['text']) && isset($link['color']))
|
||||||
|
<a href="{{$link->link}}" class="{{strtolower($link->color)}}">
|
||||||
|
{{ strtoupper($link->platform) }}
|
||||||
|
</a>
|
||||||
|
@elseif (isset($link['text']) && !isset($link['color']))
|
||||||
|
<a href="{{$link->link}}">
|
||||||
|
{{ strtoupper($link->text) }}
|
||||||
|
</a>
|
||||||
|
@else
|
||||||
|
<a href="{{$link->link}}">
|
||||||
|
{{ strtoupper($link->platform) }}
|
||||||
|
</a>
|
||||||
|
@endif
|
||||||
|
@endforeach
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -1,29 +1,9 @@
|
||||||
@extends('_layouts.main')
|
@extends('_layouts.main')
|
||||||
|
|
||||||
@section('body')
|
@section('body')
|
||||||
<div class="mainContainer">
|
@if ($page->design == '98')
|
||||||
<img src="{{ 'assets/images/' . $page->imageName }}">
|
@include('_partials/98')
|
||||||
<h1 class="">{{ $page->author }}</h1>
|
@else
|
||||||
<div class="linkBox">
|
@include('_partials/default')
|
||||||
@foreach ($page->links as $link)
|
@endif
|
||||||
@if (isset($link['text']) && isset($link['color']))
|
|
||||||
<a href="{{$link->link}}" class="{{strtolower($link->color)}}">
|
|
||||||
{{ strtoupper($link->text) }}
|
|
||||||
</a>
|
|
||||||
@elseif (!isset($link['text']) && isset($link['color']))
|
|
||||||
<a href="{{$link->link}}" class="{{strtolower($link->color)}}">
|
|
||||||
{{ strtoupper($link->platform) }}
|
|
||||||
</a>
|
|
||||||
@elseif (isset($link['text']) && !isset($link['color']))
|
|
||||||
<a href="{{$link->link}}">
|
|
||||||
{{ strtoupper($link->text) }}
|
|
||||||
</a>
|
|
||||||
@else
|
|
||||||
<a href="{{$link->link}}">
|
|
||||||
{{ strtoupper($link->platform) }}
|
|
||||||
</a>
|
|
||||||
@endif
|
|
||||||
@endforeach
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
@endsection
|
@endsection
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@ mix.setPublicPath('source/assets/build');
|
||||||
mix.jigsaw()
|
mix.jigsaw()
|
||||||
.sass('source/_assets/sass/main.scss', 'css')
|
.sass('source/_assets/sass/main.scss', 'css')
|
||||||
.sass('source/_assets/sass/blurywhite.scss', 'css')
|
.sass('source/_assets/sass/blurywhite.scss', 'css')
|
||||||
|
.sass('source/_assets/sass/98.scss', 'css')
|
||||||
.options({
|
.options({
|
||||||
processCssUrls: false,
|
processCssUrls: false,
|
||||||
})
|
})
|
||||||
|
|
|
||||||
Reference in a new issue