Adds proper indentation to blog comments. Also adds an accent color that you can choose along with some other tweaks.
Purdue Engineering Blog Tweaks by zadencodes
Details
Authorzadencodes
LicenseNo License
Categoryhttps://www.purdue.edu/freeform/
Created
Updated
Size10 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
New: Grid mode for ME274 Blog
Not associated with Purdue. Just a student who was bored.
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name Purdue Engineering Blogs
@namespace github.com/openstyles/stylus
@version 1.5.6
@description Adds some fun stuff and tweaks to the boring engineering blogs at Purdue
@author Me
@updateURL https://userstyles.world/api/style/8233.user.css
@preprocessor stylus
@var color rowColor "Accent Color" #092b29
@var checkbox darkMode "Dark Mode" 1
@var checkbox gridMode "Use Grid for Blog" 0
==/UserStyle== */
@-moz-document url-prefix("https://www.purdue.edu/freeform/") {
.ose-youtube {
width: 100% !important;
max-width: 600px !important;
}
@media screen and (min-width: 1218px) {
.full-width .comments-area,
.full-width .post-navigation {
margin-right: auto;
margin-left: 0;
}
}
.site-content .entry-content {
max-width: 85%;
}
.comments-area {
margin: 48px auto;
max-width: 85%;
}
.post-navigation,
.image-navigation {
margin: 24px auto 48px;
max-width: 85%;
}
.paging-navigation a:hover {
border-top: 0px solid #41a62a;
color: #2b2b2b;
background: lighten(rowColor, 30);
}
.paging-navigation .page-numbers.current {
border-top: 0px solid rowColor;
background: rowColor;
width: 21px;
padding: 14px;
}
.paging-navigation .page-numbers {
width: 90px;
height: 21px;
padding: 14px;
}
.next .page-numbers {
width: 41px;
height: 21px;
}
.paging-navigation {
border-top: 0px solid #000;
margin: 44px 0;
}
.paging-navigation .loop-pagination {
margin-top: -18px;
text-align: center;
}
.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
margin: 0 0;
}
.entry-content > table {
max-width: 600px;
display: block;
margin-left: 0;
margin-right: auto;
}
.entry-content > table > tbody > tr > td {
width: 600px !important;
}
img {
margin-left: 0 !important;
}
p {
text-align: left !important;
}
@media screen and (min-width: 1017px) {
.primary-navigation .menu-toggle {
display: none;
padding: 0;
}
}
@media screen and (min-width: 1017px) {
.primary-navigation {
float: right;
font-size: 11px;
margin: 0 1px 0 -12px;
padding: 0;
text-transform: uppercase;
}
}
::selection {
background: lighten(rowColor, 25);
}
a {
height: 48px;
}
.site-title a {
if light(rowColor) {
color: darken(rowColor, 5)
}
else {
color: lighten(rowColor, 5)
}
}
.site,
.site-header {
max-width: 100% !important;
}
.site-navigation .current_page_item > a,
.site-navigation .current_page_ancestor > a,
.site-navigation .current-menu-item > a,
.site-navigation .current-menu-ancestor > a {
color: lighten(rowColor, 5);
}
a {
color: lighten(rowColor, 10)
}
.search-toggle {
background-color: lighten(rowColor, 5);
height: 48px !important;
width: 48px;
}
.search-toggle:hover {
background-color: lighten(rowColor, 25);
}
.site-navigation a:hover {
color: lighten(rowColor, 35);
}
.primary-navigation li:hover > a,
.primary-navigation li.focus > a {
background-color: lighten(rowColor, 5) !important;
}
.primary-navigation ul ul a:hover,
.primary-navigation ul ul li.focus > a {
background-color: lighten(rowColor, 25);
}
a:active,
a:hover {
if light(rowColor) {
color: darken(rowColor, 40)
}
else {
color: lighten(rowColor, 40)
}
}
.primary-navigation ul ul {
background-color: lighten(rowColor, 35);
}
.children {
margin-left: 19px !important;
border-style: solid;
padding-left: 15px;
border-left-width: 5px;
border-color: #7373731f;
}
if darkMode {
table,
th,
td {
background-color: lighten(#393939, 20) !important;
border: 1px solid rgb(153, 153, 153);
}
.children {
margin-left: 19px !important;
border-style: solid;
padding-left: 15px;
border-left-width: 5px;
border-color: #ffffff1f;
}
input,
textarea {
background: #525252;
}
body,
button,
input,
select,
textarea {
color: #fff;
}
.site {
background-color: #393939;
}
.post-navigation .meta-nav {
color: #8c8c8c;
}
.post-navigation a,
.image-navigation a {
color: #fff;
border-bottom: 1px solid rgba(227, 227, 227, .1);
}
.nav-links {
border-top: 1px solid rgba(227, 227, 227, .1);
}
.site-content .entry-header,
.site-content .entry-meta {
background-color: #393939;
}
.cat-links a {
color: #fff;
}
.site-content .entry-content,
.site-content .entry-summary,
.page-content {
background-color: #393939;
}
.entry-title a {
color: #fff;
}
#content img {
filter: hue-rotate(202deg) invert(.776) saturate(1.3);
}
.list-view .site-content .hentry {
border-color: rgba(255, 255, 255, .14) !important;
padding-top: 48px;
}
}
}
@-moz-document url-prefix("https://www.purdue.edu/freeform/me274/blog/") {
if gridMode {
/*.site-content {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}*/
@media only screen and (min-width: 1490px) {
.content-area,
.content-sidebar {
padding-top: 0px !important;
}
[id^=post-] {
display: inline-grid;
/*border-top: 1px solid rgba(0, 0, 0, 0.1) !important;*/
padding-top: 48px !important;
border: 1px solid rgba(0, 0, 0, 0.1) !important;
margin-right: 5px;
margin-left: 10px;
margin-bottom: 10px;
margin-top: 10px;
min-width: 615px;
width: 48.5% !important;
/*max-width: calc(100% / (100% / 700));*/
/* tring to get elements to scale properly */
}
}
@media screen and (min-width: 1040px) {
.full-width .archive-header,
.full-width .comments-area,
.full-width .image-navigation,
.full-width .page-header,
.full-width .page-content,
.full-width .post-navigation,
.full-width .site-content .entry-header,
.full-width .site-content .entry-content,
.full-width .site-content .entry-summary,
.full-width .site-content footer.entry-meta {
padding-right: 30px;
padding-left: 30px;
min-width: 90%;
}
}
}
else {
.site-content .entry-header,
.site-content .entry-content,
.site-content .entry-summary,
.site-content .entry-meta,
.page-content {
margin: 0 auto;
max-width: 100%;
}
}
}
@-moz-document url-prefix("https://www.purdue.edu/freeform/statics/homework/") {
.content-area {
background-color: darken(rowColor, 6)
}
@media screen {
.full-width .archive-header,
.full-width .comments-area,
.full-width .image-navigation,
.full-width .page-header,
.full-width .page-content,
.full-width .post-navigation,
.full-width .site-content .entry-header,
.full-width .site-content .entry-content,
.full-width .site-content .entry-summary,
.full-width .site-content footer.entry-meta {
background-color: darken(rowColor, 6) !important;
}
p,
h1,
td,
table {
color: #fff;
border-color: rgb(255, 255, 255) !important;
}
a {
color: #55d737;
}
body {
background: #151515;
color: white;
font-family: Arial, Helvetica, sans-serif !important;
}
li {
padding: 2px;
}
table {
margin-left: auto;
margin-right: auto;
border-collapse: collapse;
font-size: 0.9em;
min-width: 400px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
table-layout: initial;
border: 1px hidden #000 !important;
white-space: nowrap;
}
table,
th,
td {
color: lighten(rowColor, 25);
font-size: 20px;
border: 1px hidden black;
font-family: Arial, Helvetica, sans-serif !important;
}
th {
background-color: lighten(rowColor, 15);
color: lighten(rowColor, 45);
text-align: left;
}
th,
td {
padding: 12px 15px;
text-align: left;
}
tbody tr {
border-bottom: 1px solid #dddddd !important;
}
tr:nth-of-type(even) {
background-color: rowColor;
}
tr:nth-of-type(odd) {
/*if light(rowColor)*/...