add new demo symfony files
This commit is contained in:
26
app/assets/scss/admin.scss
Normal file
26
app/assets/scss/admin.scss
Normal file
@@ -0,0 +1,26 @@
|
||||
@import "~bootswatch/flatly/variables";
|
||||
@import "~eonasdan-bootstrap-datetimepicker/src/sass/bootstrap-datetimepicker-build.scss";
|
||||
@import "bootstrap-tagsinput.scss";
|
||||
|
||||
/* Page: 'Backend post index'
|
||||
------------------------------------------------------------------------- */
|
||||
body#admin_post_index .item-actions {
|
||||
white-space: nowrap
|
||||
}
|
||||
|
||||
body#admin_post_index .item-actions a.btn + a.btn {
|
||||
margin-left: 4px
|
||||
}
|
||||
|
||||
/* Page: 'Backend post show'
|
||||
------------------------------------------------------------------------- */
|
||||
body#admin_post_show .post-tags .label-default {
|
||||
background-color: #e9ecec;
|
||||
color: #6D8283;
|
||||
font-size: 16px;
|
||||
margin-right: 10px;
|
||||
padding: .4em 1em .5em;
|
||||
}
|
||||
body#admin_post_show .post-tags .label-default i {
|
||||
color: #95A6A7;
|
||||
}
|
360
app/assets/scss/app.scss
Normal file
360
app/assets/scss/app.scss
Normal file
@@ -0,0 +1,360 @@
|
||||
// setting the value of this variable to an empty data URL is the only working solution
|
||||
// to load the Bootswatch web fonts locally and avoid loading them from Google servers
|
||||
// see https://github.com/thomaspark/bootswatch/issues/55#issuecomment-298093182
|
||||
$web-font-path: 'data:text/css;base64,';
|
||||
|
||||
// Make sure the bootstrap-sass and lato fonts are resolved correctly
|
||||
$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
|
||||
$lato-font-path: '~lato-font/fonts';
|
||||
|
||||
@import "~bootswatch/flatly/variables";
|
||||
@import "~bootstrap-sass/assets/stylesheets/bootstrap";
|
||||
@import "~bootswatch/flatly/bootswatch";
|
||||
@import "~@fortawesome/fontawesome-free/css/all.css";
|
||||
@import "~@fortawesome/fontawesome-free/css/v4-shims.css";
|
||||
@import "~highlight.js/styles/solarized-light.css";
|
||||
|
||||
// pick the Lato fonts individually to avoid importing the entire font family
|
||||
@import '~lato-font/scss/public-api';
|
||||
@include lato-include-font('normal');
|
||||
@include lato-include-font('bold');
|
||||
|
||||
/* Basic styles
|
||||
------------------------------------------------------------------------- */
|
||||
p, ul, ol {
|
||||
font-size: 19px;
|
||||
margin-bottom: 1.5em
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: 0.5em
|
||||
}
|
||||
|
||||
code {
|
||||
background: #ecf0f1;
|
||||
color: #2c3e50
|
||||
}
|
||||
|
||||
.text-danger, .text-danger:hover {
|
||||
color: #e74c3c
|
||||
}
|
||||
|
||||
i {
|
||||
margin-right: 0.25em
|
||||
}
|
||||
|
||||
.table.table-middle-aligned th,
|
||||
.table.table-middle-aligned td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.doclink {
|
||||
color: inherit
|
||||
}
|
||||
|
||||
/* Utilities
|
||||
------------------------------------------------------------------------- */
|
||||
.m-b-0 { margin-bottom: 0 }
|
||||
|
||||
/* Page elements
|
||||
------------------------------------------------------------------------- */
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh
|
||||
}
|
||||
|
||||
header {
|
||||
margin-bottom: 2em
|
||||
}
|
||||
|
||||
header ul.nav li {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
header .locales {
|
||||
min-width: 190px;
|
||||
}
|
||||
header .locales a {
|
||||
color: #212529;
|
||||
padding: 3px 15px;
|
||||
}
|
||||
header .locales a small {
|
||||
border-radius: 4px;
|
||||
border: 2px solid #dee2e6;
|
||||
color: #7b8a8b;
|
||||
float: left;
|
||||
font-size: 12px;
|
||||
line-height: 1.1;
|
||||
margin: 2px 10px 0 0;
|
||||
min-width: 26px;
|
||||
padding: 0px 3px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
header .locales .active small,
|
||||
header .locales a:hover small {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.body-container {
|
||||
flex: 1;
|
||||
/* needed to prevent pages with a very small height and browsers not supporting flex */
|
||||
min-height: 600px
|
||||
}
|
||||
|
||||
.body-container #main h1, .body-container #main h2 {
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
#sidebar .section {
|
||||
margin-bottom: 2em
|
||||
}
|
||||
|
||||
#sidebar p {
|
||||
font-size: 15px
|
||||
}
|
||||
|
||||
#sidebar p + p {
|
||||
margin: 1.5em 0 0
|
||||
}
|
||||
|
||||
footer {
|
||||
background: #ecf0f1;
|
||||
margin-top: 2em;
|
||||
padding-top: 2em;
|
||||
padding-bottom: 2em
|
||||
}
|
||||
|
||||
footer p {
|
||||
color: #7b8a8b;
|
||||
font-size: 13px;
|
||||
margin-bottom: 0.25em
|
||||
}
|
||||
|
||||
footer #footer-resources {
|
||||
text-align: right
|
||||
}
|
||||
|
||||
footer #footer-resources i {
|
||||
color: #7b8a8b;
|
||||
font-size: 28.5px;
|
||||
margin-left: 0.5em
|
||||
}
|
||||
|
||||
#sourceCodeModal h3 {
|
||||
font-size: 19px;
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
#sourceCodeModal h3 small {
|
||||
color: #7b8a8b;
|
||||
font-size: 80%
|
||||
}
|
||||
|
||||
#sourceCodeModal pre {
|
||||
margin-bottom: 2em;
|
||||
padding: 0
|
||||
}
|
||||
|
||||
#confirmationModal .modal-dialog {
|
||||
width: 500px
|
||||
}
|
||||
|
||||
#confirmationModal .modal-footer button {
|
||||
min-width: 75px
|
||||
}
|
||||
|
||||
/* Misc. elements
|
||||
------------------------------------------------------------------------- */
|
||||
.section.rss a {
|
||||
color: #f39c12;
|
||||
font-size: 21px;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
------------------------------------------------------------------------- */
|
||||
.form-group.has-error .form-control {
|
||||
border-color: #e74c3c
|
||||
}
|
||||
|
||||
.form-group.has-error .control-label {
|
||||
color: #e74c3c
|
||||
}
|
||||
|
||||
.form-group.has-error .help-block {
|
||||
background-color: #e74c3c;
|
||||
color: #fff;
|
||||
font-size: 15px;
|
||||
padding: 1em
|
||||
}
|
||||
|
||||
.form-group.has-error .help-block ul,
|
||||
.form-group.has-error .help-block li {
|
||||
margin-bottom: 0
|
||||
}
|
||||
.form-group.has-error .help-block li + li {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
|
||||
textarea {
|
||||
max-width: 100%
|
||||
}
|
||||
|
||||
/* Page: 'Technical Requirements Checker'
|
||||
------------------------------------------------------------------------- */
|
||||
body#requirements_checker header h1 {
|
||||
margin-bottom: 0;
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
body#requirements_checker header h1 span {
|
||||
font-size: 120%;
|
||||
opacity: 0.7;
|
||||
padding: 0 5px
|
||||
}
|
||||
|
||||
body#requirements_checker .panel li {
|
||||
margin-bottom: 1em
|
||||
}
|
||||
|
||||
/* Page: 'Homepage'
|
||||
------------------------------------------------------------------------- */
|
||||
body#homepage {
|
||||
text-align: center
|
||||
}
|
||||
|
||||
/* Page: 'Login'
|
||||
------------------------------------------------------------------------- */
|
||||
body#login #login-users-help p {
|
||||
font-size: 15px;
|
||||
line-height: 1.42857
|
||||
}
|
||||
|
||||
body#login #login-users-help p:last-child {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
body#login #login-users-help p .label {
|
||||
margin-right: 5px
|
||||
}
|
||||
|
||||
body#login #login-users-help p .console {
|
||||
display: block;
|
||||
margin: 5px 0;
|
||||
padding: 10px
|
||||
}
|
||||
|
||||
/* Common Blog page elements
|
||||
------------------------------------------------------------------------- */
|
||||
.post-metadata {
|
||||
color: #b4bcc2;
|
||||
font-size: 19px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.post-metadata .metadata {
|
||||
margin-right: 1.5em;
|
||||
}
|
||||
|
||||
.post-tags .label {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
/* Page: 'Blog index'
|
||||
------------------------------------------------------------------------- */
|
||||
body#blog_index #main h1,
|
||||
body#blog_index #main p {
|
||||
margin-bottom: 0.5em
|
||||
}
|
||||
|
||||
body#blog_index article.post {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
|
||||
body#blog_index .post-metadata {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
body#blog_index .post-tags .label-default {
|
||||
background-color: #e9ecec;
|
||||
color: #6d8283;
|
||||
}
|
||||
body#blog_index .post-tags .label-default i {
|
||||
color: #a3b2b2;
|
||||
}
|
||||
|
||||
/* Page: 'Blog post show'
|
||||
------------------------------------------------------------------------- */
|
||||
body#blog_post_show #main h3 {
|
||||
margin-bottom: 0.75em
|
||||
}
|
||||
|
||||
body#blog_post_show .post-tags .label-default {
|
||||
background-color: #e9ecec;
|
||||
color: #6D8283;
|
||||
font-size: 16px;
|
||||
margin-right: 10px;
|
||||
padding: .4em 1em .5em;
|
||||
}
|
||||
body#blog_post_show .post-tags .label-default i {
|
||||
color: #95A6A7;
|
||||
}
|
||||
|
||||
body#blog_post_show #post-add-comment {
|
||||
margin: 2em 0
|
||||
}
|
||||
|
||||
body#blog_post_show #post-add-comment p {
|
||||
margin-bottom: 0
|
||||
}
|
||||
|
||||
body#blog_post_show #post-add-comment p a.btn {
|
||||
margin-right: 0.5em
|
||||
}
|
||||
|
||||
body#blog_post_show .post-comment {
|
||||
margin-bottom: 2em
|
||||
}
|
||||
|
||||
body#blog_post_show .post-comment h4 {
|
||||
font-size: 13px;
|
||||
line-height: 1.42857;
|
||||
margin-top: 0
|
||||
}
|
||||
|
||||
body#blog_post_show .post-comment h4 strong {
|
||||
display: block
|
||||
}
|
||||
|
||||
/* Page: 'Comment form error'
|
||||
------------------------------------------------------------------------- */
|
||||
body#comment_form_error h1.text-danger {
|
||||
margin-bottom: 1em
|
||||
}
|
||||
|
||||
@media (min-width: 768px) and (max-width: 1200px) {
|
||||
.container {
|
||||
width: 98%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Page: 'Blog search'
|
||||
------------------------------------------------------------------------- */
|
||||
body#blog_search #main h1,
|
||||
body#blog_search #main p {
|
||||
margin-bottom: 0.5em
|
||||
}
|
||||
|
||||
body#blog_search article.post:first-child {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
body#blog_search article.post {
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
body#blog_search .post-metadata {
|
||||
font-size: 16px;
|
||||
margin-bottom: 8px;
|
||||
}
|
194
app/assets/scss/bootstrap-tagsinput.scss
vendored
Normal file
194
app/assets/scss/bootstrap-tagsinput.scss
vendored
Normal file
@@ -0,0 +1,194 @@
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Twiter Typeahead
|
||||
*
|
||||
* Styles for tagsinput.js - input suggestion engine
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
.twitter-typeahead {
|
||||
width: 100%;
|
||||
}
|
||||
.typeahead,
|
||||
.tt-query,
|
||||
.tt-hint {
|
||||
outline: 0;
|
||||
}
|
||||
.tt-hint {
|
||||
color: #999;
|
||||
}
|
||||
.tt-menu{
|
||||
width: 100%;
|
||||
margin-top: 1px;
|
||||
min-width: 180px;
|
||||
padding: 7px 0;
|
||||
background-color: #fff;
|
||||
border: 1px solid rgba(0,0,0,0.15);
|
||||
border-radius: 4px;
|
||||
max-height: 300px;
|
||||
overflow-y: auto;
|
||||
-webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.175);
|
||||
box-shadow: 0 6px 12px rgba(0,0,0,0.175);
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
.typeahead-scrollable .tt-menu{
|
||||
max-height: 250px;
|
||||
}
|
||||
.typeahead-rtl .tt-menu{
|
||||
text-align: right;
|
||||
}
|
||||
.tt-suggestion {
|
||||
padding: 8px 15px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tt-suggestion.tt-cursor {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
.tt-suggestion p {
|
||||
margin: 0;
|
||||
}
|
||||
.tt-suggestion.tt-selectable:before {
|
||||
content: '\f02b';
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
margin-right: 0.5em;
|
||||
color: inherit;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
.tt-dataset-group .tt-suggestion {
|
||||
padding-left: 24px;
|
||||
padding-right: 24px;
|
||||
}
|
||||
.tt-heading {
|
||||
font-size: 11px;
|
||||
line-height: 1.82;
|
||||
padding: 8px 15px;
|
||||
text-transform: uppercase;
|
||||
display: block;
|
||||
font-weight: 700;
|
||||
margin-top: 2px;
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
.tt-suggestion:hover,
|
||||
.tt-suggestion:focus {
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
outline: 0;
|
||||
background-color: #18bc9c;
|
||||
}
|
||||
/* ------------------------------------------------------------------------------
|
||||
*
|
||||
* # Bootstrap tags input
|
||||
*
|
||||
* Styles for tagsinput.js - tags input for Bootstrap
|
||||
*
|
||||
* ---------------------------------------------------------------------------- */
|
||||
.bootstrap-tagsinput {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
width: 100%;
|
||||
height: 45px;
|
||||
padding: 0;
|
||||
font-size: 15px;
|
||||
line-height: 1.42857143;
|
||||
color: #2c3e50;
|
||||
background-color: #ffffff;
|
||||
background-image: none;
|
||||
border: 2px solid #dce4ec;
|
||||
border-radius: 4px;
|
||||
border-bottom-right-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
|
||||
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
||||
}
|
||||
.has-error .bootstrap-tagsinput {
|
||||
border-color: #e74c3c !important;
|
||||
}
|
||||
.bootstrap-tagsinput.focus {
|
||||
border-color: #2c3e50;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.bootstrap-tagsinput input {
|
||||
border: 0;
|
||||
outline: 0;
|
||||
background-color: transparent;
|
||||
padding: 5px 11px;
|
||||
margin-top: 2px;
|
||||
margin-left: 2px;
|
||||
width: auto !important;
|
||||
min-width: 100px;
|
||||
font-size: 15px;
|
||||
line-height: 1.6666667;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.bootstrap-tagsinput input:focus {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
.bootstrap-tagsinput .twitter-typeahead {
|
||||
width: auto;
|
||||
}
|
||||
.bootstrap-tagsinput .tt-menu {
|
||||
margin-top: 5px;
|
||||
min-width: 200px;
|
||||
}
|
||||
.bootstrap-tagsinput .tag {
|
||||
margin: 1px 0 0 3px;
|
||||
border: 0;
|
||||
border-radius: .25em;
|
||||
padding: 5px 11px;
|
||||
padding-right: 30px;
|
||||
float: left;
|
||||
font-size: 15px;
|
||||
line-height: 1.6666667;
|
||||
font-weight: 400;
|
||||
text-transform: none;
|
||||
position: relative;
|
||||
background-color: #18bc9c;
|
||||
color: #fff;
|
||||
}
|
||||
.has-error .bootstrap-tagsinput .tag {
|
||||
background-color: #e74c3c !important;
|
||||
}
|
||||
.bootstrap-tagsinput .tag [data-role="remove"] {
|
||||
cursor: pointer;
|
||||
color: inherit;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 11px;
|
||||
line-height: 1;
|
||||
margin-top: -5.5px;
|
||||
opacity: 0.7;
|
||||
filter: alpha(opacity=70);
|
||||
}
|
||||
.bootstrap-tagsinput .tag [data-role="remove"]:hover {
|
||||
opacity: 1;
|
||||
filter: alpha(opacity=100);
|
||||
}
|
||||
.bootstrap-tagsinput .tag:before {
|
||||
content: '\f02b';
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
margin-right: 0.5em;
|
||||
color: #fff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
.bootstrap-tagsinput .tag [data-role="remove"]:after {
|
||||
content: '\f00d';
|
||||
font-family: 'Font Awesome 5 Free';
|
||||
font-weight: 900;
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
color: #fff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
Reference in New Issue
Block a user