[CSS] Complete re-organization of stylesheets.
@ -1,304 +0,0 @@
|
||||
/*!
|
||||
* Cropper.js v1.5.11
|
||||
* https://fengyuanchen.github.io/cropperjs
|
||||
*
|
||||
* Copyright 2015-present Chen Fengyuan
|
||||
* Released under the MIT license
|
||||
*
|
||||
* Date: 2021-02-17T11:53:21.992Z
|
||||
*/
|
||||
|
||||
.cropper-container {
|
||||
direction: ltr;
|
||||
font-size: 0;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
-ms-touch-action: none;
|
||||
touch-action: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.cropper-container img {
|
||||
display: block;
|
||||
height: 100%;
|
||||
image-orientation: 0deg;
|
||||
max-height: none !important;
|
||||
max-width: none !important;
|
||||
min-height: 0 !important;
|
||||
min-width: 0 !important;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cropper-wrap-box,
|
||||
.cropper-canvas,
|
||||
.cropper-drag-box,
|
||||
.cropper-crop-box,
|
||||
.cropper-modal {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.cropper-wrap-box,
|
||||
.cropper-canvas {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.cropper-drag-box {
|
||||
background-color: #fff;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.cropper-modal {
|
||||
background-color: #000;
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
.cropper-view-box {
|
||||
display: block;
|
||||
height: 100%;
|
||||
outline: 1px solid #39f;
|
||||
outline-color: rgba(51, 153, 255, 0.75);
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cropper-dashed {
|
||||
border: 0 dashed #eee;
|
||||
display: block;
|
||||
opacity: 0.5;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.cropper-dashed.dashed-h {
|
||||
border-bottom-width: 1px;
|
||||
border-top-width: 1px;
|
||||
height: calc(100% / 3);
|
||||
left: 0;
|
||||
top: calc(100% / 3);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cropper-dashed.dashed-v {
|
||||
border-left-width: 1px;
|
||||
border-right-width: 1px;
|
||||
height: 100%;
|
||||
left: calc(100% / 3);
|
||||
top: 0;
|
||||
width: calc(100% / 3);
|
||||
}
|
||||
|
||||
.cropper-center {
|
||||
display: block;
|
||||
height: 0;
|
||||
left: 50%;
|
||||
opacity: 0.75;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.cropper-center::before,
|
||||
.cropper-center::after {
|
||||
background-color: #eee;
|
||||
content: ' ';
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.cropper-center::before {
|
||||
height: 1px;
|
||||
left: -3px;
|
||||
top: 0;
|
||||
width: 7px;
|
||||
}
|
||||
|
||||
.cropper-center::after {
|
||||
height: 7px;
|
||||
left: 0;
|
||||
top: -3px;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.cropper-face,
|
||||
.cropper-line,
|
||||
.cropper-point {
|
||||
display: block;
|
||||
height: 100%;
|
||||
opacity: 0.1;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cropper-face {
|
||||
background-color: #fff;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.cropper-line {
|
||||
background-color: #39f;
|
||||
}
|
||||
|
||||
.cropper-line.line-e {
|
||||
cursor: ew-resize;
|
||||
right: -3px;
|
||||
top: 0;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
.cropper-line.line-n {
|
||||
cursor: ns-resize;
|
||||
height: 5px;
|
||||
left: 0;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.cropper-line.line-w {
|
||||
cursor: ew-resize;
|
||||
left: -3px;
|
||||
top: 0;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
.cropper-line.line-s {
|
||||
bottom: -3px;
|
||||
cursor: ns-resize;
|
||||
height: 5px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.cropper-point {
|
||||
background-color: #39f;
|
||||
height: 5px;
|
||||
opacity: 0.75;
|
||||
width: 5px;
|
||||
}
|
||||
|
||||
.cropper-point.point-e {
|
||||
cursor: ew-resize;
|
||||
margin-top: -3px;
|
||||
right: -3px;
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
.cropper-point.point-n {
|
||||
cursor: ns-resize;
|
||||
left: 50%;
|
||||
margin-left: -3px;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.cropper-point.point-w {
|
||||
cursor: ew-resize;
|
||||
left: -3px;
|
||||
margin-top: -3px;
|
||||
top: 50%;
|
||||
}
|
||||
|
||||
.cropper-point.point-s {
|
||||
bottom: -3px;
|
||||
cursor: s-resize;
|
||||
left: 50%;
|
||||
margin-left: -3px;
|
||||
}
|
||||
|
||||
.cropper-point.point-ne {
|
||||
cursor: nesw-resize;
|
||||
right: -3px;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.cropper-point.point-nw {
|
||||
cursor: nwse-resize;
|
||||
left: -3px;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
.cropper-point.point-sw {
|
||||
bottom: -3px;
|
||||
cursor: nesw-resize;
|
||||
left: -3px;
|
||||
}
|
||||
|
||||
.cropper-point.point-se {
|
||||
bottom: -3px;
|
||||
cursor: nwse-resize;
|
||||
height: 20px;
|
||||
opacity: 1;
|
||||
right: -3px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.cropper-point.point-se {
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.cropper-point.point-se {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.cropper-point.point-se {
|
||||
height: 5px;
|
||||
opacity: 0.75;
|
||||
width: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.cropper-point.point-se::before {
|
||||
background-color: #39f;
|
||||
bottom: -50%;
|
||||
content: ' ';
|
||||
display: block;
|
||||
height: 200%;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
right: -50%;
|
||||
width: 200%;
|
||||
}
|
||||
|
||||
.cropper-invisible {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.cropper-bg {
|
||||
background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');
|
||||
}
|
||||
|
||||
.cropper-hide {
|
||||
display: block;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
.cropper-hidden {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.cropper-move {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.cropper-crop {
|
||||
cursor: crosshair;
|
||||
}
|
||||
|
||||
.cropper-disabled .cropper-drag-box,
|
||||
.cropper-disabled .cropper-face,
|
||||
.cropper-disabled .cropper-line,
|
||||
.cropper-disabled .cropper-point {
|
||||
cursor: not-allowed;
|
||||
}
|
@ -1,8 +0,0 @@
|
||||
.simple-stream .nav-content {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.simple-stream .main-nav li {
|
||||
width: auto;
|
||||
}
|
@ -1,15 +1,11 @@
|
||||
@import url("../fonts/poppins/poppins.css");
|
||||
@import url("../fonts/opensans/opensans.css");
|
||||
@import url("../widgets/buttons.css");
|
||||
@import url("../widgets/sections.css");
|
||||
|
||||
html {
|
||||
scroll-margin-top: 3rem;
|
||||
}
|
||||
@import url("../../fonts/poppins/poppins.css");
|
||||
@import url("../../fonts/opensans/opensans.css");
|
||||
|
||||
*:focus {
|
||||
-webkit-box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
-moz-box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
}
|
||||
@import url("feed.css");
|
||||
@import url("settings.css");
|
||||
|
||||
:root {
|
||||
/* FONTS */
|
||||
@ -26,8 +22,6 @@ html {
|
||||
--main-size: 1.62rem;
|
||||
--medium-size: 1.3rem;
|
||||
--small-size: 1rem;
|
||||
--smaller-size: 0.8rem;
|
||||
|
||||
|
||||
/* transitions and animations */
|
||||
--cubic-transition: all 200ms cubic-bezier(0, 0.55, 0.45, 1);
|
||||
@ -52,7 +46,7 @@ html {
|
||||
|
||||
.bg {
|
||||
background-color: var(--bg1);
|
||||
background-image: url("../images/bg.png");
|
||||
background-image: url("../../images/background_dark.png");
|
||||
}
|
||||
|
||||
body:after {
|
||||
@ -70,7 +64,7 @@ html {
|
||||
}
|
||||
|
||||
select {
|
||||
background-image: url("../images/drop.png") !important;
|
||||
background-image: url("../../images/select_drop_dark.png") !important;
|
||||
}
|
||||
}
|
||||
|
||||
@ -91,14 +85,25 @@ html {
|
||||
|
||||
.bg {
|
||||
background-color: var(--bg1);
|
||||
background-image: url(../images/bg-light.png);
|
||||
background-image: url(../../images/background_light.png);
|
||||
}
|
||||
|
||||
select {
|
||||
background-image: url("../images/drop-light.png") !important;
|
||||
background-image: url("../../images/select_drop_light.png") !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
html {
|
||||
scroll-margin-top: 3rem;
|
||||
}
|
||||
|
||||
*:focus {
|
||||
-webkit-box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
-moz-box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
box-shadow: inset 0 0 0 3px var(--bg3);
|
||||
}
|
||||
|
||||
.bg {
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
@ -106,53 +111,15 @@ html {
|
||||
}
|
||||
|
||||
a,
|
||||
a:visited {
|
||||
text-decoration: none;
|
||||
color: var(--white);
|
||||
}
|
||||
a:visited {text-decoration: none;color: var(--white);}
|
||||
a:hover {text-decoration: underline;color: var(--white);}
|
||||
hr {all: unset;display: block;height: 1px;background: var(--bg2);}
|
||||
.h-entry img {background: repeating-conic-gradient(#ffffff66 0deg 90deg,#ffffff33 0deg 180deg) 0 0/40px 40px round;}
|
||||
.icon {fill: var(--white);align-self: center;}
|
||||
.active {font-weight: bold;}
|
||||
.anchor-hidden {width: 1px;height: 1px;overflow: hidden;}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
figcaption a:link {
|
||||
font-size: var(--smaller-size);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
hr {
|
||||
all: unset;
|
||||
display: block;
|
||||
height: 1px;
|
||||
background: var(--bg2);
|
||||
}
|
||||
|
||||
|
||||
/* CHECKERBOARD BACKGROUND FOR TRANSPARENT IMAGES */
|
||||
.h-entry img {
|
||||
background: repeating-conic-gradient(
|
||||
#ffffff66 0deg 90deg,
|
||||
#ffffff33 0deg 180deg) 0 0/40px 40px round;
|
||||
}
|
||||
|
||||
.icon {
|
||||
fill: var(--white);
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.active {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* ACCESSIBILITY MENU */
|
||||
.anchor-hidden {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#accessibility-menu {
|
||||
.accessibility-menu {
|
||||
display: block;
|
||||
position: absolute;
|
||||
z-index: 999;
|
||||
@ -171,18 +138,18 @@ hr {
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
#accessibility-menu ul {
|
||||
.accessibility-menu ul {
|
||||
list-style-type: disc;
|
||||
margin-left: var(--medium-size);
|
||||
}
|
||||
|
||||
#accessibility-menu:focus-within:not(:active) {
|
||||
.accessibility-menu:focus-within:not(:active) {
|
||||
top: var(--unit-size);
|
||||
left: var(--unit-size);
|
||||
}
|
||||
|
||||
/* HEADER AND INSTANCE NAME */
|
||||
#header {
|
||||
header {
|
||||
z-index: 1;
|
||||
font-family: var(--display-font);
|
||||
font-size: var(--main-size);
|
||||
@ -200,7 +167,7 @@ hr {
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
#instance {
|
||||
.header-instance {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@ -208,12 +175,12 @@ hr {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
#instance > * {
|
||||
.header-instance > * {
|
||||
margin: unset;
|
||||
}
|
||||
|
||||
/* CONTAINS ALL ELEMENTS BESIDES HEADER */
|
||||
.container {
|
||||
.content-wrapper {
|
||||
position: relative;
|
||||
|
||||
margin-left: auto;
|
||||
@ -263,7 +230,7 @@ hr {
|
||||
font-size: var(--main-size);
|
||||
}
|
||||
|
||||
/* NOTES */
|
||||
/* REPLY PAGE */
|
||||
#replyform {
|
||||
padding: var(--unit-size);
|
||||
margin-top: var(--unit-size);
|
||||
@ -281,365 +248,8 @@ hr {
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.notes hr {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.note-wrapper {
|
||||
width: 100%;
|
||||
height: inherit;
|
||||
}
|
||||
|
||||
.note-sidebar {
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.note-sidebar * {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.note-sidebar .avatar {
|
||||
width: 3rem;
|
||||
height: auto;
|
||||
background: unset;
|
||||
margin-bottom: var(--unit-size);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.h-entry:not(:first-child) {
|
||||
margin-top: var(--unit-size);
|
||||
}
|
||||
|
||||
.h-entry .embed {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--smaller-size);
|
||||
border: unset;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
.h-entry .embed[class*="p-"] {
|
||||
padding: unset !important;
|
||||
}
|
||||
|
||||
.h-entry a:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.h-entry .embed header img {
|
||||
padding: unset;
|
||||
max-width: min-content;
|
||||
max-height: min-content;
|
||||
}
|
||||
|
||||
.h-entry {
|
||||
display: flex;
|
||||
background-color: var(--translucent);
|
||||
border-radius: var(--unit-size);
|
||||
border: solid 2px var(--bg2);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.h-entry figure {
|
||||
margin: unset;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.h-entry .replies .h-entry {
|
||||
background-color: unset;
|
||||
padding: 0 var(--unit-size) var(--unit-size) 0;
|
||||
margin-left: var(--medium-size);
|
||||
}
|
||||
|
||||
.note-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-height: 3rem;
|
||||
|
||||
border-bottom: unset;
|
||||
border-radius: var(--unit-size) var(--unit-size) 0 0;
|
||||
|
||||
background: linear-gradient(to left, var(--translucent), transparent);
|
||||
font-size: var(--medium-size);
|
||||
padding: 6px 10px 6px 0;
|
||||
}
|
||||
|
||||
.note-author {
|
||||
font-size: var(--small-size);
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.note-actions {
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.note-actions .form-group {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
all: unset;
|
||||
border: none !important;
|
||||
|
||||
background-repeat: no-repeat !important;
|
||||
|
||||
width: 1em !important;
|
||||
height: 1em !important;
|
||||
|
||||
margin-left: var(--unit-size);
|
||||
text-indent: -9999em;
|
||||
}
|
||||
|
||||
.button-container:hover,
|
||||
.button-container:focus {
|
||||
border: none !important;
|
||||
background: var(--bg3) !important;
|
||||
}
|
||||
|
||||
.favourite-button-container {
|
||||
-webkit-mask-image: url("../icons/heart.svg") !important;
|
||||
-o-mask-image: url("../icons/heart.svg") !important;
|
||||
-moz-mask-image: url("../icons/heart.svg") !important;
|
||||
mask-image: url("../icons/heart.svg") !important;
|
||||
}
|
||||
|
||||
.reply-button-container {
|
||||
-webkit-mask-image: url("../icons/reply.svg") !important;
|
||||
-o-mask-image: url("../icons/reply.svg") !important;
|
||||
-moz-mask-image: url("../icons/reply.svg") !important;
|
||||
mask-image: url("../icons/reply.svg") !important;
|
||||
}
|
||||
|
||||
.repeat-button-container {
|
||||
-webkit-mask-image: url("../icons/repeat.svg") !important;
|
||||
-o-mask-image: url("../icons/repeat.svg") !important;
|
||||
-moz-mask-image: url("../icons/repeat.svg") !important;
|
||||
mask-image: url("../icons/repeat.svg") !important;
|
||||
}
|
||||
|
||||
.note-actions-unset {
|
||||
background: var(--bg2) !important;
|
||||
}
|
||||
|
||||
.note-actions-set {
|
||||
background: var(--white) !important;
|
||||
}
|
||||
|
||||
.note-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 0 0 var(--unit-size) var(--unit-size);
|
||||
padding: var(--small-size);
|
||||
}
|
||||
|
||||
.note-text {
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-attachments {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
max-width: max-content;
|
||||
|
||||
border-radius: var(--unit-size);
|
||||
background-color: var(--translucent);
|
||||
padding: var(--smaller-size);
|
||||
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.note-attachments:not(:only-child) {
|
||||
margin-right: var(--unit-size);
|
||||
}
|
||||
|
||||
.note-attachments > figure figcaption {
|
||||
display: flex;
|
||||
word-break: break-all;
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
/* SECTIONS */
|
||||
.section-widget {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
background-color: var(--translucent);
|
||||
border-radius: var(--unit-size);
|
||||
border: solid 2px var(--bg2);
|
||||
margin-bottom: var(--medium-size);
|
||||
|
||||
box-shadow: var(--shadow);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.section-widget hr {
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-widget-padded {
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.section-widget-button-like {
|
||||
border: 2px solid var(--bg2);
|
||||
border-radius: var(--unit-size);
|
||||
background: var(--bg-button);
|
||||
padding: 6px 10px;
|
||||
margin-top: 6px;
|
||||
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
align-self: end;
|
||||
|
||||
font-family: var(--main-font);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.section-title-details {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 700;
|
||||
|
||||
border-radius: var(--unit-size);
|
||||
padding: 6px 10px 6px 10px;
|
||||
|
||||
background-color: var(--translucent);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.section-title-details[open] svg {
|
||||
transform: rotate(180deg);
|
||||
animation: var(--fade-out)
|
||||
}
|
||||
|
||||
/* SECTION DETAILS CLOSED */
|
||||
.section-title-details:not([open]) svg {
|
||||
transform: initial;
|
||||
animation: var(--fade-in);
|
||||
}
|
||||
|
||||
.section-title-summary {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.section-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-form-legend {
|
||||
margin-top: unset;
|
||||
margin-bottom: 10px;
|
||||
|
||||
font-weight: bold;
|
||||
font-size: var(--main-size);
|
||||
}
|
||||
|
||||
.form-group {
|
||||
all: unset;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
height: 7rem;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.help-text {
|
||||
font-style: italic;
|
||||
font-size: var(--small-size);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.help-block > .list-unstyled,
|
||||
.alert,
|
||||
.alert-danger {
|
||||
display: inline-block;
|
||||
|
||||
border: solid 2px #FF6347;
|
||||
background-color: #FF634733;
|
||||
border-radius: var(--unit-size);
|
||||
|
||||
padding: 2px 6px;
|
||||
margin-top: 6px;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
/* PROFILE */
|
||||
.profile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
|
||||
font-family: var(--main-font);
|
||||
background-color: var(--translucent);
|
||||
margin-bottom: var(--unit-size);
|
||||
border-radius: var(--unit-size);
|
||||
padding: var(--unit-size);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.profile *[class*="profile-info-"] {
|
||||
flex: 1;
|
||||
mix-blend-mode: difference;
|
||||
}
|
||||
|
||||
.profile-info {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.profile-info-nickname {
|
||||
font-size: var(--medium-size);
|
||||
}
|
||||
|
||||
.profile-info-tags {
|
||||
margin: unset;
|
||||
}
|
||||
|
||||
.profile-info-stats strong {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.profile-info-stats {
|
||||
margin-top: var(--unit-size);
|
||||
}
|
||||
|
||||
.profile-avatar {
|
||||
max-width: 4rem;
|
||||
min-width: 3rem;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-right: 5px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
/* MEDIA QUERIES */
|
||||
.container {
|
||||
.content-wrapper {
|
||||
top: 3rem;
|
||||
width: 62vw;
|
||||
}
|
||||
@ -686,7 +296,7 @@ and (min-width: 1281px) {
|
||||
@media only screen
|
||||
and (max-width: 1280px) {
|
||||
/* content should occupy the entire width at this size */
|
||||
.container {
|
||||
.content-wrapper {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@ -714,14 +324,14 @@ and (max-width: 1280px) {
|
||||
#panel-left-toggle:checked ~ .panel-content,
|
||||
#panel-right-toggle:checked ~ .panel-content,
|
||||
a[id|="anchor"]:target ~ .panel-content {
|
||||
background-image: url(../images/bg.png);
|
||||
background-image: url(../../images/background_dark.png);
|
||||
}
|
||||
}
|
||||
@media (prefers-color-scheme: light) {
|
||||
#panel-left-toggle:checked ~ .panel-content,
|
||||
#panel-right-toggle:checked ~ .panel-content,
|
||||
a[id|="anchor"]:target ~ .panel-content {
|
||||
background-image: url(../images/bg-light.png);
|
||||
background-image: url(../../images/background_light.png);
|
||||
}
|
||||
}
|
||||
}
|
235
public/assets/default_theme/css/core/feed.css
Normal file
@ -0,0 +1,235 @@
|
||||
.notes hr {
|
||||
margin-top: 6px;
|
||||
}
|
||||
|
||||
.note-wrapper {
|
||||
width: 100%;
|
||||
height: inherit;
|
||||
}
|
||||
|
||||
.note-sidebar {
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.note-sidebar * {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.note-sidebar .avatar {
|
||||
width: 3rem;
|
||||
height: auto;
|
||||
background: unset;
|
||||
margin-bottom: var(--unit-size);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.h-entry:not(:first-child) {
|
||||
margin-top: var(--unit-size);
|
||||
}
|
||||
|
||||
.h-entry .embed {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--smaller-size);
|
||||
border: unset;
|
||||
width: max-content;
|
||||
}
|
||||
|
||||
.h-entry .embed[class*="p-"] {
|
||||
padding: unset !important;
|
||||
}
|
||||
|
||||
.h-entry a:focus {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.h-entry .embed header img {
|
||||
padding: unset;
|
||||
max-width: min-content;
|
||||
max-height: min-content;
|
||||
}
|
||||
|
||||
.h-entry {
|
||||
display: flex;
|
||||
background-color: var(--translucent);
|
||||
border-radius: var(--unit-size);
|
||||
border: solid 2px var(--bg2);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.h-entry figure {
|
||||
margin: unset;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.h-entry .replies .h-entry {
|
||||
background-color: unset;
|
||||
padding: 0 var(--unit-size) var(--unit-size) 0;
|
||||
margin-left: var(--medium-size);
|
||||
}
|
||||
|
||||
.note-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
max-height: 3rem;
|
||||
|
||||
border-bottom: unset;
|
||||
border-radius: var(--unit-size) var(--unit-size) 0 0;
|
||||
|
||||
background: linear-gradient(to left, var(--translucent), transparent);
|
||||
font-size: var(--medium-size);
|
||||
padding: 6px 10px 6px 0;
|
||||
}
|
||||
|
||||
.note-author {
|
||||
font-size: var(--small-size);
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.note-actions {
|
||||
display: flex;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.note-actions .form-group {
|
||||
all: unset;
|
||||
}
|
||||
|
||||
.button-container {
|
||||
all: unset;
|
||||
border: none !important;
|
||||
|
||||
background-repeat: no-repeat !important;
|
||||
|
||||
width: 1em !important;
|
||||
height: 1em !important;
|
||||
|
||||
margin-left: var(--unit-size);
|
||||
text-indent: -9999em;
|
||||
}
|
||||
|
||||
.button-container:hover,
|
||||
.button-container:focus {
|
||||
border: none !important;
|
||||
background: var(--bg3) !important;
|
||||
}
|
||||
|
||||
.favourite-button-container {
|
||||
-webkit-mask-image: url("../icons/heart.svg") !important;
|
||||
-o-mask-image: url("../icons/heart.svg") !important;
|
||||
-moz-mask-image: url("../icons/heart.svg") !important;
|
||||
mask-image: url("../icons/heart.svg") !important;
|
||||
}
|
||||
|
||||
.reply-button-container {
|
||||
-webkit-mask-image: url("../icons/reply.svg") !important;
|
||||
-o-mask-image: url("../icons/reply.svg") !important;
|
||||
-moz-mask-image: url("../icons/reply.svg") !important;
|
||||
mask-image: url("../icons/reply.svg") !important;
|
||||
}
|
||||
|
||||
.repeat-button-container {
|
||||
-webkit-mask-image: url("../icons/repeat.svg") !important;
|
||||
-o-mask-image: url("../icons/repeat.svg") !important;
|
||||
-moz-mask-image: url("../icons/repeat.svg") !important;
|
||||
mask-image: url("../icons/repeat.svg") !important;
|
||||
}
|
||||
|
||||
.note-actions-unset {
|
||||
background: var(--bg2) !important;
|
||||
}
|
||||
|
||||
.note-actions-set {
|
||||
background: var(--white) !important;
|
||||
}
|
||||
|
||||
.note-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border-radius: 0 0 var(--unit-size) var(--unit-size);
|
||||
padding: var(--small-size);
|
||||
}
|
||||
|
||||
.note-text {
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-attachments {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
max-width: max-content;
|
||||
|
||||
border-radius: var(--unit-size);
|
||||
background-color: var(--translucent);
|
||||
padding: var(--smaller-size);
|
||||
|
||||
align-self: flex-start;
|
||||
}
|
||||
|
||||
.note-attachments:not(:only-child) {
|
||||
margin-right: var(--unit-size);
|
||||
}
|
||||
|
||||
.note-attachments > figure figcaption {
|
||||
display: flex;
|
||||
word-break: break-all;
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
/* PROFILE */
|
||||
.profile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
|
||||
font-family: var(--main-font);
|
||||
background-color: var(--translucent);
|
||||
margin-bottom: var(--unit-size);
|
||||
border-radius: var(--unit-size);
|
||||
padding: var(--unit-size);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.profile *[class*="profile-info-"] {
|
||||
flex: 1;
|
||||
mix-blend-mode: difference;
|
||||
}
|
||||
|
||||
.profile-info {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.profile-info-nickname {
|
||||
font-size: var(--medium-size);
|
||||
}
|
||||
|
||||
.profile-info-tags {
|
||||
margin: unset;
|
||||
}
|
||||
|
||||
.profile-info-stats strong {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.profile-info-stats {
|
||||
margin-top: var(--unit-size);
|
||||
}
|
||||
|
||||
.profile-avatar {
|
||||
max-width: 4rem;
|
||||
min-width: 3rem;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-right: 5px;
|
||||
border-radius: 2px;
|
||||
}
|
148
public/assets/default_theme/css/reset.css
Normal file
@ -0,0 +1,148 @@
|
||||
/* link underlines tend to make hypertext less readable,
|
||||
because underlines obscure the shapes of the lower halves of words */
|
||||
:link, :visited {
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
/* no list-markers by default, since lists are used more often for semantics */
|
||||
ul, ol {
|
||||
list-style: none
|
||||
}
|
||||
|
||||
/* remove the inconsistent (among browsers) default ul,ol padding or margin */
|
||||
/* the default spacing on headings does not match nor align with
|
||||
normal interline spacing at all, so let's get rid of it. */
|
||||
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
|
||||
pre, form, body, html, blockquote, fieldset, input, textarea {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* whoever thought blue linked image borders were a good idea? */
|
||||
a img, :link img, :visited img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* de-italicize address */
|
||||
address {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* firefox focus outline */
|
||||
:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* details element arrow */
|
||||
details summary > * {
|
||||
margin: unset;
|
||||
padding: unset;
|
||||
}
|
||||
|
||||
details > summary {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
details > summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* have IE ignore the detail elements altogether */
|
||||
@supports not (-ms-ime-align: auto) {
|
||||
details summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
|
||||
/* TYPOGRAPHY AND GENERAL SELECTORS */
|
||||
body,
|
||||
html {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
background-attachment: fixed;
|
||||
color: var(--white);
|
||||
font-family: var(--main-font);
|
||||
font-size: var(--small-size);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
all: unset;
|
||||
display: block;
|
||||
font-family: var(--display-font);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: var(--main-size);
|
||||
font-weight: 700;
|
||||
margin-bottom: 16.2px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 600;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: var(--small-size);
|
||||
font-weight: 600;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h4, h5 {
|
||||
font-size: var(--small-size);
|
||||
font-weight: 400;
|
||||
margin-bottom: 6.1px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: var(--main-font);
|
||||
font-size: var(--small-size);
|
||||
font-weight: 400;
|
||||
margin: unset;
|
||||
}
|
||||
|
||||
p:first-line {
|
||||
padding-left: var(--small-size);
|
||||
}
|
||||
|
||||
p:first-line {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
p:not(:first-line) {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-family: var(--main-font);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
ul {
|
||||
text-decoration: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
@ -1,152 +1,3 @@
|
||||
/* link underlines tend to make hypertext less readable,
|
||||
because underlines obscure the shapes of the lower halves of words */
|
||||
:link, :visited {
|
||||
text-decoration: none
|
||||
}
|
||||
|
||||
/* no list-markers by default, since lists are used more often for semantics */
|
||||
ul, ol {
|
||||
list-style: none
|
||||
}
|
||||
|
||||
/* remove the inconsistent (among browsers) default ul,ol padding or margin */
|
||||
/* the default spacing on headings does not match nor align with
|
||||
normal interline spacing at all, so let's get rid of it. */
|
||||
/* zero out the spacing around pre, form, body, html, p, blockquote as well */
|
||||
pre, form, body, html, blockquote, fieldset, input, textarea {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* whoever thought blue linked image borders were a good idea? */
|
||||
a img, :link img, :visited img {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* de-italicize address */
|
||||
address {
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* firefox focus outline */
|
||||
:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* details element arrow */
|
||||
details summary > * {
|
||||
margin: unset;
|
||||
padding: unset;
|
||||
}
|
||||
|
||||
details > summary {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
details > summary::-webkit-details-marker {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* have IE ignore the detail elements altogether */
|
||||
@supports not (-ms-ime-align: auto) {
|
||||
details summary {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box !important;
|
||||
}
|
||||
|
||||
/* TYPOGRAPHY AND GENERAL SELECTORS */
|
||||
body,
|
||||
html {
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
background-attachment: fixed;
|
||||
color: var(--white);
|
||||
font-family: var(--main-font);
|
||||
font-size: var(--small-size);
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
all: unset;
|
||||
display: block;
|
||||
font-family: var(--display-font);
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: var(--main-size);
|
||||
font-weight: 700;
|
||||
margin-bottom: 16.2px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 600;
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: var(--small-size);
|
||||
font-weight: 600;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
h4, h5 {
|
||||
font-size: var(--small-size);
|
||||
font-weight: 400;
|
||||
margin-bottom: 6.1px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: var(--main-font);
|
||||
font-size: var(--small-size);
|
||||
font-weight: 400;
|
||||
margin: unset;
|
||||
}
|
||||
|
||||
p:first-line {
|
||||
padding-left: var(--small-size);
|
||||
}
|
||||
|
||||
p:first-line {
|
||||
margin-top: 0;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
p:not(:first-line) {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
font-family: var(--main-font);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
ul {
|
||||
text-decoration: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
li {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* BUTTONS AND FILEPICKER */
|
||||
button {
|
||||
cursor: pointer !important;
|
||||
@ -276,10 +127,10 @@ input[type=checkbox] {
|
||||
background-size: cover;
|
||||
margin-right: 2px;
|
||||
|
||||
-webkit-mask-image: url("../icons/check-off.svg") !important;
|
||||
-o-mask-image: url("../icons/check-off.svg") !important;
|
||||
-moz-mask-image: url("../icons/check-off.svg") !important;
|
||||
mask-image: url("../icons/check-off.svg") !important;
|
||||
-webkit-mask-image: url("../../icons/check-off.svg") !important;
|
||||
-o-mask-image: url("../../icons/check-off.svg") !important;
|
||||
-moz-mask-image: url("../../icons/check-off.svg") !important;
|
||||
mask-image: url("../../icons/check-off.svg") !important;
|
||||
}
|
||||
|
||||
input[type=color] {
|
||||
@ -327,10 +178,10 @@ input[type=radio]:checked {
|
||||
|
||||
input[type=checkbox]:checked {
|
||||
background-color: var(--bg3) !important;
|
||||
-webkit-mask-image: url("../icons/check-on.svg") !important;
|
||||
-o-mask-image: url("../icons/check-on.svg") !important;
|
||||
-moz-mask-image: url("../icons/check-on.svg") !important;
|
||||
mask-image: url("../icons/check-on.svg") !important;
|
||||
-webkit-mask-image: url("../../icons/check-on.svg") !important;
|
||||
-o-mask-image: url("../../icons/check-on.svg") !important;
|
||||
-moz-mask-image: url("../../icons/check-on.svg") !important;
|
||||
mask-image: url("../../icons/check-on.svg") !important;
|
||||
}
|
||||
|
||||
/* file selector */
|
||||
@ -351,46 +202,3 @@ input[type=file] {
|
||||
font-weight: bold !important;
|
||||
color: var(--white) !important;
|
||||
}
|
||||
|
||||
/* ANIMATIONS */
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
100% {
|
||||
opacity: unset;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeOut {
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
|
||||
0% {
|
||||
opacity: unset;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes highlight {
|
||||
0% {
|
||||
box-shadow: initial;
|
||||
border-radius: var(--unit-size);
|
||||
}
|
||||
|
||||
50% {
|
||||
border-radius: var(--unit-size);
|
||||
box-shadow: inset 0 20px 40px var(--white);
|
||||
transition: box-shadow 0.3s ease-in-out;
|
||||
}
|
||||
|
||||
100% {
|
||||
box-shadow: initial;
|
||||
border-radius: var(--unit-size);
|
||||
}
|
||||
}
|
120
public/assets/default_theme/css/widgets/sections.css
Normal file
@ -0,0 +1,120 @@
|
||||
/* SECTIONS */
|
||||
.section-widget {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
background-color: var(--translucent);
|
||||
border-radius: var(--unit-size);
|
||||
border: solid 2px var(--bg2);
|
||||
margin-bottom: var(--medium-size);
|
||||
|
||||
box-shadow: var(--shadow);
|
||||
color: var(--white);
|
||||
}
|
||||
|
||||
.section-widget hr {
|
||||
margin-bottom: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-widget-padded {
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 700;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.section-widget-button-like {
|
||||
border: 2px solid var(--bg2);
|
||||
border-radius: var(--unit-size);
|
||||
background: var(--bg-button);
|
||||
padding: 6px 10px;
|
||||
margin-top: 6px;
|
||||
|
||||
cursor: pointer;
|
||||
float: right;
|
||||
align-self: end;
|
||||
|
||||
font-family: var(--main-font);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.section-title-details {
|
||||
font-size: var(--medium-size);
|
||||
font-weight: 700;
|
||||
|
||||
border-radius: var(--unit-size);
|
||||
padding: 6px 10px 6px 10px;
|
||||
|
||||
background-color: var(--translucent);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.section-title-details[open] svg {
|
||||
transform: rotate(180deg);
|
||||
animation: var(--fade-out)
|
||||
}
|
||||
|
||||
/* SECTION DETAILS CLOSED */
|
||||
.section-title-details:not([open]) svg {
|
||||
transform: initial;
|
||||
animation: var(--fade-in);
|
||||
}
|
||||
|
||||
.section-title-summary {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.section-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: var(--unit-size);
|
||||
}
|
||||
|
||||
.section-form-legend {
|
||||
margin-top: unset;
|
||||
margin-bottom: 10px;
|
||||
|
||||
font-weight: bold;
|
||||
font-size: var(--main-size);
|
||||
}
|
||||
|
||||
.form-group {
|
||||
all: unset;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.form-group textarea {
|
||||
height: 7rem;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.help-text {
|
||||
font-style: italic;
|
||||
font-size: var(--small-size);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.help-block > .list-unstyled,
|
||||
.alert,
|
||||
.alert-danger {
|
||||
display: inline-block;
|
||||
|
||||
border: solid 2px #FF6347;
|
||||
background-color: #FF634733;
|
||||
border-radius: var(--unit-size);
|
||||
|
||||
padding: 2px 6px;
|
||||
margin-top: 6px;
|
||||
margin-bottom: 6px;
|
||||
}
|
90
public/assets/default_theme/fonts/opensans/opensans.css
Normal file
@ -0,0 +1,90 @@
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Italic'), local('OpenSans-Italic'),
|
||||
url('OpenSans-Italic.woff') format('woff');
|
||||
font-weight: 900;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Light'), local('OpenSans-Light'),
|
||||
url('OpenSans-Light.woff') format('woff');
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Regular'), local('OpenSans-Regular'),
|
||||
url('OpenSans-Regular.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
|
||||
url('OpenSans-BoldItalic.woff') format('woff');
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
|
||||
url('OpenSans-SemiBoldItalic.woff') format('woff');
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
|
||||
url('OpenSans-ExtraBold.woff') format('woff');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Bold'), local('OpenSans-Bold'),
|
||||
url('OpenSans-Bold.woff') format('woff');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
|
||||
url('OpenSans-SemiBold.woff') format('woff');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Italic'), local('OpenSans-Italic'),
|
||||
url('OpenSans-Italic.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
|
||||
url('OpenSans-LightItalic.woff') format('woff');
|
||||
font-weight: 300;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
Before Width: | Height: | Size: 376 B After Width: | Height: | Size: 376 B |
Before Width: | Height: | Size: 334 B After Width: | Height: | Size: 334 B |
Before Width: | Height: | Size: 1.6 KiB After Width: | Height: | Size: 1.6 KiB |
Before Width: | Height: | Size: 3.2 KiB After Width: | Height: | Size: 3.2 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 472 B After Width: | Height: | Size: 472 B |
Before Width: | Height: | Size: 766 B After Width: | Height: | Size: 766 B |
Before Width: | Height: | Size: 180 KiB After Width: | Height: | Size: 180 KiB |
Before Width: | Height: | Size: 8.3 KiB After Width: | Height: | Size: 8.3 KiB |
Before Width: | Height: | Size: 552 B After Width: | Height: | Size: 552 B |
Before Width: | Height: | Size: 734 B After Width: | Height: | Size: 734 B |
@ -1,93 +0,0 @@
|
||||
Copyright 2016 The Chivo Project Authors (omnibus.type@gmail.com)
|
||||
|
||||
This Font Software is licensed under the SIL Open Font License, Version 1.1.
|
||||
This license is copied below, and is also available with a FAQ at:
|
||||
http://scripts.sil.org/OFL
|
||||
|
||||
|
||||
-----------------------------------------------------------
|
||||
SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
|
||||
-----------------------------------------------------------
|
||||
|
||||
PREAMBLE
|
||||
The goals of the Open Font License (OFL) are to stimulate worldwide
|
||||
development of collaborative font projects, to support the font creation
|
||||
efforts of academic and linguistic communities, and to provide a free and
|
||||
open framework in which fonts may be shared and improved in partnership
|
||||
with others.
|
||||
|
||||
The OFL allows the licensed fonts to be used, studied, modified and
|
||||
redistributed freely as long as they are not sold by themselves. The
|
||||
fonts, including any derivative works, can be bundled, embedded,
|
||||
redistributed and/or sold with any software provided that any reserved
|
||||
names are not used by derivative works. The fonts and derivatives,
|
||||
however, cannot be released under any other type of license. The
|
||||
requirement for fonts to remain under this license does not apply
|
||||
to any document created using the fonts or their derivatives.
|
||||
|
||||
DEFINITIONS
|
||||
"Font Software" refers to the set of files released by the Copyright
|
||||
Holder(s) under this license and clearly marked as such. This may
|
||||
include source files, build scripts and documentation.
|
||||
|
||||
"Reserved Font Name" refers to any names specified as such after the
|
||||
copyright statement(s).
|
||||
|
||||
"Original Version" refers to the collection of Font Software components as
|
||||
distributed by the Copyright Holder(s).
|
||||
|
||||
"Modified Version" refers to any derivative made by adding to, deleting,
|
||||
or substituting -- in part or in whole -- any of the components of the
|
||||
Original Version, by changing formats or by porting the Font Software to a
|
||||
new environment.
|
||||
|
||||
"Author" refers to any designer, engineer, programmer, technical
|
||||
writer or other person who contributed to the Font Software.
|
||||
|
||||
PERMISSION & CONDITIONS
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of the Font Software, to use, study, copy, merge, embed, modify,
|
||||
redistribute, and sell modified and unmodified copies of the Font
|
||||
Software, subject to the following conditions:
|
||||
|
||||
1) Neither the Font Software nor any of its individual components,
|
||||
in Original or Modified Versions, may be sold by itself.
|
||||
|
||||
2) Original or Modified Versions of the Font Software may be bundled,
|
||||
redistributed and/or sold with any software, provided that each copy
|
||||
contains the above copyright notice and this license. These can be
|
||||
included either as stand-alone text files, human-readable headers or
|
||||
in the appropriate machine-readable metadata fields within text or
|
||||
binary files as long as those fields can be easily viewed by the user.
|
||||
|
||||
3) No Modified Version of the Font Software may use the Reserved Font
|
||||
Name(s) unless explicit written permission is granted by the corresponding
|
||||
Copyright Holder. This restriction only applies to the primary font name as
|
||||
presented to the users.
|
||||
|
||||
4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
|
||||
Software shall not be used to promote, endorse or advertise any
|
||||
Modified Version, except to acknowledge the contribution(s) of the
|
||||
Copyright Holder(s) and the Author(s) or with their explicit written
|
||||
permission.
|
||||
|
||||
5) The Font Software, modified or unmodified, in part or in whole,
|
||||
must be distributed entirely under this license, and must not be
|
||||
distributed under any other license. The requirement for fonts to
|
||||
remain under this license does not apply to any document created
|
||||
using the Font Software.
|
||||
|
||||
TERMINATION
|
||||
This license becomes null and void if any of the above conditions are
|
||||
not met.
|
||||
|
||||
DISCLAIMER
|
||||
THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
|
||||
OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
|
||||
COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
|
||||
INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
|
||||
DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
||||
FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
|
||||
OTHER DEALINGS IN THE FONT SOFTWARE.
|
@ -1,35 +0,0 @@
|
||||
@font-face {
|
||||
font-family: 'Chivo';
|
||||
src: local('Chivo Bold Italic'), local('Chivo-BoldItalic'),
|
||||
url("Chivo-BoldItalic.woff") format('woff');
|
||||
font-weight: bold;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Chivo';
|
||||
src: local('Chivo Bold'), local('Chivo-Bold'),
|
||||
url("Chivo-Bold.woff") format('woff');
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Chivo';
|
||||
src: local('Chivo Italic'), local('Chivo-Italic'),
|
||||
url("Chivo-Italic.woff") format('woff');
|
||||
font-weight: normal;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Chivo';
|
||||
src: local('Chivo Regular'), local('Chivo-Regular'),
|
||||
url("Chivo-Regular.woff") format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
@ -1,4 +0,0 @@
|
||||
<svg class="{{ iconClass|default('') }}" version="1.1" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
|
||||
<title>attach</title>
|
||||
<path d="M4.703 29.192c-3.652-3.768-3.584-9.844 0.087-13.599l13.11-13.41c2.77-2.833 7.272-2.833 10.042 0 2.743 2.806 2.746 7.333 0 10.142l-13.051 11.381c-2.048 1.659-4.032 1.617-5.243 0.067-1.048-1.407-1.181-3.381 0.454-5.377l8.775-9.424c1.421-1.318 3.019 0.439 1.965 1.644l-8.723 9.548c-0.833 0.91 0.286 2.144 1.163 1.34l11.8-11.976c1.226-1.254 1.226-3.295-0.001-4.55-1.199-1.227-3.122-1.227-4.322 0l-13.11 13.41c-2.303 2.326-1.592 5.802 0.391 7.61 3.605 3.643 7.555 0.332 12.211-3.69 0.386-0.395 5.076-4.978 7.183-6.899 0.901-0.618 1.824 0.244 1.201 1.554l-9.69 11.7c-3.892 4.233-10.565 4.322-14.242 0.528z"></path>
|
||||
</svg>
|
Before Width: | Height: | Size: 781 B |
@ -1,6 +0,0 @@
|
||||
<!-- https://github.com/primer/octicons -->
|
||||
<!-- MIT License -->
|
||||
<svg class="{{ iconClass|default('') }}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24">
|
||||
<title>Profile</title>
|
||||
<path fill-rule="evenodd" d="M12 2.5a5.5 5.5 0 00-3.096 10.047 9.005 9.005 0 00-5.9 8.18.75.75 0 001.5.045 7.5 7.5 0 0114.993 0 .75.75 0 101.499-.044 9.005 9.005 0 00-5.9-8.181A5.5 5.5 0 0012 2.5zM8 8a4 4 0 118 0 4 4 0 01-8 0z"></path>
|
||||
</svg>
|
Before Width: | Height: | Size: 458 B |
@ -1,7 +0,0 @@
|
||||
<!-- https://github.com/primer/octicons -->
|
||||
<!-- MIT License -->
|
||||
<svg class="{{ iconClass|default('') }}" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" width="16" height="16">
|
||||
<title>plus-circle</title>
|
||||
<path fill-rule="evenodd"
|
||||
d="M1.5 8a6.5 6.5 0 1113 0 6.5 6.5 0 01-13 0zM8 0a8 8 0 100 16A8 8 0 008 0zm.75 4.75a.75.75 0 00-1.5 0v2.5h-2.5a.75.75 0 000 1.5h2.5v2.5a.75.75 0 001.5 0v-2.5h2.5a.75.75 0 000-1.5h-2.5v-2.5z"></path>
|
||||
</svg>
|
Before Width: | Height: | Size: 462 B |
@ -12,14 +12,14 @@
|
||||
</title>
|
||||
|
||||
{% block stylesheets %}
|
||||
<link rel="preload" href="{{ asset('assets/css/reset.css') }}" as="style" type="text/css">
|
||||
<link rel="stylesheet" href="{{ asset('assets/css/reset.css') }}">
|
||||
<link rel="preload" href="{{ asset('assets/default_theme/css/reset.css') }}" as="style" type="text/css">
|
||||
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/reset.css') }}">
|
||||
|
||||
<link rel="preload" href="{{ asset('assets/css/base.css') }}" as="style" type="text/css">
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/base.css') }}">
|
||||
<link rel="preload" href="{{ asset('assets/default_theme/css/core/base.css') }}" as="style" type="text/css">
|
||||
<link rel="stylesheet" href="{{ asset('assets/default_theme/css/core/base.css') }}">
|
||||
|
||||
{% for stylesheet in show_stylesheets() %}
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/' ~ stylesheet) }}">
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/css/' ~ stylesheet) }}">
|
||||
{% endfor %}
|
||||
{% endblock %}
|
||||
|
||||
@ -33,8 +33,8 @@
|
||||
|
||||
<body class="bg">
|
||||
|
||||
<aside id="accessibility-menu">
|
||||
<h2 id="accessibility-menu-title" tabindex="0">{{ 'Accessibility menu.' | trans }}</h2>
|
||||
<aside class="accessibility-menu">
|
||||
<h2 class="accessibility-menu-title" tabindex="0">{{ 'Accessibility menu.' | trans }}</h2>
|
||||
<p tabindex="0">{{ 'Here you can find fast shortcuts to various page regions!' | trans }}</p>
|
||||
<p tabindex="0">{{ 'Provided the following keyboard shortcut, the link is targeted.' | trans }}</p>
|
||||
<br>
|
||||
@ -67,22 +67,20 @@
|
||||
</aside>
|
||||
|
||||
{% block header %}
|
||||
<header id='header' role="banner">
|
||||
<header>
|
||||
{{ block("leftpanel", "stdgrid.html.twig") }}
|
||||
|
||||
<a role="navigation" id="anchor-main-page" class="anchor-hidden"
|
||||
title="{{ 'Press tab to access selected region!' | trans }}"></a>
|
||||
<a class="accessibility-target" id='instance' href="{{ path('main_public') }}" tabindex="0"
|
||||
title="{{ 'This instance\'s name. Access public timeline.' | trans }}">
|
||||
<a id="anchor-main-page" class="anchor-hidden" title="{{ 'Press tab to access instance\'s main page.' | trans }}"></a>
|
||||
<a class="accessibility-target header-instance" href="{{ path('main_public') }}" tabindex="0" title="{{ 'This instance\'s name. Access public timeline.' | trans }}">
|
||||
<h1>{{ icon('logo', 'icon icon-logo') | raw }}{{ config('site', 'name') }} </h1>
|
||||
</a>
|
||||
|
||||
<div>
|
||||
<span>
|
||||
{% set extra = handle_event('AddHeaderElements', request) %}
|
||||
{% for el in extra %}
|
||||
{{ form(el) }}
|
||||
{% endfor %}
|
||||
</div>
|
||||
</span>
|
||||
|
||||
{% if app.user %}
|
||||
{{ block("rightpanel", "stdgrid.html.twig") }}
|
||||
@ -90,9 +88,8 @@
|
||||
</header>
|
||||
{% endblock header %}
|
||||
|
||||
<div class="container">
|
||||
<a role="navigation" rel="help" id="anchor-main-content" class="anchor-hidden"
|
||||
title="{{ 'Press tab to access selected region!' | trans }}"></a>
|
||||
<div class="content-wrapper">
|
||||
<a role="navigation" rel="help" id="anchor-main-content" class="anchor-hidden" title="{{ 'Press tab to access main content.' | trans }}"></a>
|
||||
<div class='content accessibility-target'>
|
||||
{% block nav %}{% endblock %}
|
||||
{% block body %}{% endblock %}
|
||||
|
@ -1,5 +1,5 @@
|
||||
{% block stylesheets %}
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/left/view.css') }}">
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/css/components/left.css') }}">
|
||||
{% endblock stylesheets %}
|
||||
|
||||
{% block leftpanel %}
|
||||
|
@ -1,5 +1,5 @@
|
||||
{% block stylesheets %}
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/css/right/view.css') }}">
|
||||
<link rel='stylesheet' type='text/css' href="{{ asset('assets/default_theme/css/components/right.css') }}">
|
||||
{% endblock stylesheets %}
|
||||
|
||||
{% block rightpanel %}
|
||||
|