Added theme "Stargazer"
This commit is contained in:
Julian Prieber
parent
2028862b92
commit
9f8b865a35
|
|
@ -0,0 +1,198 @@
|
||||||
|
/* ************************************************************* */
|
||||||
|
/*
|
||||||
|
/* Use this file to add custom CSS animations.
|
||||||
|
/* Delete this file if you wish to use the default animations.
|
||||||
|
/* If you do not want to have animations in your theme,
|
||||||
|
/* remove or comment them and include this file in your theme.
|
||||||
|
/*
|
||||||
|
/* ************************************************************* */
|
||||||
|
|
||||||
|
|
||||||
|
/* Table of contents
|
||||||
|
––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
- Entrance animations
|
||||||
|
- Button hover animations
|
||||||
|
- Icon hover animations
|
||||||
|
- Footer hover animations
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/* Entrance animations
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
.button-entrance {
|
||||||
|
animation-name: popUp;
|
||||||
|
animation-duration: 1s;
|
||||||
|
animation-fill-mode: both;
|
||||||
|
/* Used to start button entrance animation one after another */
|
||||||
|
animation-delay: calc(var(--delay)/10);
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes popUp {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scale3d(0.3, 0.3, 0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
50% {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.fadein {
|
||||||
|
animation-name: fadein;
|
||||||
|
animation-duration: 3s;
|
||||||
|
animation-fill-mode: both;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadein {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Button hover animations
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
/* (Also apply to icon) */
|
||||||
|
|
||||||
|
.button-hover{
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
-webkit-transform: perspective(1px) translateZ(0);
|
||||||
|
transform: perspective(1px) translateZ(0);
|
||||||
|
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
|
||||||
|
-webkit-transition-duration: 0.9s;
|
||||||
|
transition-duration: 0.9s;
|
||||||
|
}
|
||||||
|
.button-hover:active,
|
||||||
|
.button-hover:focus,
|
||||||
|
.button-hover:hover{
|
||||||
|
-webkit-transform: scale(1.1);
|
||||||
|
transform: scale(1.1);
|
||||||
|
-webkit-transition-timing-function: cubic-bezier(0.47, 2.7, 0.31, -0.36);
|
||||||
|
transition-timing-function: cubic-bezier(0.47, 2.7, 0.31, -0.36);
|
||||||
|
}
|
||||||
|
|
||||||
|
.credit-hover{
|
||||||
|
display:inline-block;
|
||||||
|
-webkit-transform:perspective(1px) translateZ(0);
|
||||||
|
transform:perspective(1px) translateZ(0);
|
||||||
|
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||||
|
-webkit-transition-duration:.3s;
|
||||||
|
transition-duration:.3s;
|
||||||
|
-webkit-transition-property:transform;
|
||||||
|
transition-property:transform
|
||||||
|
}
|
||||||
|
.credit-hover:active,
|
||||||
|
.credit-hover:focus,
|
||||||
|
.credit-hover:hover{
|
||||||
|
-webkit-transform:scale(1.1);
|
||||||
|
transform:scale(1.1)
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Icon hover animations
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
/* .icon-hover{
|
||||||
|
display:inline-block;
|
||||||
|
-webkit-transform:perspective(1px) translateZ(0);
|
||||||
|
transform:perspective(1px) translateZ(0);
|
||||||
|
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||||
|
-webkit-transition-duration:.3s;
|
||||||
|
transition-duration:.3s
|
||||||
|
}
|
||||||
|
.icon-hover .hvr-icon{
|
||||||
|
-webkit-transform:translateZ(0);
|
||||||
|
transform:translateZ(0)
|
||||||
|
}
|
||||||
|
.icon-hover:active .hvr-icon,.icon-hover:focus .hvr-icon,.icon-hover:hover .hvr-icon{
|
||||||
|
-webkit-animation-name:icon-hover;
|
||||||
|
animation-name:icon-hover;
|
||||||
|
-webkit-animation-duration:1s;
|
||||||
|
animation-duration:1s;
|
||||||
|
-webkit-animation-timing-function:ease-in-out;
|
||||||
|
animation-timing-function:ease-in-out;
|
||||||
|
-webkit-animation-iteration-count:1;
|
||||||
|
animation-iteration-count:1
|
||||||
|
}
|
||||||
|
|
||||||
|
@-webkit-keyframes icon-hover{
|
||||||
|
16.65%{
|
||||||
|
-webkit-transform:translateY(6px);
|
||||||
|
transform:translateY(6px)
|
||||||
|
}
|
||||||
|
33.3%{
|
||||||
|
-webkit-transform:translateY(-5px);
|
||||||
|
transform:translateY(-5px)
|
||||||
|
}
|
||||||
|
49.95%{
|
||||||
|
-webkit-transform:translateY(4px);
|
||||||
|
transform:translateY(4px)
|
||||||
|
}
|
||||||
|
66.6%{
|
||||||
|
-webkit-transform:translateY(-2px);
|
||||||
|
transform:translateY(-2px)
|
||||||
|
}
|
||||||
|
83.25%{
|
||||||
|
-webkit-transform:translateY(1px);
|
||||||
|
transform:translateY(1px)
|
||||||
|
}
|
||||||
|
100%{
|
||||||
|
-webkit-transform:translateY(0);
|
||||||
|
transform:translateY(0)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes icon-hover{
|
||||||
|
16.65%{
|
||||||
|
-webkit-transform:translateY(6px);
|
||||||
|
transform:translateY(6px)
|
||||||
|
}
|
||||||
|
33.3%{
|
||||||
|
-webkit-transform:translateY(-5px);
|
||||||
|
transform:translateY(-5px)
|
||||||
|
}
|
||||||
|
49.95%{
|
||||||
|
-webkit-transform:translateY(4px);
|
||||||
|
transform:translateY(4px)
|
||||||
|
}
|
||||||
|
66.6%{
|
||||||
|
-webkit-transform:translateY(-2px);
|
||||||
|
transform:translateY(-2px)
|
||||||
|
}
|
||||||
|
83.25%{
|
||||||
|
-webkit-transform:translateY(1px);
|
||||||
|
transform:translateY(1px)
|
||||||
|
}
|
||||||
|
100%{
|
||||||
|
-webkit-transform:translateY(0);
|
||||||
|
transform:translateY(0)
|
||||||
|
}
|
||||||
|
} */
|
||||||
|
|
||||||
|
|
||||||
|
/* Footer hover animations
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
.footer-hover{
|
||||||
|
display:inline-block;
|
||||||
|
-webkit-transform:perspective(1px) translateZ(0);
|
||||||
|
transform:perspective(1px) translateZ(0);
|
||||||
|
box-shadow:0 0 1px rgba(0,0,0,0);
|
||||||
|
-webkit-transition-duration:.3s;
|
||||||
|
transition-duration:.3s;
|
||||||
|
-webkit-transition-property:transform;
|
||||||
|
transition-property:transform;
|
||||||
|
-webkit-transition-timing-function:ease-out;
|
||||||
|
transition-timing-function:ease-out
|
||||||
|
}
|
||||||
|
.footer-hover:active,.footer-hover:focus,.footer-hover:hover{
|
||||||
|
-webkit-transform:translateY(-8px);
|
||||||
|
transform:translateY(-8px)
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,75 @@
|
||||||
|
|
||||||
|
/* Table of contents
|
||||||
|
––––––––––––––––––––––––––––––––––––––––––––––––––
|
||||||
|
|
||||||
|
- Rounded user avatars
|
||||||
|
- Buttons
|
||||||
|
- Brand Styles
|
||||||
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
/* Rounded avatars
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
/* Disable this if you don't want rounded avatars for users */
|
||||||
|
.rounded-avatar {
|
||||||
|
border-radius: 50%;
|
||||||
|
-webkit-box-shadow: 0px 0px 0px 3px #ffffff;
|
||||||
|
box-shadow: 0px 0px 0px 3px #ffffff;
|
||||||
|
background-color: #ffffff !important;
|
||||||
|
width: 150px;
|
||||||
|
height: 150px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Buttons
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
:root {
|
||||||
|
/* violet */
|
||||||
|
--primary-color: 111, 76, 255;
|
||||||
|
|
||||||
|
/* white */
|
||||||
|
--text-color: 256, 256, 256;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
font-family: 'DM Sans', sans-serif;
|
||||||
|
font-size: 18px;
|
||||||
|
padding: 12px 32px;
|
||||||
|
margin: 1rem;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-radius: 50px;
|
||||||
|
color: rgba(var(--text-color));
|
||||||
|
border: 2px double transparent;
|
||||||
|
background-image: linear-gradient(rgb(13, 14, 33), rgb(13, 14, 33)), radial-gradient(circle at left top, rgb(1, 110, 218), rgb(217, 0, 192));
|
||||||
|
background-origin: border-box;
|
||||||
|
background-clip: padding-box, border-box;
|
||||||
|
max-width: 300px;
|
||||||
|
width: 70%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button:hover {
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
box-shadow: rgba(var(--primary-color), 0.5) 0px 0px 20px 0px;
|
||||||
|
color: rgba(var(--text-color));
|
||||||
|
opacity: 0.85;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* Brand Icons
|
||||||
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
padding: 0px 8px 3.5px 0px;
|
||||||
|
/* position: absolute;
|
||||||
|
left: 20px;
|
||||||
|
top: 15px; */
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
return [
|
||||||
|
|
||||||
|
/*
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
| Theme Config
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
|
|
||||||
|
| Description.
|
||||||
|
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
// Some themes may not be compatible with custom buttons created by the Button Editor.
|
||||||
|
// If 'false' the default button CSS is used.
|
||||||
|
'allow_custom_buttons' => 'false',
|
||||||
|
|
||||||
|
'open_links_in_same_tab' => 'false',
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
| Custom Code
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
|
|
||||||
|
| Description.
|
||||||
|
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
'enable_custom_code' => 'false',
|
||||||
|
|
||||||
|
// Disable individual files (only applies if above is 'true').
|
||||||
|
'enable_custom_head' => 'true',
|
||||||
|
'enable_custom_body' => 'true',
|
||||||
|
'enable_custom_body_end' => 'true',
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
| Custom Icons
|
||||||
|
|--------------------------------------------------------------------------
|
||||||
|
|
|
||||||
|
| Description.
|
||||||
|
|
|
||||||
|
*/
|
||||||
|
|
||||||
|
'use_custom_icons' => 'false',
|
||||||
|
|
||||||
|
// Is not set correct this will cause errors.
|
||||||
|
'custom_icon_extension' => '.svg', // (.png, .jpg ...)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
];
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 141 KiB |
|
|
@ -0,0 +1,26 @@
|
||||||
|
# A LittleLink Custom Theme
|
||||||
|
Find more themes: https://github.com/JulianPrieber/llc-themes
|
||||||
|
|
||||||
|
* Theme Name: Stargazer
|
||||||
|
* Theme Version: 1.1
|
||||||
|
* Theme Date: 2022-09-01
|
||||||
|
* Theme Author: JulianPrieber
|
||||||
|
* Theme Author URI: https://github.com/JulianPrieber
|
||||||
|
* Theme License: GPLv3
|
||||||
|
|
||||||
|
## Preview:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### Used assets:
|
||||||
|
* Built using:
|
||||||
|
* https://github.com/dhg/Skeleton
|
||||||
|
* License: MIT
|
||||||
|
|
||||||
|
* Built using:
|
||||||
|
* https://codepen.io/SuneBear/pen/YzVgebG
|
||||||
|
* License: MIT
|
||||||
|
|
||||||
|
* Built using:
|
||||||
|
* https://codepen.io/trishalim/pen/WNEOdWK
|
||||||
|
* License: MIT
|
||||||
|
|
@ -0,0 +1,84 @@
|
||||||
|
.share-icon {
|
||||||
|
padding: 0px 8px 3.5px 0px;
|
||||||
|
vertical-align: middle;
|
||||||
|
color: #FFF !important;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sharediv {
|
||||||
|
position:relative;
|
||||||
|
top: 30px;
|
||||||
|
right: 30px;
|
||||||
|
padding-bottom: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toastdiv {
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: flex;
|
||||||
|
-webkit-align-items: center;
|
||||||
|
align-items: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toastbox {
|
||||||
|
width: 280px;
|
||||||
|
padding: 10px;
|
||||||
|
background-color: rgba(0, 0, 0, 0.7);
|
||||||
|
color: white;
|
||||||
|
border-radius: 4px;
|
||||||
|
position: fixed;
|
||||||
|
top: 105%;
|
||||||
|
-webkit-transition: transform 0.3s linear;
|
||||||
|
transition: transform 0.3s linear;
|
||||||
|
z-index: 2;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.toastbox.toast-tox--active {
|
||||||
|
-webkit-transform: translateY(-150px);
|
||||||
|
transform: translateY(-150px);
|
||||||
|
}
|
||||||
|
.sharebutton,
|
||||||
|
sharebutton {
|
||||||
|
display: inline-block;
|
||||||
|
/* height: 48px; */
|
||||||
|
text-align: center;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 24px;
|
||||||
|
/* line-height: 48px; */
|
||||||
|
scale: 2;
|
||||||
|
border-radius: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #FFF;
|
||||||
|
background-color: rgb(1, 110, 218);
|
||||||
|
background-image: linear-gradient(315deg, rgb(1, 110, 218), rgb(217, 0, 192));
|
||||||
|
}
|
||||||
|
|
||||||
|
sharebutton:hover,
|
||||||
|
.sharebutton:hover {
|
||||||
|
color: #FFF;
|
||||||
|
opacity: 0.85;
|
||||||
|
opacity: 1 !important;
|
||||||
|
filter: alpha(opacity=40);
|
||||||
|
border-color: #888;
|
||||||
|
outline: 0; }
|
||||||
|
.sharebutton.sharebutton-primary {
|
||||||
|
color: #FFFFFF;
|
||||||
|
filter: brightness(90%) }
|
||||||
|
.sharebutton.sharebutton-primary:hover,
|
||||||
|
.sharebutton.sharebutton-primary:focus {
|
||||||
|
color: #FFFFFF;
|
||||||
|
filter: brightness(90%) }
|
||||||
|
|
||||||
|
|
||||||
|
.sharebutton-mb {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.sharebutton-img {
|
||||||
|
position: relative;
|
||||||
|
left: 5px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue