Initial commit
This commit is contained in:
290
colormag/SCSS/dark.scss
Normal file
290
colormag/SCSS/dark.scss
Normal file
@@ -0,0 +1,290 @@
|
||||
@import 'variables/colors';
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
Dark CSS
|
||||
--------------------------------------------------------------*/
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: $white;
|
||||
}
|
||||
body {
|
||||
background-color: $dark-background;
|
||||
color: $color_gray_seven;
|
||||
}
|
||||
|
||||
.dark-skin{
|
||||
#site-description {
|
||||
color: $white;
|
||||
}
|
||||
#page,
|
||||
#header-text-nav-container,
|
||||
.news-bar,
|
||||
#main,
|
||||
#secondary .widget {
|
||||
background-color: $dark-page-background;
|
||||
}
|
||||
.news-bar {
|
||||
background-color: $dark-news-background;
|
||||
}
|
||||
.main-small-navigation {
|
||||
li {
|
||||
background-color: $color_gray_one;
|
||||
}
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
.date-in-header {
|
||||
color: $color_gray_seven;
|
||||
}
|
||||
|
||||
.breaking-news-latest {
|
||||
color: $white;
|
||||
}
|
||||
.search-form-top {
|
||||
background-color: $dark-footer-socket;
|
||||
border: 0 none;
|
||||
}
|
||||
|
||||
.widget_featured_posts {
|
||||
.single-article {
|
||||
background: none;
|
||||
box-shadow: 0 0 0 0 transparent;
|
||||
}
|
||||
|
||||
.article-content {
|
||||
.entry-title {
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.below-entry-meta {
|
||||
.posted-on,
|
||||
.byline,
|
||||
.comments {
|
||||
.fa {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.posted-on,
|
||||
.byline,
|
||||
.comments {
|
||||
a {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
|
||||
.comments {
|
||||
span {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
|
||||
.thumbnail-slider {
|
||||
border-color: $dark-page-background;
|
||||
}
|
||||
|
||||
#comments {
|
||||
border-color: $color_gray_three;
|
||||
}
|
||||
|
||||
#content {
|
||||
.post {
|
||||
.article-content {
|
||||
.entry-title a {
|
||||
color: $white;
|
||||
}
|
||||
|
||||
.below-entry-meta {
|
||||
.byline,
|
||||
.comments,
|
||||
.tag-links,
|
||||
.edit-link,
|
||||
.posted-on,
|
||||
.post-views {
|
||||
.fa {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
|
||||
.post-views {
|
||||
span {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
|
||||
.edit-link {
|
||||
a {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.single-related-posts {
|
||||
.article-content {
|
||||
.entry-title {
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
.below-entry-meta {
|
||||
.posted-on,
|
||||
.comments {
|
||||
.fa {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post,
|
||||
.search {
|
||||
.entry-title {
|
||||
a {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.random_posts_widget_inner_wrap,
|
||||
.single-related-posts {
|
||||
box-shadow: 0 0 0 0 transparent;
|
||||
}
|
||||
|
||||
.footer-widgets-wrapper,
|
||||
.footer-socket-wrapper {
|
||||
border-top: 0 none;
|
||||
background-color:$dark-footer-socket;
|
||||
}
|
||||
|
||||
#colophon .tg-upper-footer-widgets .widget {
|
||||
border: 0 none;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="email"],
|
||||
input[type="password"],
|
||||
textarea,
|
||||
.comment-content {
|
||||
background-color: $dark-page-background;
|
||||
color: $color_gray_seven;
|
||||
border-color: $color_gray_five;
|
||||
}
|
||||
.view-all-link {
|
||||
background :$dark-page-background;
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
Header Clean layout CSS
|
||||
--------------------------------------------------------------*/
|
||||
#masthead {
|
||||
&.colormag-header-clean {
|
||||
.main-navigation {
|
||||
.sub-menu,
|
||||
.children {
|
||||
background-color: $news-background;
|
||||
}
|
||||
}
|
||||
.main-small-navigation {
|
||||
li {
|
||||
background-color:$news-background;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.colormag-header-clean,
|
||||
&.colormag-header-classic {
|
||||
.breaking-news .newsticker a,
|
||||
.social-links i.fa {
|
||||
color: $color_gray_seven;
|
||||
}
|
||||
}
|
||||
|
||||
&.colormag-header-classic {
|
||||
.is-sticky {
|
||||
#site-navigation {
|
||||
background-color: $news-background;
|
||||
}
|
||||
|
||||
.main-small-navigation li {
|
||||
background-color: $news-background;
|
||||
}
|
||||
}
|
||||
|
||||
#site-navigation {
|
||||
.menu-toggle {
|
||||
border-color: $color_gray_seven;
|
||||
&::before {
|
||||
color:$color_gray_seven;
|
||||
}
|
||||
}
|
||||
|
||||
&.main-navigation {
|
||||
ul {
|
||||
ul.sub-menu,
|
||||
.children {
|
||||
background-color: $news-background;
|
||||
border-color: $color_gray_three;
|
||||
|
||||
li {
|
||||
border-color: $color_gray_three;
|
||||
}
|
||||
}
|
||||
}
|
||||
a,
|
||||
.random-post a .fa-random,
|
||||
.home-icon .fa {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
&.main-small-navigation .random-post a .fa-random,
|
||||
.fa.search-top {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.colormag-footer--classic {
|
||||
.footer-widgets-wrapper {
|
||||
background-color: $medium-footer-socket;
|
||||
}
|
||||
.footer-socket-wrapper {
|
||||
background-color: $dark-footer-socket;
|
||||
}
|
||||
}
|
||||
.elementor {
|
||||
.tg-module-wrapper {
|
||||
color: $color_gray_seven;
|
||||
|
||||
.tg-module-title {
|
||||
color: $white;
|
||||
}
|
||||
.tg-module-meta {
|
||||
.tg-post-auther-name,
|
||||
.tg-post-date,
|
||||
.tg-module-comments {
|
||||
a,
|
||||
span {
|
||||
color: $light-content;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
30
colormag/SCSS/footer/_footer.scss
Normal file
30
colormag/SCSS/footer/_footer.scss
Normal file
@@ -0,0 +1,30 @@
|
||||
/*--------------------------------------------------------------
|
||||
Classic Layout
|
||||
--------------------------------------------------------------*/
|
||||
.colormag-footer--classic {
|
||||
.footer-widgets-area {
|
||||
.widget-title {
|
||||
border-bottom: 0 none;
|
||||
|
||||
span {
|
||||
background-color: transparent !important;
|
||||
padding: 0 0 6px;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
position: absolute;
|
||||
display: block;
|
||||
bottom: -1px;
|
||||
content: ' ';
|
||||
left: 0;
|
||||
width: 25px;
|
||||
height: 2px;
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.footer-socket-wrapper {
|
||||
background-color: $footer-socket;
|
||||
}
|
||||
}
|
||||
676
colormag/SCSS/header/_header.scss
Normal file
676
colormag/SCSS/header/_header.scss
Normal file
@@ -0,0 +1,676 @@
|
||||
#masthead {
|
||||
.main-small-navigation {
|
||||
ul {
|
||||
&.menu-scrollbar {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
li {
|
||||
&:hover,
|
||||
&.current-page-ancestor,
|
||||
&.current-menu-ancestor,
|
||||
&.current-page-item,
|
||||
&.current-menu-item {
|
||||
> a {
|
||||
color: $white;
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
Clean Layout
|
||||
--------------------------------------------------------------*/
|
||||
|
||||
&.colormag-header-clean {
|
||||
.date-in-header {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.news-bar {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.breaking-news {
|
||||
float: left;
|
||||
|
||||
.breaking-news-latest {
|
||||
background: $news-background;
|
||||
padding: 0 10px;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
color:$white;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.newsticker {
|
||||
padding-left: 10px;
|
||||
text-align: left;
|
||||
position: relative;
|
||||
a {
|
||||
color: $color_gray_four;
|
||||
|
||||
&:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.social-links {
|
||||
i.fa {
|
||||
color: $social-icon-color;
|
||||
transition: color 0.35s;
|
||||
font-size: 16px;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
li {
|
||||
&:hover {
|
||||
i.fa {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#header-text-nav-wrap {
|
||||
padding: 30px 0;
|
||||
}
|
||||
|
||||
.home-icon {
|
||||
|
||||
.fa {
|
||||
font-size: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
#site-navigation {
|
||||
box-shadow: 0 0 0 rgba(0, 0, 0, 0 ) inset;
|
||||
position: relative;
|
||||
background-color:transparent;
|
||||
border-top: 0 solid transparent;
|
||||
z-index: 999;
|
||||
|
||||
.inner-wrap {
|
||||
background-color: $news-background;
|
||||
}
|
||||
|
||||
.fa.search-top {
|
||||
padding: 20px;
|
||||
line-height: 26px;
|
||||
position: relative;
|
||||
float: right;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.random-post {
|
||||
position: relative;
|
||||
float: right;
|
||||
}
|
||||
|
||||
.search-form-top {
|
||||
top: 100%;
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
line-height: 26px;
|
||||
|
||||
&::before {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-navigation {
|
||||
a {
|
||||
font-weight: 500;
|
||||
padding: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
ul {
|
||||
li {
|
||||
ul {
|
||||
top: 100%;
|
||||
|
||||
li {
|
||||
a {
|
||||
width: auto;
|
||||
padding: 10px 15px;
|
||||
}
|
||||
|
||||
ul {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.focus > ul {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-small-navigation {
|
||||
.menu-primary-container,
|
||||
.nav-menu,
|
||||
.menu {
|
||||
padding-top: 0;
|
||||
padding-top: 0;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.random-post {
|
||||
line-height: 26px;
|
||||
|
||||
a {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------
|
||||
classic Layout
|
||||
--------------------------------------------------------------*/
|
||||
|
||||
&.colormag-header-classic {
|
||||
.date-in-header {
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
.news-bar {
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.breaking-news {
|
||||
float: left;
|
||||
|
||||
.breaking-news-latest {
|
||||
background: $news-background;
|
||||
padding: 0 10px;
|
||||
color:$white;
|
||||
font-weight: 400;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.newsticker {
|
||||
padding-left: 10px;
|
||||
position: relative;
|
||||
text-align: left;
|
||||
|
||||
a {
|
||||
color: $color_gray_four;
|
||||
|
||||
&:hover {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.social-links {
|
||||
i.fa {
|
||||
color: $social-icon-color;
|
||||
transition: color 0.35s;
|
||||
font-size: 16px;
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
li {
|
||||
&:hover {
|
||||
i.fa {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#header-text-nav-wrap {
|
||||
padding: 30px 0 20px;
|
||||
|
||||
#header-right-section {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#header-left-section {
|
||||
float: none;
|
||||
text-align: center;
|
||||
|
||||
#header-logo-image,
|
||||
#header-text {
|
||||
float: none;
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#site-navigation {
|
||||
box-shadow: 0 0 0 rgba(0, 0, 0, 0 ) inset;
|
||||
position: relative;
|
||||
background-color:transparent;
|
||||
border-top: 0 solid transparent;
|
||||
z-index: 999;
|
||||
|
||||
.inner-wrap {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
.fa.search-top {
|
||||
color: $menu-link-color;
|
||||
float: right;
|
||||
font-size: 16px;
|
||||
padding: 15px;
|
||||
|
||||
&:hover {
|
||||
background: transparent;
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
line-height: 26px;
|
||||
border: 1px solid $menu-link-color;
|
||||
|
||||
&::before {
|
||||
padding: 20px;
|
||||
color: $menu-link-color;;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
border-color: $primary;
|
||||
|
||||
&::before {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-navigation {
|
||||
a {
|
||||
font-weight: 700;
|
||||
padding: 10px 15px;
|
||||
line-height: 26px;
|
||||
color: $menu-link-color;
|
||||
|
||||
&::after {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
li a {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
> li {
|
||||
float: none;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
|
||||
> a {
|
||||
border-bottom: 2px solid transparent;
|
||||
transition: border 0.5s ease;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.current-menu-item,
|
||||
&.current-menu-ancestor {
|
||||
> a {
|
||||
background-color: transparent;
|
||||
border-bottom: 2px solid $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
li.focus {
|
||||
>a {
|
||||
border-color: $primary;
|
||||
}
|
||||
> ul {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
|
||||
ul.sub-menu {
|
||||
top: 100%;
|
||||
background-color: $color_gray_ten;
|
||||
transition: all 0.3s ease;
|
||||
display: block;
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
border: 1px solid $color_gray_eight;
|
||||
|
||||
li {
|
||||
border-bottom:1px solid $color_gray_eight;
|
||||
display: block;
|
||||
|
||||
a {
|
||||
width: auto;
|
||||
padding: 10px 15px;
|
||||
transition: all 0.5s ease;
|
||||
border-bottom: none transparent;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&.current-menu-ancestor,
|
||||
&.current-menu-item,
|
||||
&.focus {
|
||||
border-color: $primary;
|
||||
background-color: transparent;
|
||||
|
||||
> a {
|
||||
color: $white;
|
||||
background-color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none transparent;
|
||||
}
|
||||
|
||||
ul {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
li.menu-item-has-children {
|
||||
&:hover {
|
||||
> ul.sub-menu {
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.random-post {
|
||||
|
||||
a {
|
||||
font-size: 14px;
|
||||
padding: 10px 15px;
|
||||
color: $menu-link-color;
|
||||
|
||||
&:hover {
|
||||
background: transparent;
|
||||
|
||||
.fa-random {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
|
||||
.fa-random {
|
||||
color: $menu-link-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.home-icon {
|
||||
background: none;
|
||||
|
||||
a {
|
||||
padding: 10px 15px;
|
||||
|
||||
&:hover {
|
||||
|
||||
.fa {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
color: $menu-link-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-small-navigation {
|
||||
.menu-primary-container,
|
||||
.nav-menu {
|
||||
padding-top: 0;
|
||||
padding-top: 0;
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
width: 100%;
|
||||
box-shadow: 0 1px 11px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.random-post {
|
||||
bottom: 0;
|
||||
|
||||
a {
|
||||
font-size: 14px;
|
||||
padding: 12px 15px;
|
||||
color: $menu-link-color;
|
||||
|
||||
.fa-random {
|
||||
color: $menu-link-color;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background: transparent;
|
||||
|
||||
.fa-random {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
background-color: $primary;
|
||||
border-color: $primary;
|
||||
|
||||
&::before {
|
||||
color: $white;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.is-sticky {
|
||||
#site-navigation {
|
||||
background-color: $white;
|
||||
box-shadow: 0 5px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.better-responsive-menu{
|
||||
.main-small-navigation .menu-primary-container {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
#masthead {
|
||||
.main-small-navigation {
|
||||
li {
|
||||
&:hover,
|
||||
&.current-page-ancestor,
|
||||
&.current-menu-ancestor,
|
||||
&.current-page-item,
|
||||
&.current-menu-item {
|
||||
> .sub-toggle {
|
||||
background-color: $white;
|
||||
|
||||
i {
|
||||
color: $primary;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.colormag-header-clean {
|
||||
#menu-primary {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.date-in-header,
|
||||
.social-links {
|
||||
float: none;
|
||||
text-align: center;
|
||||
}
|
||||
.breaking-news {
|
||||
width: 100%;
|
||||
float: none;
|
||||
margin-bottom: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#header-text-nav-wrap {
|
||||
padding: 0 0 20px;
|
||||
}
|
||||
|
||||
#header-left-section,
|
||||
#header-logo-image {
|
||||
margin-bottom: 0;
|
||||
|
||||
}
|
||||
|
||||
#site-navigation {
|
||||
.random-post {
|
||||
a {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle::before,
|
||||
.fa.search-top {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.main-small-navigation {
|
||||
|
||||
.home-icon {
|
||||
|
||||
a {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle {
|
||||
background-color: $primary;
|
||||
}
|
||||
|
||||
.random-post {
|
||||
a {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.colormag-header-classic {
|
||||
#menu-primary {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.date-in-header,
|
||||
.breaking-news,
|
||||
.social-links {
|
||||
width: 100%;
|
||||
float: none;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#header-text-nav-wrap {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#header-left-section,
|
||||
#header-logo-image {
|
||||
margin-bottom: 0;
|
||||
|
||||
}
|
||||
|
||||
.main-small-navigation {
|
||||
.menu-toggle {
|
||||
background-color: $primary;
|
||||
border-color: $primary;
|
||||
}
|
||||
|
||||
.random-post {
|
||||
a {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#site-navigation {
|
||||
.random-post {
|
||||
a {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.menu-toggle::before,
|
||||
.fa.search-top {
|
||||
padding: 15px;
|
||||
line-height: 26px;
|
||||
}
|
||||
|
||||
.home-icon {
|
||||
|
||||
a {
|
||||
padding: 15px;
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.breaking-news {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.better-responsive-menu {
|
||||
.main-small-navigation .menu-primary-container {
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
#masthead {
|
||||
&.colormag-header-classic,
|
||||
&.colormag-header-clean {
|
||||
|
||||
.date-in-header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.breaking-news {
|
||||
.breaking-news-latest {
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.newsticker {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
22
colormag/SCSS/style.scss
Normal file
22
colormag/SCSS/style.scss
Normal file
@@ -0,0 +1,22 @@
|
||||
/*
|
||||
Theme Name: ColorMag
|
||||
Theme URI: https://themegrill.com/themes/colormag/
|
||||
Author: ThemeGrill
|
||||
Author URI: https://themegrill.com
|
||||
Description: ColorMag is a perfect responsive magazine style WordPress theme. Suitable for news, newspaper, magazine, publishing, business and any kind of sites. Get free support at https://themegrill.com/support-forum/ and check the demo at https://demo.themegrill.com/colormag/
|
||||
Version: 1.4.2
|
||||
License: GNU General Public License, version 3 (GPLv3)
|
||||
License URI: http://www.gnu.org/licenses/gpl-3.0.txt
|
||||
Tags: one-column, two-columns, right-sidebar, left-sidebar, flexible-header, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, featured-images, theme-options, post-formats, footer-widgets, blog, e-commerce, news, rtl-language-support
|
||||
Text Domain: colormag
|
||||
|
||||
Resetting and rebuilding styles have been helped along thanks to the fine work of
|
||||
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
|
||||
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
|
||||
and Blueprint http://www.blueprintcss.org/
|
||||
*/
|
||||
|
||||
@import 'variables/colors';
|
||||
@import 'theme/theme-style';
|
||||
@import 'header/header';
|
||||
@import 'footer/footer';
|
||||
3372
colormag/SCSS/theme/_theme-style.scss
Normal file
3372
colormag/SCSS/theme/_theme-style.scss
Normal file
File diff suppressed because it is too large
Load Diff
65
colormag/SCSS/variables/_colors.scss
Normal file
65
colormag/SCSS/variables/_colors.scss
Normal file
@@ -0,0 +1,65 @@
|
||||
/*========== Gray colors ==========*/
|
||||
|
||||
/*===== Light colors ======*/
|
||||
$white:#fff;
|
||||
$color_gray_eleven: darken($white, 2.5% ); // #f9f9f9
|
||||
$color_gray_ten: darken($white, 2.6% ); // #f8f8f8
|
||||
$color_gray_nine: darken($white, 5% ); //#f2f2f2
|
||||
$color_gray_eight: darken($white, 8.4% ); // #eaeaea
|
||||
$color_gray_seven: darken($white, 20% ); // #cccccc
|
||||
$black: #000000;
|
||||
$color_gray_one: lighten($black, 13.6%); // #232323
|
||||
$color_gray_two: lighten($black, 20%); // #333333
|
||||
$color_gray_three: lighten($black, 26.5%); // #444444
|
||||
$color_gray_four: lighten($black, 33.5%); // #555555
|
||||
$color_gray_five: lighten($black, 46.5%); // #777777
|
||||
$color_gray_six: lighten($black, 53.5%); // #888888
|
||||
|
||||
/*========== Brand-colors ==========*/
|
||||
|
||||
$primary:#289dcc;
|
||||
$color-title:#424143;
|
||||
$body-background: #eaeaea;
|
||||
$dark-background:#151515;
|
||||
$news-background: #212529;
|
||||
$social-icon-color: #495057;
|
||||
$menu-link-color: #343a40;
|
||||
$news-bar-background: #f1f3f5;
|
||||
$title-border: #5e616a;
|
||||
$footer-border: #40444f;
|
||||
$footer-socket: #252730;
|
||||
$dark-page-background:#1A1A1A;
|
||||
$dark-footer-socket:#121212;
|
||||
$medium-footer-socket:lighten($dark-footer-socket, 1.5%);
|
||||
$dark-news-background: lighten($dark-page-background, 1.5%);
|
||||
$light-content: darken($white, 35%);
|
||||
|
||||
/*========== social links colors ==========*/
|
||||
|
||||
$color-twitter: #1BB2E9;
|
||||
$color-facebook: #3B5A9B;
|
||||
$color-youtube: #ED3F41;
|
||||
$color-vimeo-square: #44BBFF;
|
||||
$color-skype: #009CEF;
|
||||
$color-linkedin: #007BB6;
|
||||
$color-google-plus: #DC4937;
|
||||
$color-github: #4183C4;
|
||||
$color-flickr: #0062DD;
|
||||
$color-dribbble: #E24D87;
|
||||
$color-instagram: #3F729B;
|
||||
$color-pinterest: #D5282E;
|
||||
$color-stumbleupon: #EC4823;
|
||||
$color-tumblr: #455469;
|
||||
$color-wordpress: #21759B;
|
||||
$color-codepen: #CCCCCC;
|
||||
$color-digg: #14589E;
|
||||
$color-reddit: #FF4500;
|
||||
$color-xing: #026466;
|
||||
$color-vk: #45668e;
|
||||
$color-weibo: #e6162d;
|
||||
$color-leanpub: #000000;
|
||||
$color-renren: #237bc2;
|
||||
$color-rss: #f26522;
|
||||
$color-soundcloud: #ff3a00;
|
||||
$color-vine: #00bf8f;
|
||||
$color-delicious: #2a96ff;
|
||||
0
colormag/SCSS/variables/_structure.scss
Normal file
0
colormag/SCSS/variables/_structure.scss
Normal file
16
colormag/SCSS/variables/_typography.scss
Normal file
16
colormag/SCSS/variables/_typography.scss
Normal file
@@ -0,0 +1,16 @@
|
||||
$font-family-body: 'Roboto', sans-serif;
|
||||
$font-family-heading: 'Raleway', sans-serif;
|
||||
|
||||
$font-size-base: 14px;
|
||||
$font-size-large: ceil(($font-size-base * 1.25)); // ~18px
|
||||
$font-size-small: ceil(($font-size-base * 0.85)); // ~12px
|
||||
|
||||
$font-size-h1: 54px;
|
||||
$font-size-h2: 36px;
|
||||
$font-size-h3: 24px;
|
||||
$font-size-h4: 18px;
|
||||
$font-size-h5: 16px;
|
||||
$font-size-h6: 14px;
|
||||
|
||||
|
||||
$line-height-base: 24px;
|
||||
Reference in New Issue
Block a user