Initial public push: docs cosmos v4 + AI module + framework groundwork
This is the snapshot the production landing site (nibiru-framework.com) is deployed from. Brings together the recent splash + docs migration to the v4 "Cosmos" design system, the new in-framework AI module, and the framework groundwork that backs the framework-reference extraction. What lands: - docs/: Astro + Starlight site with the v4 dark cosmic palette, GalaxyHero canvas constellation, Mission Control chat (wired to /api/oracle → api.neuronetz.ai via providers.mjs Ollama), 5-panel MMVC stage (Model · AI · Module · Controller · View), translated EN/DE/JA/ES/FR content, PWA + sitemap + llms.txt + Umami analytics. - docs/design-system/: canonical mockup bundle (source/index-v2.html for splash, source/docs-system.html + preview/ for docs, SPEC.md, tokens). - docs/scripts/extraction/framework-reference-v2.md: deep framework reference (~1.6k lines, file:line citations, every public factory and idiom — basis for the LoRA training corpus. - application/module/ai/: AI module with chat / embed / RAG / agent plugins, plus pdoQuery / httpGet / fileRead tools and Modelfile + smoke-test in training/. - application/module/users/: user / ACL / form-factory traits used as the reference plugin pattern for the framework docs. - application/settings/config/database/: schema + seed migrations including the AI module tables (200–203). - Form factory + autogenerator changes the framework-reference-v2 covers. Production secrets stay out: docs/.env, settings.production.ini and ai.production.ini are all gitignored (.example files are in tree). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
stephan
@@ -0,0 +1,21 @@
|
||||
.background-2{
|
||||
background: url(../img/backgrounds/2.jpg);
|
||||
}
|
||||
|
||||
.background-4{
|
||||
background: url(../img/backgrounds/4.jpg);
|
||||
}
|
||||
|
||||
.background-5{
|
||||
background: url(../img/backgrounds/5.jpg);
|
||||
}
|
||||
|
||||
.background-gradient-grey{
|
||||
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f2f2f2+95,f2f2f2+95,f2f2f2+100 */
|
||||
background: #ffffff; /* Old browsers */
|
||||
background: -moz-linear-gradient(top, #ffffff 0%, #f2f2f2 95%, #f2f2f2 95%, #f2f2f2 100%); /* FF3.6-15 */
|
||||
background: -webkit-linear-gradient(top, #ffffff 0%,#f2f2f2 95%,#f2f2f2 95%,#f2f2f2 100%); /* Chrome10-25,Safari5.1-6 */
|
||||
background: linear-gradient(to bottom, #ffffff 0%,#f2f2f2 95%,#f2f2f2 95%,#f2f2f2 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f2f2f2',GradientType=0 ); /* IE6-9 */
|
||||
|
||||
}
|
||||
45
application/view/mockup/template/less/global/_config.less
Normal file
45
application/view/mockup/template/less/global/_config.less
Normal file
@@ -0,0 +1,45 @@
|
||||
|
||||
/* ==========================================================================
|
||||
Colors configuration
|
||||
========================================================================== */
|
||||
|
||||
@color_black: #333 ;
|
||||
@color_grey: #99a3b1 ;
|
||||
@color_grey-dark: #808488 ;
|
||||
@color_grey-lighter: #F6F7F8 ;
|
||||
@color_grey-light: #CBD3DD ;
|
||||
@color_blue: #28C ;
|
||||
@color_blue-light: #48CACC ;
|
||||
@color_purple: #8D3DEB ;
|
||||
@color_orange: #FF530D ;
|
||||
@color_green: #4b5 ;
|
||||
@color_red: #FF3625 ;
|
||||
@color_yellow: #FDC441 ;
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Fonts configuration
|
||||
========================================================================== */
|
||||
|
||||
// Importing fonts from http://google.com/fonts
|
||||
@import url(http://fonts.googleapis.com/css?family=Roboto:500,900,100,300,700,400&subset=latin,cyrillic-ext,cyrillic,latin-ext);
|
||||
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700&subset=latin,cyrillic-ext,cyrillic,latin-ext);
|
||||
|
||||
// Font Family
|
||||
@font_primary: 'Roboto', sans-serif;
|
||||
@font_secondary: "Roboto Slab", serif;
|
||||
|
||||
// Icons
|
||||
@icons: 'FontAwesome';
|
||||
@icons-stroke: 'Pe-icon-7-stroke';
|
||||
|
||||
// Font Size
|
||||
@font-size_base: 16;
|
||||
|
||||
// Font Weight
|
||||
@font_thin: 100;
|
||||
@font_light: 300;
|
||||
@font_normal: 400;
|
||||
@font_medium: 500;
|
||||
@font_bold: 700;
|
||||
@font_black: 900;
|
||||
123
application/view/mockup/template/less/global/_general.less
Normal file
123
application/view/mockup/template/less/global/_general.less
Normal file
@@ -0,0 +1,123 @@
|
||||
.separator{
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
background-color: @color_grey-light;
|
||||
margin: 30px 0;
|
||||
|
||||
&.without-border{
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.placeholder-horizontal{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.placeholder-vertical{
|
||||
height: 100%;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
.helper{
|
||||
&.center{ text-align: center; }
|
||||
&.left { text-align: left; }
|
||||
&.right { text-align: right; }
|
||||
&.hide { display: none; }
|
||||
&.m0 { margin: 0; }
|
||||
&.p0 { padding: 0; }
|
||||
&.overflow-hidden-lg{overflow: hidden;}
|
||||
|
||||
&.mb0 { margin-bottom: 0px; }
|
||||
&.mb10 { margin-bottom: 10px; }
|
||||
&.mb20 { margin-bottom: 20px; }
|
||||
&.mb30 { margin-bottom: 30px; }
|
||||
&.mb40 { margin-bottom: 40px; }
|
||||
&.mb60 { margin-bottom: 60px; }
|
||||
&.mb80 { margin-bottom: 80px; }
|
||||
&.mb100 { margin-bottom: 100px; }
|
||||
|
||||
&.mr0 { margin-right: 0px; }
|
||||
&.mr10 { margin-right: 10px; }
|
||||
&.mr20 { margin-right: 20px; }
|
||||
&.mr30 { margin-right: 30px; }
|
||||
&.mr40 { margin-right: 40px; }
|
||||
&.mr60 { margin-right: 60px; }
|
||||
|
||||
&.ml0 { margin-left: 0px; }
|
||||
&.ml10 { margin-left: 10px; }
|
||||
&.ml20 { margin-left: 20px; }
|
||||
&.ml30 { margin-left: 30px; }
|
||||
&.ml40 { margin-left: 40px; }
|
||||
&.ml60 { margin-left: 58px; }
|
||||
|
||||
&.mt0 { margin-top: 0px; }
|
||||
&.mt10 { margin-top: 10px; }
|
||||
&.mt20 { margin-top: 20px; }
|
||||
&.mt30 { margin-top: 30px; }
|
||||
&.mt40 { margin-top: 40px; }
|
||||
&.mt60 { margin-top: 60px; }
|
||||
|
||||
&.pt0 { padding-top: 0px; }
|
||||
&.pt10 { padding-top: 10px; }
|
||||
&.pt20 { padding-top: 20px; }
|
||||
&.pt30 { padding-top: 30px; }
|
||||
&.pt40 { padding-top: 40px; }
|
||||
&.pt60 { padding-top: 60px; }
|
||||
&.pt80 { padding-top: 80px; }
|
||||
&.pt90 { padding-top: 90px; }
|
||||
&.pt100 { padding-top: 100px; }
|
||||
|
||||
&.pb0 { padding-bottom: 0px; }
|
||||
&.pb10 { padding-bottom: 10px; }
|
||||
&.pb20 { padding-bottom: 20px; }
|
||||
&.pb30 { padding-bottom: 30px; }
|
||||
&.pb40 { padding-bottom: 40px; }
|
||||
&.pb60 { padding-bottom: 60px; }
|
||||
|
||||
&.pl0 { padding-left: 0px; }
|
||||
&.pl10 { padding-left: 10px; }
|
||||
&.pl20 { padding-left: 20px; }
|
||||
&.pl30 { padding-left: 30px; }
|
||||
&.pl40 { padding-left: 40px; }
|
||||
&.pl60 { padding-left: 60px; }
|
||||
|
||||
&.pr0 { padding-right: 0px; }
|
||||
&.pr10 { padding-right: 10px; }
|
||||
&.pr20 { padding-right: 20px; }
|
||||
&.pr30 { padding-right: 30px; }
|
||||
&.pr40 { padding-right: 40px; }
|
||||
&.pr60 { padding-right: 60px; }
|
||||
}
|
||||
|
||||
.media-mixin(@break) when (@break = @break-medium){
|
||||
.helper{
|
||||
&.p0-sm{
|
||||
padding: 0;
|
||||
}
|
||||
&.pt50-sm{
|
||||
padding-top: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.media-mixin(@break) when (@break = @break-small){
|
||||
.helper{
|
||||
&.mb50-sm{
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
|
||||
&.overflow-hidden-sm{
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.media-mixin(@break) when (@break = @break-small-x){
|
||||
.helper{
|
||||
&.p0-xs{
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
913
application/view/mockup/template/less/global/_grid.less
Normal file
913
application/view/mockup/template/less/global/_grid.less
Normal file
@@ -0,0 +1,913 @@
|
||||
@-ms-viewport {
|
||||
width: device-width;
|
||||
}
|
||||
.visible-xs,
|
||||
.visible-sm,
|
||||
.visible-md,
|
||||
.visible-lg {
|
||||
display: none !important;
|
||||
}
|
||||
.visible-xs-block,
|
||||
.visible-xs-inline,
|
||||
.visible-xs-inline-block,
|
||||
.visible-sm-block,
|
||||
.visible-sm-inline,
|
||||
.visible-sm-inline-block,
|
||||
.visible-md-block,
|
||||
.visible-md-inline,
|
||||
.visible-md-inline-block,
|
||||
.visible-lg-block,
|
||||
.visible-lg-inline,
|
||||
.visible-lg-inline-block {
|
||||
display: none !important;
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.visible-xs {
|
||||
display: block !important;
|
||||
}
|
||||
table.visible-xs {
|
||||
display: table;
|
||||
}
|
||||
tr.visible-xs {
|
||||
display: table-row !important;
|
||||
}
|
||||
th.visible-xs,
|
||||
td.visible-xs {
|
||||
display: table-cell !important;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.visible-xs-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.visible-xs-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.visible-xs-inline-block {
|
||||
display: inline-block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.visible-sm {
|
||||
display: block !important;
|
||||
}
|
||||
table.visible-sm {
|
||||
display: table;
|
||||
}
|
||||
tr.visible-sm {
|
||||
display: table-row !important;
|
||||
}
|
||||
th.visible-sm,
|
||||
td.visible-sm {
|
||||
display: table-cell !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.visible-sm-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.visible-sm-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.visible-sm-inline-block {
|
||||
display: inline-block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.visible-md {
|
||||
display: block !important;
|
||||
}
|
||||
table.visible-md {
|
||||
display: table;
|
||||
}
|
||||
tr.visible-md {
|
||||
display: table-row !important;
|
||||
}
|
||||
th.visible-md,
|
||||
td.visible-md {
|
||||
display: table-cell !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.visible-md-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.visible-md-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.visible-md-inline-block {
|
||||
display: inline-block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.visible-lg {
|
||||
display: block !important;
|
||||
}
|
||||
table.visible-lg {
|
||||
display: table;
|
||||
}
|
||||
tr.visible-lg {
|
||||
display: table-row !important;
|
||||
}
|
||||
th.visible-lg,
|
||||
td.visible-lg {
|
||||
display: table-cell !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.visible-lg-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.visible-lg-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.visible-lg-inline-block {
|
||||
display: inline-block !important;
|
||||
}
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.hidden-xs {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.hidden-sm {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) and (max-width: 1199px) {
|
||||
.hidden-md {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.hidden-lg {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.visible-print {
|
||||
display: none !important;
|
||||
}
|
||||
@media print {
|
||||
.visible-print {
|
||||
display: block !important;
|
||||
}
|
||||
table.visible-print {
|
||||
display: table;
|
||||
}
|
||||
tr.visible-print {
|
||||
display: table-row !important;
|
||||
}
|
||||
th.visible-print,
|
||||
td.visible-print {
|
||||
display: table-cell !important;
|
||||
}
|
||||
}
|
||||
.visible-print-block {
|
||||
display: none !important;
|
||||
}
|
||||
@media print {
|
||||
.visible-print-block {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
.visible-print-inline {
|
||||
display: none !important;
|
||||
}
|
||||
@media print {
|
||||
.visible-print-inline {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
.visible-print-inline-block {
|
||||
display: none !important;
|
||||
}
|
||||
@media print {
|
||||
.visible-print-inline-block {
|
||||
display: inline-block !important;
|
||||
}
|
||||
}
|
||||
@media print {
|
||||
.hidden-print {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.container {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.container {
|
||||
width: 750px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.container {
|
||||
width: 970px;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.container {
|
||||
width: 1170px;
|
||||
}
|
||||
}
|
||||
.container-fluid {
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.row {
|
||||
margin-left: -15px;
|
||||
margin-right: -15px;
|
||||
}
|
||||
.col, .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.col, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-xs-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-xs-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-xs-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-xs-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-xs-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-xs-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-xs-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-xs-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-xs-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-xs-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-xs-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-xs-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-xs-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-xs-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-xs-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-xs-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-xs-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-xs-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-xs-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-xs-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-xs-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-xs-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-xs-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-xs-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-xs-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-xs-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-xs-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-xs-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-xs-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-xs-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-xs-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-xs-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-xs-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-xs-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-xs-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-xs-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-xs-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-xs-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-xs-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-xs-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-xs-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-xs-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-xs-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-xs-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-xs-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-xs-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-xs-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-xs-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-xs-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-xs-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-xs-offset-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
.col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-sm-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-sm-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-sm-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-sm-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-sm-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-sm-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-sm-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-sm-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-sm-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-sm-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-sm-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-sm-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-sm-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-sm-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-sm-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-sm-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-sm-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-sm-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-sm-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-sm-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-sm-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-sm-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-sm-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-sm-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-sm-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-sm-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-sm-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-sm-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-sm-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-sm-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-sm-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-sm-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-sm-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-sm-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-sm-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-sm-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-sm-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-sm-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-sm-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-sm-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-sm-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-sm-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-sm-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-sm-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-sm-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-sm-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-sm-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-sm-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-sm-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-sm-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-sm-offset-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 992px) {
|
||||
.col, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-md-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-md-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-md-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-md-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-md-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-md-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-md-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-md-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-md-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-md-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-md-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-md-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-md-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-md-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-md-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-md-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-md-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-md-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-md-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-md-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-md-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-md-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-md-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-md-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-md-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-md-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-md-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-md-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-md-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-md-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-md-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-md-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-md-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-md-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-md-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-md-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-md-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-md-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-md-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-md-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-md-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-md-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-md-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-md-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-md-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-md-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-md-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-md-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-md-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-md-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-md-offset-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1200px) {
|
||||
.col, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
|
||||
float: left;
|
||||
}
|
||||
.col-lg-12 {
|
||||
width: 100%;
|
||||
}
|
||||
.col-lg-11 {
|
||||
width: 91.66666667%;
|
||||
}
|
||||
.col-lg-10 {
|
||||
width: 83.33333333%;
|
||||
}
|
||||
.col-lg-9 {
|
||||
width: 75%;
|
||||
}
|
||||
.col-lg-8 {
|
||||
width: 66.66666667%;
|
||||
}
|
||||
.col-lg-7 {
|
||||
width: 58.33333333%;
|
||||
}
|
||||
.col-lg-6 {
|
||||
width: 50%;
|
||||
}
|
||||
.col-lg-5 {
|
||||
width: 41.66666667%;
|
||||
}
|
||||
.col-lg-4 {
|
||||
width: 33.33333333%;
|
||||
}
|
||||
.col-lg-3 {
|
||||
width: 25%;
|
||||
}
|
||||
.col-lg-2 {
|
||||
width: 16.66666667%;
|
||||
}
|
||||
.col-lg-1 {
|
||||
width: 8.33333333%;
|
||||
}
|
||||
.col-lg-pull-12 {
|
||||
right: 100%;
|
||||
}
|
||||
.col-lg-pull-11 {
|
||||
right: 91.66666667%;
|
||||
}
|
||||
.col-lg-pull-10 {
|
||||
right: 83.33333333%;
|
||||
}
|
||||
.col-lg-pull-9 {
|
||||
right: 75%;
|
||||
}
|
||||
.col-lg-pull-8 {
|
||||
right: 66.66666667%;
|
||||
}
|
||||
.col-lg-pull-7 {
|
||||
right: 58.33333333%;
|
||||
}
|
||||
.col-lg-pull-6 {
|
||||
right: 50%;
|
||||
}
|
||||
.col-lg-pull-5 {
|
||||
right: 41.66666667%;
|
||||
}
|
||||
.col-lg-pull-4 {
|
||||
right: 33.33333333%;
|
||||
}
|
||||
.col-lg-pull-3 {
|
||||
right: 25%;
|
||||
}
|
||||
.col-lg-pull-2 {
|
||||
right: 16.66666667%;
|
||||
}
|
||||
.col-lg-pull-1 {
|
||||
right: 8.33333333%;
|
||||
}
|
||||
.col-lg-pull-0 {
|
||||
right: auto;
|
||||
}
|
||||
.col-lg-push-12 {
|
||||
left: 100%;
|
||||
}
|
||||
.col-lg-push-11 {
|
||||
left: 91.66666667%;
|
||||
}
|
||||
.col-lg-push-10 {
|
||||
left: 83.33333333%;
|
||||
}
|
||||
.col-lg-push-9 {
|
||||
left: 75%;
|
||||
}
|
||||
.col-lg-push-8 {
|
||||
left: 66.66666667%;
|
||||
}
|
||||
.col-lg-push-7 {
|
||||
left: 58.33333333%;
|
||||
}
|
||||
.col-lg-push-6 {
|
||||
left: 50%;
|
||||
}
|
||||
.col-lg-push-5 {
|
||||
left: 41.66666667%;
|
||||
}
|
||||
.col-lg-push-4 {
|
||||
left: 33.33333333%;
|
||||
}
|
||||
.col-lg-push-3 {
|
||||
left: 25%;
|
||||
}
|
||||
.col-lg-push-2 {
|
||||
left: 16.66666667%;
|
||||
}
|
||||
.col-lg-push-1 {
|
||||
left: 8.33333333%;
|
||||
}
|
||||
.col-lg-push-0 {
|
||||
left: auto;
|
||||
}
|
||||
.col-lg-offset-12 {
|
||||
margin-left: 100%;
|
||||
}
|
||||
.col-lg-offset-11 {
|
||||
margin-left: 91.66666667%;
|
||||
}
|
||||
.col-lg-offset-10 {
|
||||
margin-left: 83.33333333%;
|
||||
}
|
||||
.col-lg-offset-9 {
|
||||
margin-left: 75%;
|
||||
}
|
||||
.col-lg-offset-8 {
|
||||
margin-left: 66.66666667%;
|
||||
}
|
||||
.col-lg-offset-7 {
|
||||
margin-left: 58.33333333%;
|
||||
}
|
||||
.col-lg-offset-6 {
|
||||
margin-left: 50%;
|
||||
}
|
||||
.col-lg-offset-5 {
|
||||
margin-left: 41.66666667%;
|
||||
}
|
||||
.col-lg-offset-4 {
|
||||
margin-left: 33.33333333%;
|
||||
}
|
||||
.col-lg-offset-3 {
|
||||
margin-left: 25%;
|
||||
}
|
||||
.col-lg-offset-2 {
|
||||
margin-left: 16.66666667%;
|
||||
}
|
||||
.col-lg-offset-1 {
|
||||
margin-left: 8.33333333%;
|
||||
}
|
||||
.col-lg-offset-0 {
|
||||
margin-left: 0%;
|
||||
}
|
||||
}
|
||||
.clearfix,
|
||||
.clearfix:before,
|
||||
.clearfix:after,
|
||||
.container:before,
|
||||
.container:after,
|
||||
.container-fluid:before,
|
||||
.container-fluid:after,
|
||||
.row:before,
|
||||
.row:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
}
|
||||
.clearfix:after,
|
||||
.container:after,
|
||||
.container-fluid:after,
|
||||
.row:after {
|
||||
clear: both;
|
||||
}
|
||||
.center-block {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
.pull-right {
|
||||
float: right !important;
|
||||
}
|
||||
.pull-left {
|
||||
float: left !important;
|
||||
}
|
||||
*,
|
||||
*:before,
|
||||
*:after {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
19
application/view/mockup/template/less/global/_image.less
Normal file
19
application/view/mockup/template/less/global/_image.less
Normal file
@@ -0,0 +1,19 @@
|
||||
.image{
|
||||
padding: 4px;
|
||||
border: 1px solid @color_grey-light;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 15px;
|
||||
max-width: 100%;
|
||||
|
||||
&.remove-border{
|
||||
border: 0;
|
||||
}
|
||||
|
||||
&.isolated{
|
||||
margin: 30px 0;
|
||||
}
|
||||
}
|
||||
|
||||
.media-mixin(@break) when (@break = @break-small-x) {
|
||||
.image.isolated{ margin: 0 0 15px 0; }
|
||||
}
|
||||
73
application/view/mockup/template/less/global/_layout.less
Normal file
73
application/view/mockup/template/less/global/_layout.less
Normal file
@@ -0,0 +1,73 @@
|
||||
html, body{
|
||||
height: 100%;
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
body{
|
||||
font-size: 1em;
|
||||
line-height: 100%;
|
||||
font-family: @font_primary;
|
||||
color: @color_black;
|
||||
}
|
||||
|
||||
#content{
|
||||
padding: 60px 0;
|
||||
|
||||
&.pt0{
|
||||
padding-top: 0;
|
||||
}
|
||||
&.pb0{
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.page{
|
||||
min-height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.layout{
|
||||
position: relative;
|
||||
.col-md-2, .col-md-3, .col-md-4{ position: static; }
|
||||
|
||||
&.with-left-sidebar .sidebar{
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
&.with-right-sidebar .sidebar{
|
||||
padding-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar{
|
||||
-webkit-backface-visibility: hidden;
|
||||
-webkit-transform: translateZ(0);
|
||||
|
||||
&.sidebar-is-fixed{
|
||||
position: fixed;
|
||||
top: 30px;
|
||||
}
|
||||
|
||||
&.sidebar-is-bottom{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px){
|
||||
.container-spaced { padding: 0 50px; }
|
||||
}
|
||||
|
||||
@media (min-width: 480px){
|
||||
.one-page-content .container-spaced { padding: 0 50px; }
|
||||
}
|
||||
|
||||
.media-mixin(@break) when (@break = @break-large-x) {
|
||||
.layout{ padding: 0 !important; }
|
||||
.main-content { padding: 0 !important; border: none !important; }
|
||||
}
|
||||
|
||||
.media-mixin(@break) when (@break = @break-small-x) {
|
||||
#content { padding: 40px 0; }
|
||||
body{ font-size: 0.9em; }
|
||||
}
|
||||
53
application/view/mockup/template/less/global/_list.less
Normal file
53
application/view/mockup/template/less/global/_list.less
Normal file
@@ -0,0 +1,53 @@
|
||||
/* ==========================================================================
|
||||
Unordered List
|
||||
========================================================================== */
|
||||
|
||||
ul{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: disc;
|
||||
margin: 0 0 1em 1.2em;
|
||||
line-height: 1.8;
|
||||
|
||||
ul{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Ordered List
|
||||
========================================================================== */
|
||||
|
||||
ol{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: decimal;
|
||||
margin: 0 0 1em 1.5em;
|
||||
line-height: 1.8;
|
||||
|
||||
ol{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Definition List
|
||||
========================================================================== */
|
||||
|
||||
dl {
|
||||
overflow: hidden;
|
||||
margin: 0 0 1em;
|
||||
font-weight: 300;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
dd{
|
||||
margin-left: 0;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
dt{
|
||||
font-weight: 500;
|
||||
line-height: 1.8;
|
||||
}
|
||||
25
application/view/mockup/template/less/global/_media.less
Normal file
25
application/view/mockup/template/less/global/_media.less
Normal file
@@ -0,0 +1,25 @@
|
||||
@break-small-x: 480px;
|
||||
@break-small: 768px;
|
||||
@break-medium: 991px;
|
||||
@break-large: 1024px;
|
||||
@break-large-x: 1200px;
|
||||
|
||||
@media all and (max-width: @break-large-x) {
|
||||
.media-mixin(@break-large-x);
|
||||
}
|
||||
|
||||
@media all and (max-width: @break-large) {
|
||||
.media-mixin(@break-large);
|
||||
}
|
||||
|
||||
@media all and (max-width: @break-medium) {
|
||||
.media-mixin(@break-medium);
|
||||
}
|
||||
|
||||
@media all and (max-width: @break-small) {
|
||||
.media-mixin(@break-small);
|
||||
}
|
||||
|
||||
@media all and (max-width: @break-small-x) {
|
||||
.media-mixin(@break-small-x);
|
||||
}
|
||||
67
application/view/mockup/template/less/global/_mixins.less
Normal file
67
application/view/mockup/template/less/global/_mixins.less
Normal file
@@ -0,0 +1,67 @@
|
||||
.transition(@property){
|
||||
-webkit-transition: @property .25s ease;
|
||||
-moz-transition: @property .25s ease;
|
||||
-ms-transition: @property .25s ease;
|
||||
-o-transition: @property .25s ease;
|
||||
transition: @property .25s ease;
|
||||
}
|
||||
|
||||
.transition-custom(...){
|
||||
@values: ~`"@{arguments}".replace(/[\[\]]/g, '')`;
|
||||
-webkit-transition: @values;
|
||||
-moz-transition: @values;
|
||||
-ms-transition: @values;
|
||||
-o-transition: @values;
|
||||
transition: @values;
|
||||
}
|
||||
|
||||
.placeholder(@rules) {
|
||||
|
||||
&::-webkit-input-placeholder {
|
||||
@rules();
|
||||
}
|
||||
&:-moz-placeholder {
|
||||
@rules();
|
||||
}
|
||||
&::-moz-placeholder {
|
||||
@rules();
|
||||
}
|
||||
&:-ms-input-placeholder {
|
||||
@rules();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fz( @value: @font-size_base, @context: @font-size_base ) {
|
||||
font-size: (@value / @context) + 0em;
|
||||
}
|
||||
|
||||
.translateX(@value){
|
||||
-webkit-transform: translateX(@value);
|
||||
-moz-transform: translateX(@value);
|
||||
-ms-transform: translateX(@value);
|
||||
-o-transform: translateX(@value);
|
||||
transform: translateX(@value);
|
||||
}
|
||||
|
||||
.animation(@arguments) {
|
||||
-webkit-animation: @arguments;
|
||||
-moz-animation: @arguments;
|
||||
-ms-animation: @arguments;
|
||||
-o-animation: @arguments;
|
||||
animation: @arguments;
|
||||
}
|
||||
|
||||
.transform(@value){
|
||||
-webkit-transform: @value;
|
||||
-moz-transform: @value;
|
||||
-ms-transform: @value;
|
||||
-o-transform: @value;
|
||||
transform: @value;
|
||||
}
|
||||
|
||||
.keyframes(@name; @arguments) {
|
||||
@-moz-keyframes @name { @arguments(); }
|
||||
@-webkit-keyframes @name { @arguments(); }
|
||||
@keyframes @name { @arguments(); }
|
||||
}
|
||||
272
application/view/mockup/template/less/global/_normalize.less
Normal file
272
application/view/mockup/template/less/global/_normalize.less
Normal file
@@ -0,0 +1,272 @@
|
||||
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
|
||||
|
||||
// * 1. Set default font family to sans-serif.
|
||||
// * 2. Prevent iOS text size adjust after orientation change, without disabling user zoom.
|
||||
html {
|
||||
font-family: sans-serif;
|
||||
-ms-text-size-adjust: 100%;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
// Remove default margin.
|
||||
body { margin: 0 }
|
||||
|
||||
// HTML5 display definitions ==========================================================================
|
||||
// * Correct `block` display not defined for any HTML5 element in IE 8/9.
|
||||
// * Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox.
|
||||
// * Correct `block` display not defined for `main` in IE 11.
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
main,
|
||||
nav,
|
||||
section,
|
||||
summary {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// * 1. Correct `inline-block` display not defined in IE 8/9.
|
||||
// * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
|
||||
audio,
|
||||
canvas,
|
||||
progress,
|
||||
video {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
// * Prevent modern browsers from displaying `audio` without controls.
|
||||
// * Remove excess height in iOS 5 devices.
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
// * Address `[hidden]` styling not present in IE 8/9/10.
|
||||
// * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
|
||||
[hidden],
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// Links ==========================================================================
|
||||
// * Remove the gray background color from active links in IE 10.
|
||||
a {
|
||||
background: transparent;
|
||||
// * Improve readability when focused and also mouse hovered in all browsers.
|
||||
&:active,
|
||||
&:hover {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Text-level semantics ==========================================================================
|
||||
|
||||
// * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
|
||||
abbr[title] { border-bottom: 1px dotted; }
|
||||
|
||||
// * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
|
||||
b,
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
// * Address styling not present in Safari and Chrome.
|
||||
dfn { font-style: italic; }
|
||||
|
||||
// * Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome.
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
// * Address styling not present in IE 8/9.
|
||||
mark {
|
||||
background: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
// * Address inconsistent and variable font size in all browsers.
|
||||
small { font-size: 80%; }
|
||||
|
||||
// * Prevent `sub` and `sup` affecting `line-height` in all browsers.
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sup { top: -0.5em; }
|
||||
sub { bottom: -0.25em; }
|
||||
|
||||
// Embedded content ==========================================================================
|
||||
// * Remove border when inside `a` element in IE 8/9/10.
|
||||
img { border: 0; }
|
||||
|
||||
// * Correct overflow not hidden in IE 9/10/11.
|
||||
svg:not(:root) { overflow: hidden; }
|
||||
|
||||
// Grouping content ==========================================================================
|
||||
// * Address margin not present in IE 8/9 and Safari.
|
||||
figure { margin: 1em 40px; }
|
||||
|
||||
// * Address differences between Firefox and other browsers.
|
||||
hr {
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
// * Contain overflow in all browsers.
|
||||
pre { overflow: auto; }
|
||||
|
||||
// * Address odd `em`-unit font size rendering in all browsers.
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: monospace, monospace;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
// Forms ==========================================================================
|
||||
// * Known limitation: by default, Chrome and Safari on OS X allow very limited
|
||||
// * styling of `select`, unless a `border` property is set.
|
||||
|
||||
// * 1. Correct color not being inherited.
|
||||
// * Known issue: affects color of disabled elements.
|
||||
// * 2. Correct font properties not being inherited.
|
||||
// * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
color: inherit;
|
||||
font: inherit;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
// * Address `overflow` set to `hidden` in IE 8/9/10/11.
|
||||
button { overflow: visible;}
|
||||
|
||||
// * Address inconsistent `text-transform` inheritance for `button` and `select`.
|
||||
// * All other form control elements do not inherit `text-transform` values.
|
||||
// * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
|
||||
// * Correct `select` style inheritance in Firefox.
|
||||
button,
|
||||
select {
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
// * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls.
|
||||
// * 2. Correct inability to style clickable `input` types in iOS.
|
||||
// * 3. Improve usability and consistency of cursor style between image-type `input` and others.
|
||||
button,
|
||||
html input[type="button"] {
|
||||
-webkit-appearance: button;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// * Re-set default cursor for disabled elements.
|
||||
button[disabled],
|
||||
html input[disabled] {
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
// * Remove inner padding and border in Firefox 4+.
|
||||
button
|
||||
input {
|
||||
&::-moz-focus-inner {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// * Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet.
|
||||
input {
|
||||
line-height: normal;
|
||||
&[type="reset"],
|
||||
&[type="submit"] {
|
||||
-webkit-appearance: button;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
// * It's recommended that you don't attempt to style these elements.
|
||||
// * Firefox's implementation doesn't respect box-sizing, padding, or width.
|
||||
// * 1. Address box sizing set to `content-box` in IE 8/9/10.
|
||||
// * 2. Remove excess padding in IE 8/9/10.
|
||||
&[type="checkbox"],
|
||||
&[type="radio"] {
|
||||
box-sizing: border-box;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// * Fix the cursor style for Chrome's increment/decrement buttons. For certain
|
||||
// * `font-size` values of the `input`, it causes the cursor style of the
|
||||
// * decrement button to change from `default` to `text`.
|
||||
&[type="number"] {
|
||||
&::-webkit-inner-spin-button,
|
||||
&::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
// * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
|
||||
// * 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof).
|
||||
&[type="search"] {
|
||||
-webkit-appearance: textfield;
|
||||
-moz-box-sizing: content-box;
|
||||
-webkit-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
|
||||
// * Remove inner padding and search cancel button in Safari and Chrome on OS X.
|
||||
// * Safari (but not Chrome) clips the cancel button when the search input has
|
||||
// * padding (and `textfield` appearance).
|
||||
&::-webkit-search-cancel-button,
|
||||
&::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// * Define consistent border, margin, and padding.
|
||||
fieldset {
|
||||
border: 1px solid #c0c0c0;
|
||||
margin: 0 2px;
|
||||
padding: 0.35em 0.625em 0.75em;
|
||||
}
|
||||
|
||||
// * 1. Correct `color` not being inherited in IE 8/9/10/11.
|
||||
// * 2. Remove padding so people aren't caught out if they zero out fieldsets.
|
||||
legend {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// * Remove default vertical scrollbar in IE 8/9/10/11.
|
||||
textarea { overflow: auto; }
|
||||
|
||||
// * Don't inherit the `font-weight` (applied by a rule above).
|
||||
// * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
|
||||
optgroup { font-weight: bold; }
|
||||
|
||||
// Tables ==========================================================================
|
||||
// * Remove most spacing between table cells.
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
padding: 0;
|
||||
}
|
||||
123
application/view/mockup/template/less/global/_text.less
Normal file
123
application/view/mockup/template/less/global/_text.less
Normal file
@@ -0,0 +1,123 @@
|
||||
/* ==========================================================================
|
||||
Headings
|
||||
========================================================================== */
|
||||
|
||||
h1, h2, h3, h4, h5, h6{
|
||||
font-family: @font_primary;
|
||||
font-weight: 300;
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
h1 { font-size: 3em; margin: 0 0 .5em 0; }
|
||||
h2 { font-size: 2em; margin: 0 0 .5em 0; }
|
||||
h3 { font-size: 1.5em; margin: 0 0 .5em 0; }
|
||||
h4 { font-size: 1.17em; margin: 0 0 .5em 0; }
|
||||
h5 { font-size: 1.12em; margin: 0 0 .5em 0; }
|
||||
h6 { font-size: .83em; margin: 0 0 .5em 0; }
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Paragraph
|
||||
========================================================================== */
|
||||
|
||||
p {
|
||||
font-size: 1em;
|
||||
margin: 0 0 1em 0;
|
||||
font-weight: 300;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Block quote
|
||||
========================================================================== */
|
||||
|
||||
blockquote{
|
||||
margin: 0 0 1em 0;
|
||||
padding: 0 0 0 30px;
|
||||
color: @color_grey-dark;
|
||||
font-style: italic;
|
||||
border-left: 5px solid @color_grey-light;
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Link
|
||||
========================================================================== */
|
||||
|
||||
a{
|
||||
color: @color_blue;
|
||||
text-decoration: none;
|
||||
font-size: inherit;
|
||||
|
||||
&:hover{
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
/* ==========================================================================
|
||||
Mark inside text
|
||||
========================================================================== */
|
||||
|
||||
.mark{
|
||||
|
||||
font-size: inherit;
|
||||
color: inherit;
|
||||
line-height: inherit;
|
||||
|
||||
&.bold{ font-weight: 400; }
|
||||
&.bolder{ font-weight: 700; }
|
||||
&.italic { font-style: italic; }
|
||||
&.underline { text-decoration: underline; }
|
||||
&.line-through { text-decoration: line-through; }
|
||||
&.sup { vertical-align: super; font-size: 0.8em; }
|
||||
&.sub { vertical-align: sub; font-size: 0.8em; }
|
||||
&.small { font-size: 0.8em; }
|
||||
&.help { border-bottom: 1px dotted @color_grey-dark; cursor: help; }
|
||||
&.code { font-family: monospace; }
|
||||
&.fill{
|
||||
padding: .3em .6em;
|
||||
border-radius: 4px;
|
||||
vertical-align: baseline;
|
||||
display: inline;
|
||||
font-size: 80%;
|
||||
line-height: 1;
|
||||
color: white;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
|
||||
i{
|
||||
font-size: 70%;
|
||||
vertical-align: middle;
|
||||
padding: 0 4px;
|
||||
}
|
||||
|
||||
&.blue{ background-color: @color_blue; }
|
||||
&.blue-light{ background-color: @color_blue-light; }
|
||||
&.purple{ background-color: @color_purple; }
|
||||
&.green{ background-color: @color_green; }
|
||||
&.orange{ background-color: @color_orange; }
|
||||
&.red{ background-color: @color_red; }
|
||||
&.grey{ background-color: lighten(@color_grey-light, 5%); color: @color_black; }
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
/* ==========================================================================
|
||||
Text colors
|
||||
========================================================================== */
|
||||
|
||||
a, p, h1, h2, h3, h4, h5, h6, span{
|
||||
&.color{
|
||||
&.blue{ color: @color_blue; }
|
||||
&.blue-light{ color: @color_blue-light; }
|
||||
&.purple{ color: @color_purple; }
|
||||
&.green{ color: @color_green; }
|
||||
&.orange{ color: @color_orange; }
|
||||
&.red{ color: @color_red; }
|
||||
&.grey{ color: @color_grey; }
|
||||
}
|
||||
}
|
||||
|
||||
/*==============================
|
||||
= Labels =
|
||||
==============================*/
|
||||
@@ -0,0 +1,19 @@
|
||||
.transition{
|
||||
.transition(all);
|
||||
}
|
||||
|
||||
.transition-opacity{
|
||||
.transition(opacity);
|
||||
}
|
||||
|
||||
.transition-background{
|
||||
.transition(background-color);
|
||||
}
|
||||
|
||||
.transition-color{
|
||||
.transition(color);
|
||||
}
|
||||
|
||||
.transition-color-background{
|
||||
.transition-custom(opacity .25s ease, background-color .25s ease);
|
||||
}
|
||||
Reference in New Issue
Block a user