previously all the of the page routing was handlede through controller organized by CRUD methods. it worked, but organizing by CRUD and not purpose resulted in more time spent looking for a specific task through controllers, so it turned out not to an effecient way of organizing. so routing has been completely reorganized into laravel's web routing section and methods have been moved to their appropriate controller so tasks are much easier to find front facing page routing turned out to be a bit more tricky that anticipated do the overap of routing paths, but it only affects dynamic page rendering and there's a patch in place that handles that issue until a better solution is found. Rendered HTML pages works fine. whew!
417 lines
7.9 KiB
CSS
417 lines
7.9 KiB
CSS
article[class="settings"] {
|
|
margin: 100px auto;
|
|
width: 100%;
|
|
max-width: 900px;
|
|
transition: all 0.8s linear;
|
|
}
|
|
|
|
article[class="settings"] h1 {
|
|
color: var(--white);
|
|
}
|
|
|
|
article[class="settings"] label {
|
|
color: var(--primary);
|
|
margin-bottom: 10px;
|
|
display: inline-block;
|
|
font-weight: bold;
|
|
}
|
|
|
|
article.settings div.tab-toolbar button {
|
|
width: 120px;
|
|
height: 40px;
|
|
color: var(--secondary);
|
|
}
|
|
|
|
article.settings section.settings-tabs section.section-tab {
|
|
width: 100%;
|
|
min-height: 400px;
|
|
color: var(--secondary);
|
|
}
|
|
|
|
.show {
|
|
display: block;
|
|
visibility: visible;
|
|
}
|
|
|
|
.hide {
|
|
/* REFACTOR: i know, i know, it's just a placeholder*/
|
|
display: none !important;
|
|
visibility: hidden;
|
|
}
|
|
|
|
/*
|
|
MEMBER PROFILE TAB
|
|
*/
|
|
|
|
section#site-profile {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
grid-auto-columns: auto;
|
|
gap: 15px;
|
|
width: 100%;
|
|
max-width: 900px;
|
|
margin: 10px auto;
|
|
border-radius: 3px;
|
|
background: var(--secondary);
|
|
}
|
|
|
|
section#site-profile > div:nth-child(1) {
|
|
grid-column: 1/2;
|
|
grid-row: 1/2;
|
|
height: 250px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(2) {
|
|
grid-column: 2/4;
|
|
grid-row: 1/2;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(3) {
|
|
grid-column: 1/2;
|
|
grid-row: 2/3;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(4) {
|
|
grid-column: 2/3;
|
|
grid-row: 2/3;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(4) a {
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
color: var(--primary-highlight);
|
|
}
|
|
|
|
section#site-profile > div:nth-child(5) {
|
|
grid-column: 3/4;
|
|
grid-row: 2/3;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) {
|
|
grid-column: 1/4;
|
|
grid-row: 3/4;
|
|
padding: 0 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) div {
|
|
display: inline-block;
|
|
color: var(--secondary);
|
|
word-wrap: break-word;
|
|
vertical-align: top;
|
|
width: 49.6%;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) div > span {
|
|
display: block;
|
|
background: var(--primary);
|
|
color: var(--secondary);
|
|
border-radius: 3px;
|
|
padding: 3px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
section#site-profile > div textarea {
|
|
width: 98.4%;
|
|
height: 85%;
|
|
}
|
|
|
|
section#site-profile > div[class="member-avatar"] div,
|
|
section#site-profile > div[class="site-background"] div {
|
|
height: 100%;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
section#site-profile div input[type="file"] {
|
|
display: none;
|
|
visibility: hidden;
|
|
}
|
|
|
|
section#site-profile div input[type="text"] {
|
|
width: 98.4%;
|
|
height: 40px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
/*
|
|
SITE FEATURES TAB
|
|
*/
|
|
|
|
section#site-features > div.features-mail {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-auto-columns: auto;
|
|
gap: 15px;
|
|
width: 100%;
|
|
max-width: 880px;
|
|
margin: 10px auto 10px auto;
|
|
border-radius: 3px;
|
|
background: var(--secondary);
|
|
padding: 10px;
|
|
color: var(--primary);
|
|
}
|
|
|
|
section#site-features > div.features-mail input {
|
|
width: 98.4%;
|
|
height: 40px;
|
|
padding-left: 5px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
section#site-features > div.features-mail a {
|
|
margin-right: 3px;
|
|
color: var(--primary);
|
|
display: inline-block;
|
|
height: 40px;
|
|
padding: 15px 0 0;
|
|
}
|
|
|
|
section#site-features > div.features-mail button {
|
|
width: 100%;
|
|
height: 40px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
section#site-features div.site-options button,
|
|
section#site-features div.site-maintenance button {
|
|
width: 90%;
|
|
height: 40px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
section#site-features button span {
|
|
font-size: 0.8em;
|
|
display: inline;
|
|
position: relative;
|
|
}
|
|
|
|
section#site-features > div.features-mail a[data-enabled="true"] {
|
|
color: var(--secondary-highlight);
|
|
font-weight: bold;
|
|
}
|
|
|
|
section#site-features > div.features-mail div[data-enabled="false"] {
|
|
visibility: hidden;
|
|
display: none;
|
|
}
|
|
|
|
section#site-features > div[class="features"] button[data-enabled="true"] {
|
|
color: var(--white);
|
|
}
|
|
|
|
section#site-features > div.site-options {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-auto-columns: auto;
|
|
gap: 15px;
|
|
width: 100%;
|
|
max-width: 900px;
|
|
margin: 0 auto 10px auto;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
section#site-features div.option-container {
|
|
background: var(--secondary);
|
|
padding: 10px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
section#site-features div.option-container span {
|
|
display: block;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 0.8em;
|
|
}
|
|
|
|
section#site-features div.option-container svg {
|
|
fill: var(--primary);
|
|
position: relative;
|
|
top: 7px;
|
|
}
|
|
|
|
section#site-features > div.site-options button[data-enabled="true"] {
|
|
color: var(--primary-highlight);
|
|
background: var(--primary);
|
|
}
|
|
|
|
section#site-features > div.site-options button[data-enabled="false"] {
|
|
color: var(--secondary);
|
|
background: var(--secondary-highlight);
|
|
}
|
|
|
|
section#site-features > div.site-maintenance {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
grid-auto-columns: auto;
|
|
gap: 15px;
|
|
width: 100%;
|
|
max-width: 900px;
|
|
margin: 0 auto 10px auto;
|
|
border-radius: 3px;
|
|
color: var(--primary);
|
|
}
|
|
|
|
/*
|
|
SITE FEATURES TAB
|
|
*/
|
|
|
|
section#site-themes > button {
|
|
background: var(--secondary);
|
|
display: inline-block;
|
|
border-radius: 3px;
|
|
padding: 3px;
|
|
width: 250px;
|
|
height: 200px;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
section#site-themes > button > div {
|
|
height: 145px;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
top: -10px;
|
|
position: relative;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="true"] > div {
|
|
background: var(--secondary-highlight);
|
|
color: var(--secondary);
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="true"] label {
|
|
color: var(--primary);
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="false"] > div {
|
|
background: var(--primary);
|
|
color: var(--secondary);
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="false"] label {
|
|
color: var(--secondary);
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="true"] > svg {
|
|
fill: var(--primary);
|
|
position: relative;
|
|
top: 5px;
|
|
}
|
|
|
|
section#site-themes > button[data-enabled="false"] > svg {
|
|
fill: var(--primary);
|
|
position: relative;
|
|
top: 5px;
|
|
}
|
|
|
|
section#site-themes > a {
|
|
background: var(--secondary-highlight);
|
|
display: inline-block;
|
|
width: 15%;
|
|
border-radius: 3px;
|
|
text-align: center;
|
|
vertical-align: top;
|
|
top: 13px;
|
|
position: absolute;
|
|
z-index: 30;
|
|
}
|
|
|
|
@media only screen and (max-width: 530px) {
|
|
article.settings div.tab-toolbar button {
|
|
width: 20%;
|
|
height: 40px;
|
|
color: var(--secondary);
|
|
font-size: 0.7em;
|
|
}
|
|
|
|
section#site-profile {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(1) {
|
|
grid-column: 1/4;
|
|
grid-row: 1;
|
|
height: 250px;
|
|
padding: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(2) {
|
|
grid-column: 1/4;
|
|
grid-row: 2;
|
|
height: 250px;
|
|
padding: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(3) {
|
|
grid-column: 1/4;
|
|
grid-row: 3;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(4) {
|
|
grid-column: 1/4;
|
|
grid-row: 4;
|
|
padding: 5px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(4) a {
|
|
font-weight: bold;
|
|
text-decoration: underline;
|
|
color: var(--primary-highlight);
|
|
}
|
|
|
|
section#site-profile > div:nth-child(5) {
|
|
grid-column: 1/4;
|
|
grid-row: 5;
|
|
padding: 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) {
|
|
grid-column: 1/4;
|
|
grid-row: 6;
|
|
padding: 0 10px;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) div {
|
|
display: inline-block;
|
|
color: var(--secondary);
|
|
word-wrap: break-word;
|
|
vertical-align: top;
|
|
width: 49%;
|
|
}
|
|
|
|
section#site-profile > div:nth-child(6) div > span {
|
|
display: block;
|
|
background: var(--primary);
|
|
color: var(--secondary);
|
|
border-radius: 3px;
|
|
padding: 3px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
section#site-profile > div textarea {
|
|
width: 98.4%;
|
|
height: 85%;
|
|
}
|
|
|
|
article.settings section.settings-tabs section.section-tab {
|
|
width: 98%;
|
|
padding: 5px;
|
|
}
|
|
|
|
section#site-features > div.features-mail {
|
|
width: 96%;
|
|
}
|
|
|
|
section#site-features div.site-options button,
|
|
section#site-features div.site-maintenance button {
|
|
width: 86%;
|
|
}
|
|
|
|
section#site-features div.option-container span {
|
|
font-size: 0.7em;
|
|
}
|
|
}
|