Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-08-25 00:53:48 +00:00
Code Issues Actions Projects Releases Wiki Activity

add sass/scratch.scss and associated sass files

Browse Source
This commit is contained in:
Tchama
2018-12-18 17:46:30 +01:00
parent e31560f622
commit 472eda01e4
123 changed files with 8932 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
Resources/public/sass/modules/_alerts.scss Normal file
View File

@@ -0,0 +1,15 @@
.success {
@include alert($green);
}
.error {
@include alert($red);
}
.alert {
@include alert($orange);
}
.notice {
@include alert($blue);
}

12
Resources/public/sass/modules/_buttons.scss Normal file
View File

@@ -0,0 +1,12 @@
.sc-button {
@include button($grey-15, $button-text-color);
&.blue { @include button($blue, $white); }
&.green { @include button($green, $white); }
&.orange { @include button($orange, $white); }
&.red { @include button($red, $white); }
&.black { @include button($grey-90, $white); }
&.white { @include button($white, $text-color); }
}
@import "../custom/modules/buttons";

7
Resources/public/sass/modules/_content.scss Normal file
View File

@@ -0,0 +1,7 @@
html, body {
height: 100%;
}
.content {
min-height: 85%;
}

65
Resources/public/sass/modules/_footer.scss Normal file
View File

@@ -0,0 +1,65 @@
.footer {
background: $footer-background;
padding-top: $footer-vertical-padding;
padding-bottom: $footer-vertical-padding;
width: 100%;
.footer-logo {
text-align: center;
margin-bottom: 2em;
img {
height: 3em;
}
}
.footer-links {
@include gridle_clear(both);
margin-bottom: $base-spacing;
@include gridle(8);
@include gridle_centered();
}
ul {
margin-bottom: $base-spacing*2;
@include gridle (4);
list-style-type: none;
}
li {
text-align: center;
}
li a {
color: $footer-link-color;
&:hover {
color: transparentize($footer-color, 0);
}
}
li h3 {
color: $footer-color;
font-size: 1em;
font-weight: 800;
margin-bottom: .4em;
}
hr {
@include gridle_clear(both);
border: 1px solid transparentize($footer-disclaimer-color, .3);
margin: 0 auto $base-spacing;
width: 12em;
}
p {
@include gridle_clear(both);
color: $footer-disclaimer-color;
font-size: .9em;
line-height: 1.5em;
margin: auto;
max-width: 35em;
text-align: center;
}
}

145
Resources/public/sass/modules/_forms.scss Normal file
View File

@@ -0,0 +1,145 @@
fieldset {
border: none;
margin: 0 0 ($base-spacing / 2) 0;
padding: $base-spacing;
}
input,label, select {
display: block;
/* font-family: $form-font-family;
font-size: $form-font-size; */
}
label {
padding-top: $base-spacing / 3;
padding-bottom: $base-spacing / 3;
font-weight: bold;
margin-bottom: $base-spacing / 4;
&.required:after {
content: "*";
color: $red;
font-weight: 900;
}
abbr {
display: none;
}
}
.inline-choice {
white-space:nowrap;
label {
white-space:normal;
display: inline;
line-height: 1 + ((2 * $base-spacing) / 3);
margin-right: 1em;
font-weight: normal;
}
}
textarea,
//input,
#{$all-text-inputs},
select[multiple=multiple] {
//@include box-sizing(border-box);
//@include transition(border-color);
background-color: white;
@include border-top-radius($form-border-radius);
@include border-bottom-radius($form-border-radius);
border: $form-border-size solid $form-border-color;
box-shadow: none;
//box-shadow: $form-box-shadow;
/*font-family: $form-font-family;
font-size: $form-font-size; */
margin-bottom: $base-spacing / 4;
padding: ($base-spacing / 3) ($base-spacing / 3);
width: 100%;
&:hover {
border-color: $form-border-color-hover;
}
&:focus {
border-color: $form-border-color-focus;
box-shadow: $form-box-shadow-focus;
outline: none;
}
}
textarea {
resize: vertical;
}
input[type="search"] {
//@include appearance(none);
}
input[type="checkbox"],
input[type="radio"] {
display: inline;
margin-right: $base-spacing / 4;
}
input[type="file"] {
padding-bottom: $base-spacing / 2;
width: 100%;
}
select {
margin-bottom: $base-spacing / 4;
padding-top: ($base-spacing / 5);
padding-bottom: ($base-spacing / 5);
width: 100%;
}
form {
p {
&.tip {
font-size: .875em;
position: relative;
text-align: center;
margin-top: -.3em;
}
&.label {
padding: 0;
//margin: 0;
//color: $text-color;
white-space: normal;
}
}
fieldset {
border: none;
margin-bottom: 1.5em;
padding: 0;
margin: 0;
legend {
font-size: 1.438em;
font-weight: 700;
width: 100%;
border-bottom: 3px solid #ddd;
margin-bottom: 1em;
& + * {
-webkit-margin-top-collapse: separate; // webkit hack that makes the legend margins work like they should
}
h2 {
margin-bottom: 0;
}
}
}
li {
label {
display: inline-block;
font-weight: normal;
}
}
}
@import "../custom/modules/forms";

299
Resources/public/sass/modules/_navigation.scss Normal file
View File

@@ -0,0 +1,299 @@
.navigation {
//$navigation-nav-button-background: $base-accent-color;
//$navigation-nav-button-background-hover: lighten($navigation-background, 10);
//$navigation-nav-button-border: 1px solid lighten($navigation-nav-button-background, 20);
//$navigation-search-background: lighten($navigation-background, 5);
//$navigation-search-border: 1px solid darken($navigation-background, 5);
//$horizontal-bar-mode: $large-screen;
background-color: $navigation-background;
border-bottom: $navigation-border-bottom;
height: $navigation-height;
//width: 100%;
z-index: 999;
.logo-container {
height: $navigation-height;
&:before { /* create a full-height inline block pseudo=element */
content: ' ';
display: inline-block;
vertical-align: middle; /* vertical alignment of the inline element */
height: 100%;
}
img.logo {
max-width: 89%;
max-height: $navigation-height - 10px;
display: inline-block;
vertical-align: middle;
}
}
// Nav menu
.nav {
z-index: 9999999;
height: $navigation-height;
//float: none;
}
ul.navigation-menu {
-webkit-transform-style: preserve-3d; // stop webkit flicker
clear: both;
display: none;
margin: 0 auto;
overflow: visible;
padding: 0;
width: 100%;
z-index: 9999;
//@include media ($horizontal-bar-mode) {
display: inline-block;
margin: 0;
padding: 0;
//}
}
// The nav items
ul li.nav-link {
background: $navigation-background;
display: block;
line-height: $navigation-height;
overflow: hidden;
padding-right: .8em;
text-align: right;
width: 100%;
z-index: 9999;
// @include media ($horizontal-bar-mode) {
background: transparent;
display: inline;
line-height: $navigation-height;
text-decoration: none;
width: auto;
// }
a {
color: $navigation-color;
display: inline-block;
font-weight: 400;
//@include media ($horizontal-bar-mode) {
padding-right: 1em;
//}
&:hover {
color: $navigation-color-hover;
}
}
}
.active-nav-item a {
border-bottom: 1px solid $navigation-active-link-color;
padding-bottom: 3px;
}
// Sub menus
li.more.nav-link {
padding-right: 0;
// @include media($large-screen) {
padding-right: $navigation-submenu-padding;
// }
> ul > li:first-child a {
padding-top: $navigation-first-padding-top;
}
a {
margin-right: $navigation-submenu-padding;
}
> a {
padding-right: 0.6em;
}
> a:after {
@include position(absolute, auto -.4em auto auto);
content: $navigation-more-pin;
color: $navigation-more-pin-color;
}
}
li.more {
overflow: visible;
padding-right: 0;
a {
padding-right: .8em;
}
> a {
padding-right: 1.6em;
position: relative;
//@include media($large-screen) {
margin-right: $navigation-submenu-padding;
//}
&:after {
content: '›';
font-size: 1.2em;
position: absolute;
right: $navigation-submenu-padding / 2;
}
}
&:hover > .submenu {
display: block;
}
//@include media($horizontal-bar-mode) {
padding-right: .8em;
position: relative;
//}
}
ul.submenu {
display: none;
padding-left: $navigation-ul-submenu-padding-left;
//@include media($horizontal-bar-mode) {
left: -$navigation-submenu-padding;
position: absolute;
top: $navigation-ul-submenu-top;
//}
.submenu {
//@include media($horizontal-bar-mode) {
left: $navigation-submenu-width - .2em;
top: 0;
//}
}
li {
display: block;
padding-right: 0;
//@include media($horizontal-bar-mode) {
line-height: $navigation-height / 1.3;
&:first-child > a {
border-top-left-radius: $navigation-border-radius;
border-top-right-radius: $navigation-border-radius;
}
&:last-child > a {
border-bottom-left-radius: $navigation-border-radius;
border-bottom-right-radius: $navigation-border-radius;
padding-bottom: $navigation-last-padding-bottom;
}
//}
a {
background-color: darken($navigation-background, 3);
display: inline-block;
text-align: right;
width: 100%;
//@include media($horizontal-bar-mode) {
background-color: $navigation-background;
padding-left: $navigation-submenu-padding;
text-align: left;
//width: $navigation-submenu-width;
//}
}
}
}
// Elements on the far right
.navigation-search {
padding: $navigation-search-padding;
position: relative;
input[type=search] {
//background: $navigation-search-background;
//border: $navigation-search-border;
padding: .6em .55em;
padding-right: 3.5em;
width: calc(100% - 4.5em);
//padding: .6em .8em;
//padding: 0 30px 0 10px;
font-size: .9em;
//color: $navigation-color;
//border-radius: $navigation-border-radius * 2;
margin: 0;
}
button {
padding: 7px 12px;
position: absolute;
top: .99em;
right: 1em;
}
}
ul li.nav-link2 {
position: relative;
padding-right: 2em;
text-align: left;
line-height: $navigation-height;
z-index: 9999;
float: left;
list-style: none;
& div.li-content {
display: inline-block;
line-height: normal;
vertical-align: middle;
a.more:after {
content: $navigation-more-pin;
color: $navigation-more-pin-color;
padding-left: 0.4em;
font-size: 1.2em;
}
}
ul {
display: none;
position: absolute;
line-height: normal;
list-style: none;
background-color: #333;
padding-right: 1.5em;
padding-left: 1.5em;
width: 100%;
}
ul {
li {
padding-top:0.7em;
padding-bottom:0.7em;
&:first-child {
padding-top: $navigation-first-padding-top;
}
&:last-child {
padding-bottom: $navigation-first-padding-top;
}
}
}
&:hover ul {
display: block;
}
a {
width: 100%;
color: $navigation-color;
font-weight: 400;
&:hover {
color: $navigation-color-hover;
}
}
}
}
@import "../custom/modules/navigation";

33
Resources/public/sass/modules/_table.scss Normal file
View File

@@ -0,0 +1,33 @@
table {
width: $table-width;
thead {
background-color: $table-head-bg-color;
tr th {
border: $table-head-td-border;
text-align: $table-head-td-text-align;
padding: $table-head-td-padding;
color: $table-head-text-color;
}
}
tbody {
tr {
td {
border: $table-body-td-border;
text-align: $table-body-td-text-align;
padding: $table-body-td-padding;
color: $table-body-text-color;
}
&:nth-of-type(even) {
background-color: $table-body-tr-bg-color-even;
}
&:nth-of-type(odd) {
background-color: $table-body-tr-bg-color-odd;
}
}
}
}

48
Resources/public/sass/modules/_tabs.scss Normal file
View File

@@ -0,0 +1,48 @@
/* Tabs */
$navigation-color: $red;
$gutter : 4;
$norm: 5;
$body-font-color: $white;
$default-color: $green;
$global-bg-color: $yellow;
.tab-nav {
margin: 0.5em 0;
padding: 0;
> li {
font-family: $tabs-nav-font-family;
display: inline-block;
width: 100%;
cursor: default;
@include border-top-radius($base-border-radius);
@include border-bottom-radius($base-border-radius);
margin-bottom: $tabs-nav-margin-bottom;
&.title {
padding: $tabs-nav-title-padding;
font-weight: 900;
background-color: $tabs-nav-title-bg-color;
color: $tabs-nav-title-text-color;
}
> a {
display: block;
width: auto;
padding: $tabs-nav-padding;
margin: 0;
color: $tabs-nav-text-color;
cursor: pointer;
border: $tabs-new-border;
background-color: $tabs-nav-bg-color;
@include border-top-radius($base-border-radius);
@include border-bottom-radius($base-border-radius);
&:hover, &:active {
border: $tabs-nav-hover-border;
color: $tabs-nav-hover-text-color;
text-decoration: none;
}
}
}
}

23
Resources/public/sass/modules/_typography.scss Normal file
View File

@@ -0,0 +1,23 @@
ul {
&.unstyled {
list-style: none;
padding-left: 0em;
ul {
list-style:disc outside;
}
}
}
a {
color: $base-link-color;
text-decoration: none;
&:hover {
color: $hover-link-color;
}
}
.text-right {
text-align: right;
}