forked from crunk/distribusi-verse
35 changed files with 111 additions and 805 deletions
@ -0,0 +1,22 @@ |
|||
.redistribusi { |
|||
position: sticky; |
|||
position: -webkit-sticky; /* Safari */ |
|||
top: 1em; |
|||
width: 15em; |
|||
border-style: outset; |
|||
} |
|||
|
|||
.distribusi_file { |
|||
margin-top: 1em; |
|||
padding: 0.5em; |
|||
width: 45em; |
|||
background-color:#fdfdfd; |
|||
text-decoration: none; |
|||
scroll-behavior: smooth; |
|||
border-style: outset; |
|||
} |
|||
|
|||
.distribusi_file > img, video { |
|||
max-width: 100%; |
|||
max-height: 100%; |
|||
} |
|||
@ -0,0 +1,29 @@ |
|||
#publicthemes > ul { |
|||
max-height: 20em; |
|||
overflow: auto; |
|||
} |
|||
|
|||
#publicthemes > ul > li{ |
|||
word-break: break-all; |
|||
} |
|||
|
|||
.workflow{ |
|||
margin-top: 1em; |
|||
padding: 0.5em; |
|||
background-color:#fdfdfd; |
|||
text-decoration: none; |
|||
scroll-behavior: smooth; |
|||
border-style: outset; |
|||
} |
|||
|
|||
.workflow > p { |
|||
padding-left: 1em; |
|||
} |
|||
|
|||
.workflow > h2 { |
|||
padding-left: 0.4em;; |
|||
} |
|||
|
|||
.workflow input{ |
|||
max-width: 20em; |
|||
} |
|||
@ -1,69 +0,0 @@ |
|||
/* Dropdown Button */ |
|||
/* for sorting on year and category |
|||
*/ |
|||
button { |
|||
background-color: #E0B0FF; |
|||
text-decoration: none; |
|||
border: none; |
|||
} |
|||
.filter { |
|||
display: none; |
|||
} |
|||
|
|||
.activebtn { |
|||
background-color: #62b264; |
|||
} |
|||
|
|||
.show { |
|||
display: block; |
|||
} |
|||
.dropdown { |
|||
position: relative; |
|||
display: inline-block; |
|||
} |
|||
|
|||
/* Dropdown Content (Hidden by Default) */ |
|||
.dropdown-content { |
|||
display: none; |
|||
position: absolute; |
|||
background-color: #E0B0FF; |
|||
min-width: 120px; |
|||
border: 2px solid; |
|||
z-index: 1; |
|||
border-style: outset; |
|||
} |
|||
|
|||
/* Links inside the dropdown */ |
|||
.dropdown-content button { |
|||
color: black; |
|||
padding: 6px; |
|||
border: none; |
|||
min-width: inherit; |
|||
text-align: left; |
|||
text-decoration: none; |
|||
display: block; |
|||
} |
|||
.dropbtn { |
|||
margin-top: 1em; |
|||
} |
|||
/* Change color of dropdown links on hover */ |
|||
.dropdown-content button:hover {background-color: #62b264;} |
|||
|
|||
|
|||
/* Show the dropdown menu on hover */ |
|||
.dropdown:hover .dropdown-content {display: block;} |
|||
|
|||
/* Change the background color of the dropdown button when the dropdown content is shown */ |
|||
.dropdown:hover .dropbtn {background-color: #62b264;} |
|||
|
|||
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { |
|||
.dropdown-content button { |
|||
font-size: 0.7em; |
|||
} |
|||
.container > button { |
|||
font-size: 0.7em; |
|||
} |
|||
.dropdown > button { |
|||
font-size: 0.7em; |
|||
} |
|||
} |
|||
@ -1,50 +0,0 @@ |
|||
.editareas { |
|||
margin: auto; |
|||
display: flex; |
|||
justify-content: flex-start; |
|||
} |
|||
.editarea { |
|||
width: 30%; |
|||
border: 3px solid #E0B0FF; |
|||
border-style: outset; |
|||
margin-right: 1em; |
|||
margin-left: 0; |
|||
} |
|||
|
|||
.editor { |
|||
min-width: 35%; |
|||
} |
|||
.editform { |
|||
width: 100%%; |
|||
margin: 0 auto; |
|||
} |
|||
#editorsubmitform { |
|||
padding-top: 1em; |
|||
} |
|||
.required label { |
|||
display: block; |
|||
padding-bottom: 2px; |
|||
width: 100% |
|||
} |
|||
textarea { |
|||
width: 100%; |
|||
height: 100%; |
|||
box-sizing: border-box; |
|||
min-height: 250px; |
|||
background: #E0B0FF; |
|||
outline: none; |
|||
font-family: Courier, sans-serif; |
|||
font-size: 16px; |
|||
} |
|||
|
|||
iframe { |
|||
bottom: 0; |
|||
position: relative; |
|||
margin-top: 1em; |
|||
width: 100%; |
|||
height: 30em; |
|||
} |
|||
#html { |
|||
background-color: #60337F; |
|||
color: lightgrey; |
|||
} |
|||
@ -0,0 +1,22 @@ |
|||
div#login{ |
|||
width: 30%; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
background-color:#fdfdfd; |
|||
text-decoration: none; |
|||
} |
|||
|
|||
div#login form { |
|||
width: 24em; |
|||
margin: 0 auto; |
|||
padding-left: 15%; |
|||
padding-right: 15%; |
|||
} |
|||
|
|||
input[type=text], input[type=password], input[type=file] { |
|||
color: #091411; |
|||
width: 18em; |
|||
max-width: 18em; |
|||
background-color: #fdfdfd; |
|||
border: 1px solid #9de457; |
|||
} |
|||
@ -1,53 +0,0 @@ |
|||
.selector-style { |
|||
padding: 0; |
|||
width: 20em; |
|||
max-width: 20em; |
|||
position: relative; |
|||
border: none; |
|||
background: #E0B0FF; |
|||
text-decoration: none; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
margin: 1px; |
|||
} |
|||
|
|||
.selector-style select { |
|||
padding: 0.2em 0.2em; |
|||
width: 20em; |
|||
max-width: 20em; |
|||
border: none; |
|||
box-shadow: none; |
|||
background-color: #E0B0FF; |
|||
background-image: none; |
|||
-webkit-appearance: none; |
|||
-moz-appearance: none; |
|||
appearance: none; |
|||
} |
|||
|
|||
.selector-style:after { |
|||
top: 50%; |
|||
left: 95%; |
|||
border: solid; |
|||
content: " "; |
|||
height: 0; |
|||
width: 0; |
|||
position: absolute; |
|||
pointer-events: none; |
|||
border-color: rgba(0, 0, 0, 0); |
|||
border-top-color: #000000; |
|||
margin-top: -2px; |
|||
z-index: 100; |
|||
} |
|||
select.selector option{ |
|||
color: white; |
|||
background-color: #60337F; |
|||
padding: 0 10px; |
|||
} |
|||
|
|||
.selector-style select:focus { |
|||
outline: none; |
|||
} |
|||
.selector-style select option:hover { |
|||
background: #60337F; |
|||
} |
|||
@ -1,281 +0,0 @@ |
|||
body |
|||
{ |
|||
font-family: monospace, monospace; |
|||
font-size: 15px; |
|||
background-color: #fdfdfd; |
|||
color:#29d148; |
|||
word-wrap: break-word; |
|||
line-height: 1.1; |
|||
} |
|||
|
|||
div#login{ |
|||
width: 30%; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
background-color:#fdfdfd; |
|||
text-decoration: none; |
|||
} |
|||
|
|||
div#login form { |
|||
width: 24em; |
|||
margin: 0 auto; |
|||
padding-left: 15%; |
|||
padding-right: 15%; |
|||
} |
|||
|
|||
input[type=text], input[type=password], input[type=file] { |
|||
color: #C397DF; |
|||
width: 18em; |
|||
max-width: 18em; |
|||
background-color: #fdfdfd; |
|||
border: 1px solid #E0B0FF; |
|||
} |
|||
|
|||
div#upload form { |
|||
padding-right: 15%; |
|||
} |
|||
|
|||
.workflow{ |
|||
margin-top: 1em; |
|||
padding: 0.5em; |
|||
padding-left: auto; |
|||
padding-right: auto; |
|||
width: 31em; |
|||
background-color:#fdfdfd; |
|||
text-decoration: none; |
|||
scroll-behavior: smooth; |
|||
border-style: outset; |
|||
} |
|||
.workflow > p { |
|||
padding-left: 1em; |
|||
} |
|||
.workflow > h2 { |
|||
padding-left: 0.4em;; |
|||
} |
|||
|
|||
.workflow input{ |
|||
max-width: 20em; |
|||
} |
|||
|
|||
#mainworkflow |
|||
{ |
|||
width: 30em; |
|||
margin:0 auto; |
|||
} |
|||
|
|||
#distribusiverse { |
|||
margin-bottom: 11em; |
|||
} |
|||
#distribusi-index { |
|||
padding-left: 1em; |
|||
} |
|||
|
|||
div#buttons{ |
|||
position: fixed; |
|||
top: 0.5em; |
|||
right: 0.5em; |
|||
display:flex; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
div#buttons .distribusi input{ |
|||
border: none; |
|||
background: #fff600; |
|||
text-decoration: none; |
|||
margin: 0.2em; |
|||
} |
|||
div#buttons .distribusi input:hover{ |
|||
background: #ffbf00; |
|||
|
|||
} |
|||
fieldset.required { |
|||
border: none; |
|||
} |
|||
|
|||
fieldset.required > ul { |
|||
padding-left: 0px; |
|||
} |
|||
|
|||
fieldset.required > ul > li{ |
|||
list-style-type: none; |
|||
} |
|||
fieldset.tagfield > input { |
|||
width: 100%; |
|||
max-width: 100%; |
|||
} |
|||
#publicthemes > ul { |
|||
max-height: 20em; |
|||
overflow: auto; |
|||
} |
|||
#publicthemes > ul > li{ |
|||
word-break: break-all; |
|||
} |
|||
|
|||
input { |
|||
border: none; |
|||
background: #E0B0FF; |
|||
text-decoration: none; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
overflow: hidden; |
|||
margin: 0.2em; |
|||
} |
|||
|
|||
input:hover { |
|||
background: #60337F; |
|||
} |
|||
|
|||
input[type="submit"]:disabled:hover, |
|||
input[type="submit"]:disabled, |
|||
input[type="submit"]:disabled:focus { |
|||
background-color: #2D3039; |
|||
color: #d28cff; |
|||
} |
|||
|
|||
.error { |
|||
font-size: 110%; |
|||
color: #F92020; |
|||
} |
|||
|
|||
#delete { |
|||
color: black; |
|||
background-color: #F92020; |
|||
} |
|||
|
|||
#update { |
|||
color: black; |
|||
background-color: #62b264; |
|||
} |
|||
|
|||
|
|||
/* unvisited link */ |
|||
a:link { |
|||
color: #fff600; |
|||
} |
|||
|
|||
/* visited link */ |
|||
a:visited { |
|||
color: #d28cff; |
|||
} |
|||
|
|||
/* mouse over link */ |
|||
a:hover { |
|||
color: #60337F; |
|||
} |
|||
|
|||
/* selected link */ |
|||
a:active { |
|||
color: white; |
|||
} |
|||
|
|||
/* STOLEN GOODS */ |
|||
#fancyboi::before { |
|||
content: "$ "; |
|||
} |
|||
|
|||
@media (prefers-reduced-motion: no-preference) { |
|||
@keyframes flash { |
|||
50% { opacity: 0; } |
|||
} |
|||
@keyframes reveal { |
|||
from { width: 2em; } /* Width of ::before */ |
|||
to { width: 55%; } |
|||
} |
|||
#fancyboi { |
|||
width: 55%; |
|||
padding: 0.5em; |
|||
overflow: hidden; |
|||
white-space: nowrap; |
|||
animation: reveal 4s linear; |
|||
text-overflow: "█"; |
|||
background-color: #2D3039; |
|||
} |
|||
#fancyboi::after { |
|||
content: "█"; |
|||
animation: flash 0.5s step-end infinite; |
|||
} |
|||
} |
|||
|
|||
div.maincontent{ |
|||
width: 55%; |
|||
border: 3px #E0B0FF; |
|||
margin-top: 0.5em; |
|||
padding: 0.5em; |
|||
border-style: outset; |
|||
} |
|||
|
|||
.tags{ |
|||
background-color: #000; |
|||
color: #fff; |
|||
display: inline-block; |
|||
padding-left: 4px; |
|||
padding-right: 4px; |
|||
text-align: center; |
|||
margin: 1px; |
|||
} |
|||
|
|||
.searched { |
|||
background: #fff600 !important; |
|||
color: black !important; |
|||
} |
|||
|
|||
.tooltip { |
|||
position: relative; |
|||
display: inline-block; |
|||
border-bottom: 1px dotted black; |
|||
} |
|||
|
|||
.tooltip .tooltiptext { |
|||
visibility: hidden; |
|||
width: 120px; |
|||
background-color: black; |
|||
color: #fff; |
|||
text-align: center; |
|||
padding: 5px 0; |
|||
position: absolute; |
|||
z-index: 1; |
|||
bottom: 100%; |
|||
left: 50%; |
|||
margin-left: -60px; |
|||
|
|||
/* Fade in tooltip - takes 1 second to go from 0% to 100% opac: */ |
|||
opacity: 0; |
|||
transition: opacity 2s; |
|||
} |
|||
|
|||
.tooltip:hover .tooltiptext { |
|||
visibility: visible; |
|||
opacity: 1; |
|||
} |
|||
|
|||
.code-example { |
|||
width: 100%; |
|||
color: black; |
|||
padding: 1em; |
|||
box-sizing: border-box; |
|||
background: #E0B0FF; |
|||
outline: none; |
|||
font-family: Courier, sans-serif; |
|||
font-size: 16px; |
|||
} |
|||
/* |
|||
Project colors so far. |
|||
light |
|||
#E0B0FF |
|||
medium |
|||
#d28cff |
|||
dark |
|||
#60337F |
|||
|
|||
background dark |
|||
#2D3039 |
|||
|
|||
yellow important |
|||
#fff600 |
|||
|
|||
red: danger |
|||
ff5a5a |
|||
backgrounds |
|||
*/ |
|||
@ -1,6 +0,0 @@ |
|||
This favicon was generated using the following font: |
|||
|
|||
- Font Title: Klee One |
|||
- Font Author: Copyright 2020 The Klee Project Authors (https://github.com/fontworks-fonts/Klee) |
|||
- Font Source: http://fonts.gstatic.com/s/kleeone/v5/LDIxapCLNRc6A8oT4q4AOeekWPrP.ttf |
|||
- Font License: SIL Open Font License, 1.1 (http://scripts.sil.org/OFL)) |
|||
|
Before Width: | Height: | Size: 5.4 KiB |
|
Before Width: | Height: | Size: 12 KiB |
|
Before Width: | Height: | Size: 4.3 KiB |
|
Before Width: | Height: | Size: 322 B |
|
Before Width: | Height: | Size: 666 B |
|
Before Width: | Height: | Size: 15 KiB |
@ -1 +0,0 @@ |
|||
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"} |
|||
@ -1,92 +0,0 @@ |
|||
filterSelection("all", "None"); |
|||
function filterSelection(c, name, id) { |
|||
resetDropDownButtons(); |
|||
var i; |
|||
var button = document.getElementById(id); |
|||
if(button){ |
|||
button.innerText = name; |
|||
addClass(button, "activebtn"); |
|||
} |
|||
var alldistribusis = document.getElementsByClassName("filter"); |
|||
if (c == "all") { |
|||
for (i = 0; i < alldistribusis.length; i++) { |
|||
addClass(alldistribusis[i], "show"); |
|||
} |
|||
} |
|||
else { |
|||
for (i = 0; i < alldistribusis.length; i++) { |
|||
removeClass(alldistribusis[i], "show"); |
|||
if (alldistribusis[i].className.indexOf(c) > -1) { |
|||
addClass(alldistribusis[i], "show"); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
function resetDropDownButtons(){ |
|||
document.getElementById("Year").innerText = "Year"; |
|||
document.getElementById("Category").innerText = "Category"; |
|||
allactivebuttons = document.getElementsByClassName("activebtn"); |
|||
for(var i = 0;allactivebuttons.length; i++) { |
|||
removeClass(allactivebuttons[i], "activebtn"); |
|||
} |
|||
} |
|||
function addClass(element, name) { |
|||
var i, arr1, arr2; |
|||
arr1 = element.className.split(" "); |
|||
arr2 = name.split(" "); |
|||
for (i = 0; i < arr2.length; i++) { |
|||
if (arr1.indexOf(arr2[i]) == -1) {element.className += " " + arr2[i];} |
|||
} |
|||
} |
|||
|
|||
function removeClass(element, name) { |
|||
var i, arr1, arr2; |
|||
arr1 = element.className.split(" "); |
|||
arr2 = name.split(" "); |
|||
for (i = 0; i < arr2.length; i++) { |
|||
while (arr1.indexOf(arr2[i]) > -1) { |
|||
arr1.splice(arr1.indexOf(arr2[i]), 1); |
|||
} |
|||
} |
|||
element.className = arr1.join(" "); |
|||
} |
|||
|
|||
|
|||
let searchInput = document.getElementById('tagsearch'); |
|||
let timeout = null; |
|||
// Listen for keystroke events
|
|||
searchInput.addEventListener('keyup', function (e) { |
|||
// Clear the timeout if it has already been set.
|
|||
clearTimeout(timeout); |
|||
// Make a new timeout set to go off in 1000ms (1 second)
|
|||
timeout = setTimeout(function () { |
|||
console.log('Input Value:', searchInput.value); |
|||
if (searchInput.value.length > 2) { |
|||
searchTags(searchInput.value); |
|||
} else { |
|||
clearSearchTags(); |
|||
} |
|||
}, 1000); |
|||
}); |
|||
|
|||
function searchTags(searchInput) { |
|||
let tag_ele = document.getElementsByClassName('tags'); |
|||
for (var i = 0; i < tag_ele.length; ++i) { |
|||
let searchText = searchInput.toLowerCase().trim(); |
|||
let tagtext = tag_ele[i].innerText.toLowerCase(); |
|||
if(searchText.includes(tagtext) || tagtext.includes(searchText)) { |
|||
addClass(tag_ele[i], "searched"); |
|||
} |
|||
else { |
|||
removeClass(tag_ele[i], "searched"); |
|||
} |
|||
} |
|||
} |
|||
|
|||
function clearSearchTags() { |
|||
let tag_ele = document.getElementsByClassName('tags'); |
|||
for (var i = 0; i < tag_ele.length; ++i) { |
|||
removeClass(tag_ele[i], "searched"); |
|||
} |
|||
} |
|||
@ -1,19 +0,0 @@ |
|||
function update() { |
|||
|
|||
var html = document.getElementById("html"); |
|||
var css = document.getElementById("css"); |
|||
var code = document.getElementById("code").contentWindow.document; |
|||
|
|||
document.body.onkeyup = function(){ |
|||
code.open(); |
|||
code.writeln(html.value+"<style>"+css.value+"</style>"); |
|||
code.close(); |
|||
}; |
|||
document.addEventListener("DOMContentLoaded", function(){ |
|||
code.open(); |
|||
code.writeln(html.value+"<style>"+css.value+"</style>"); |
|||
code.close(); |
|||
}); |
|||
}; |
|||
|
|||
update(); |
|||
@ -1,25 +0,0 @@ |
|||
console.log("everything is still smooth") |
|||
|
|||
function scrollToTheme() { |
|||
var uploadsuccessful = document.getElementById("uploadsuccessful"); |
|||
if(uploadsuccessful){ |
|||
const theme = document.getElementById('theme') |
|||
theme.scrollIntoView({ behavior: 'smooth', block: 'start' }); |
|||
} |
|||
} |
|||
|
|||
function scrollToLaunch() { |
|||
var cssSelected = document.getElementById("cssSelected"); |
|||
if(cssSelected){ |
|||
const launch = document.getElementById('launch') |
|||
launch.scrollIntoView({ behavior: 'smooth', block: 'end' }); |
|||
} |
|||
} |
|||
|
|||
|
|||
document.addEventListener("DOMContentLoaded", scrollToTheme); |
|||
document.addEventListener("DOMContentLoaded", scrollToLaunch); |
|||
|
|||
// function(e) {
|
|||
// (e.keyCode === 13 || e.keyCode === 32) && $(this).trigger("click")
|
|||
// }
|
|||
|
Before Width: | Height: | Size: 4.9 KiB |
|
Before Width: | Height: | Size: 4.1 KiB |
|
Before Width: | Height: | Size: 4.5 KiB |
Loading…
Reference in new issue