mirror of
https://github.com/neocities/neocities.git
synced 2025-04-25 17:52:39 +02:00
3e2cdcd138
included all dev and production files for new redesign. the index file has a different layout than the interior page files. for more in-depth look into how these are set up, look in the templates > includes & layouts folders. I used .liquid files to create these pages, and all the content for the files are in there, with the base layout stuff in the includes and layout files. check the converted-html folder to see how everything should look. (test it on an android phone. should look good now) :)
50 lines
1.7 KiB
SCSS
50 lines
1.7 KiB
SCSS
// ----------------------------------------------------------------
|
|
// Project Specific Extended HTML Stylings
|
|
// ----------------------------------------------------------------
|
|
body{background:#CCDF9B}
|
|
|
|
// Highlight Text Selection
|
|
::-moz-selection {background:$c-Brand-1; color:$c-Light; text-shadow:none}
|
|
::selection {background:$c-Brand-1; color:$c-Light; text-shadow:none}
|
|
|
|
// Full container for the entire page.
|
|
.page{}
|
|
|
|
// Generic tag to wrap around content within sections to apply a max width to the interior content
|
|
// while allowing for larger sections to expand the whole page for BG purposes
|
|
.content{
|
|
margin:0 auto; max-width:1000px; padding:$spacing*5;
|
|
& > :last-child{margin-bottom:0} // kill any extra margin on the last element in the .content div
|
|
}
|
|
|
|
// ----------------------------------------------------------------
|
|
// Project Specific Link Stylings
|
|
// ----------------------------------------------------------------
|
|
a{
|
|
color:$c-Link;
|
|
&:hover, &:active{color:darken($c-Link, 15%)}
|
|
&:visited{color:darken($c-Link, 30%)}
|
|
}
|
|
// example - :hover{color:darken($c-Link, 15%)}
|
|
|
|
// Outlines - kill or keep. It's your project
|
|
:focus, a:focus, a:active, input[type="submit"]::-moz-focus-inner{outline:none}
|
|
|
|
.col-33, .col-40, .col-60{
|
|
@media (max-device-width:480px), screen and (max-width:800px){
|
|
float:none;
|
|
width:100%;
|
|
}
|
|
}
|
|
|
|
.col-50{
|
|
@media (max-device-width:480px), screen and (max-width:800px){
|
|
float:none;
|
|
padding:0;
|
|
width:100%;
|
|
}
|
|
}
|
|
|
|
@import 'project-Header'; // Project Specific Header Styling
|
|
@import 'project-Main'; // Project Specific Main Content Area Styling
|
|
@import 'project-Footer'; // Project Specific Footer Styling
|