mdbootstrap/mdb-ui-kit
1
1
Fork 0
mirror of https://github.com/mdbootstrap/mdb-ui-kit.git synced 2025-07-22 05:59:47 +03:00
Code Issues Packages Projects Releases Wiki Activity

implement with bi app sass

Browse Source
This commit is contained in:
mhmardani 2017-02-05 14:04:25 +03:30
parent 6625d42cc2
commit 85d8f025c4
20 changed files with 417 additions and 121 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
.idea/bootstrap-material-design.iml Normal file
View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>

6
.idea/inspectionProfiles/Project_Default.xml Normal file
View File

@ -0,0 +1,6 @@
<component name="InspectionProjectProfileManager">
<profile version="1.0">
<option name="myName" value="Project Default" />
<inspection_tool class="Eslint" enabled="true" level="ERROR" enabled_by_default="true" />
</profile>
</component>

6
.idea/jsLibraryMappings.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptLibraryMappings">
<includedPredefinedLibrary name="ECMAScript 6" />
</component>
</project>

12
.idea/misc.xml Normal file
View File

@ -0,0 +1,12 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptSettings">
<option name="languageLevel" value="FLOW" />
</component>
<component name="JsFlowSettings">
<service-enabled>false</service-enabled>
<exe-path />
<annotation-enable>false</annotation-enable>
<other-services-enabled>false</other-services-enabled>
</component>
</project>

8
.idea/modules.xml Normal file
View File

@ -0,0 +1,8 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/bootstrap-material-design.iml" filepath="$PROJECT_DIR$/.idea/bootstrap-material-design.iml" />
</modules>
</component>
</project>

6
.idea/vcs.xml Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>

215
.idea/workspace.xml Normal file
View File

@ -0,0 +1,215 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="d7dca9f1-f284-4e3a-af63-85d94e0cb57c" name="Default" comment="">
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/bootstrap-material-design.iml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/inspectionProfiles/Project_Default.xml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/jsLibraryMappings.xml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/misc.xml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/modules.xml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/vcs.xml" />
<change type="NEW" beforePath="" afterPath="$PROJECT_DIR$/.idea/workspace.xml" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_buttons.scss" afterPath="$PROJECT_DIR$/sass/_buttons.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_cards.scss" afterPath="$PROJECT_DIR$/sass/_cards.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_checkboxes.scss" afterPath="$PROJECT_DIR$/sass/_checkboxes.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_dialogs.scss" afterPath="$PROJECT_DIR$/sass/_dialogs.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_form.scss" afterPath="$PROJECT_DIR$/sass/_form.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_inputs.scss" afterPath="$PROJECT_DIR$/sass/_inputs.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_lists.scss" afterPath="$PROJECT_DIR$/sass/_lists.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_radios.scss" afterPath="$PROJECT_DIR$/sass/_radios.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/_togglebutton.scss" afterPath="$PROJECT_DIR$/sass/_togglebutton.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/plugins/_plugin-dropdownjs.scss" afterPath="$PROJECT_DIR$/sass/plugins/_plugin-dropdownjs.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/plugins/_plugin-nouislider.scss" afterPath="$PROJECT_DIR$/sass/plugins/_plugin-nouislider.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/plugins/_plugin-selectize.scss" afterPath="$PROJECT_DIR$/sass/plugins/_plugin-selectize.scss" />
<change type="MODIFICATION" beforePath="$PROJECT_DIR$/sass/ripples.scss" afterPath="$PROJECT_DIR$/sass/ripples.scss" />
</list>
<ignored path="$PROJECT_DIR$/.tmp/" />
<ignored path="$PROJECT_DIR$/temp/" />
<ignored path="$PROJECT_DIR$/tmp/" />
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
<option name="TRACKING_ENABLED" value="true" />
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="CreatePatchCommitExecutor">
<option name="PATCH_PATH" value="" />
</component>
<component name="ExecutionTargetManager" SELECTED_TARGET="default_target" />
<component name="FavoritesManager">
<favorites_list name="bootstrap-material-design" />
</component>
<component name="FileEditorManager">
<leaf>
<file leaf-file-name="_checkboxes.scss" pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/sass/_checkboxes.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-133">
<caret line="13" column="24" lean-forward="false" selection-start-line="13" selection-start-column="24" selection-end-line="13" selection-end-column="24" />
<folding />
</state>
</provider>
</entry>
</file>
</leaf>
</component>
<component name="FindInProjectRecents">
<findStrings>
<find>.check</find>
</findStrings>
</component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="IdeDocumentHistory">
<option name="CHANGED_PATHS">
<list>
<option value="$PROJECT_DIR$/sass/_checkboxes.scss" />
</list>
</option>
</component>
<component name="JsBuildToolGruntFileManager" detection-done="true" sorting="DEFINITION_ORDER">
<gruntfile path="$PROJECT_DIR$/Gruntfile.js" />
</component>
<component name="JsBuildToolPackageJson" detection-done="true" sorting="DEFINITION_ORDER">
<package-json value="$PROJECT_DIR$/package.json" />
</component>
<component name="JsGulpfileManager">
<detection-done>true</detection-done>
<sorting>DEFINITION_ORDER</sorting>
</component>
<component name="ProjectFrameBounds">
<option name="y" value="24" />
<option name="width" value="1920" />
<option name="height" value="1056" />
</component>
<component name="ProjectView">
<navigator currentView="ProjectPane" proportions="" version="1">
<flattenPackages />
<showMembers />
<showModules />
<showLibraryContents />
<hideEmptyPackages />
<abbreviatePackageNames />
<autoscrollToSource />
<autoscrollFromSource />
<sortByType />
<manualOrder />
<foldersAlwaysOnTop value="true" />
</navigator>
<panes>
<pane id="Scratches" />
<pane id="ProjectPane">
<subPane>
<PATH>
<PATH_ELEMENT>
<option name="myItemId" value="bootstrap-material-design" />
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
</PATH_ELEMENT>
<PATH_ELEMENT>
<option name="myItemId" value="bootstrap-material-design" />
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
</PATH_ELEMENT>
</PATH>
<PATH>
<PATH_ELEMENT>
<option name="myItemId" value="bootstrap-material-design" />
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.ProjectViewProjectNode" />
</PATH_ELEMENT>
<PATH_ELEMENT>
<option name="myItemId" value="bootstrap-material-design" />
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
</PATH_ELEMENT>
<PATH_ELEMENT>
<option name="myItemId" value="sass" />
<option name="myItemType" value="com.intellij.ide.projectView.impl.nodes.PsiDirectoryNode" />
</PATH_ELEMENT>
</PATH>
</subPane>
</pane>
<pane id="Scope" />
</panes>
</component>
<component name="PropertiesComponent">
<property name="settings.editor.selected.configurable" value="Settings.JavaScript" />
<property name="nodejs_interpreter_path" value="/usr/local/bin/node" />
<property name="js.eslint.eslintPackage" value="/usr/local/lib/node_modules/eslint" />
<property name="js.eslint.nodeInterpreter" value="project" />
<property name="JavaScriptPreferStrict" value="false" />
<property name="JavaScriptWeakerCompletionTypeGuess" value="true" />
<property name="WebServerToolWindowFactoryState" value="false" />
<property name="last_opened_file_path" value="$PROJECT_DIR$" />
<property name="HbShouldOpenHtmlAsHb" value="" />
<property name="editor.config.accepted" value="true" />
</component>
<component name="ShelveChangesManager" show_recycled="false">
<option name="remove_strategy" value="false" />
</component>
<component name="TaskManager">
<task active="true" id="Default" summary="Default task">
<changelist id="d7dca9f1-f284-4e3a-af63-85d94e0cb57c" name="Default" comment="" />
<created>1486286023493</created>
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1486286023493</updated>
<workItem from="1486286024796" duration="2478000" />
</task>
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="2478000" />
</component>
<component name="ToolWindowManager">
<frame x="0" y="24" width="1920" height="1056" extended-state="6" />
<editor active="true" />
<layout>
<window_info id="Project" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="true" show_stripe_button="true" weight="0.24986821" sideWeight="0.5" order="0" side_tool="false" content_ui="combo" />
<window_info id="TODO" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="6" side_tool="false" content_ui="tabs" />
<window_info id="Grunt " active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="true" content_ui="tabs" />
<window_info id="Event Log" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="true" content_ui="tabs" />
<window_info id="Version Control" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="false" content_ui="tabs" />
<window_info id="npm" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="true" content_ui="tabs" />
<window_info id="Structure" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
<window_info id="Terminal" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="false" content_ui="tabs" />
<window_info id="Favorites" active="false" anchor="left" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="-1" side_tool="true" content_ui="tabs" />
<window_info id="Cvs" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="4" side_tool="false" content_ui="tabs" />
<window_info id="Hierarchy" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="2" side_tool="false" content_ui="combo" />
<window_info id="Message" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="0" side_tool="false" content_ui="tabs" />
<window_info id="Commander" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.4" sideWeight="0.5" order="0" side_tool="false" content_ui="tabs" />
<window_info id="Find" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
<window_info id="Inspection" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.4" sideWeight="0.5" order="5" side_tool="false" content_ui="tabs" />
<window_info id="Run" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.33" sideWeight="0.5" order="2" side_tool="false" content_ui="tabs" />
<window_info id="Ant Build" active="false" anchor="right" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.25" sideWeight="0.5" order="1" side_tool="false" content_ui="tabs" />
<window_info id="Debug" active="false" anchor="bottom" auto_hide="false" internal_type="DOCKED" type="DOCKED" visible="false" show_stripe_button="true" weight="0.4" sideWeight="0.5" order="3" side_tool="false" content_ui="tabs" />
</layout>
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="processedProjectFiles" value="true" />
</component>
<component name="VcsContentAnnotationSettings">
<option name="myLimit" value="2678400000" />
</component>
<component name="XDebuggerManager">
<breakpoint-manager />
<watches-manager />
</component>
<component name="editorHistoryManager">
<entry file="file://$PROJECT_DIR$/sass/_panels.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="0">
<caret line="0" column="0" lean-forward="false" selection-start-line="0" selection-start-column="0" selection-end-line="0" selection-end-column="0" />
<folding />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/sass/_checkboxes.scss">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="-133">
<caret line="13" column="24" lean-forward="false" selection-start-line="13" selection-start-column="24" selection-end-line="13" selection-end-column="24" />
<folding />
</state>
</provider>
</entry>
</component>
</project>

8
sass/_buttons.scss
View File

@ -2,7 +2,7 @@
// specification: https://www.google.com/design/spec/components/buttons.html // specification: https://www.google.com/design/spec/components/buttons.html
@mixin typo-button($colorContrast: false){ @mixin typo-button($colorContrast: false) {
font-size: $mdb-btn-font-size-base; font-size: $mdb-btn-font-size-base;
font-weight: 500; font-weight: 500;
text-transform: uppercase; text-transform: uppercase;
@ -141,14 +141,16 @@
&.material-icons { &.material-icons {
top: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2; top: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2;
left: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2; //left: ($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2;
@include left(($mdb-btn-icon-size-mini - $mdb-btn-fab-font-size) / 2);
} }
} }
i.material-icons { i.material-icons {
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 50%; //left: 50%;
@include left(50%);
transform: translate(-($mdb-btn-fab-font-size / 2), -($mdb-btn-fab-font-size / 2)); transform: translate(-($mdb-btn-fab-font-size / 2), -($mdb-btn-fab-font-size / 2));
line-height: $mdb-btn-fab-font-size; line-height: $mdb-btn-fab-font-size;
width: $mdb-btn-fab-font-size; width: $mdb-btn-fab-font-size;

6
sass/_cards.scss
View File

@ -41,7 +41,8 @@
.card-image-headline { .card-image-headline {
position: absolute; position: absolute;
bottom: 16px; bottom: 16px;
left: 18px; //left: 18px;
@include left(18px);
color: $mdb-card-image-headline; color: $mdb-card-image-headline;
font-size: 2em; font-size: 2em;
} }
@ -61,7 +62,8 @@
bottom: 25px; bottom: 25px;
width: auto; width: auto;
&:first-child { &:first-child {
left: -15px; //left: -15px;
@include left(-15px);
} }
} }
} }

178
sass/_checkboxes.scss
View File

@ -5,10 +5,15 @@
.checkbox label, .checkbox label,
label.checkbox-inline { label.checkbox-inline {
cursor: pointer; cursor: pointer;
padding-left: 0; // Reset for Bootstrap rule //padding-left: 0; // Reset for Bootstrap rule
@include padding-left(6px);
color: $mdb-checkbox-label-color; color: $mdb-checkbox-label-color;
@include mdb-label-color-toggle-focus(); @include mdb-label-color-toggle-focus();
} }
.checkbox label {
@include padding-left(45px);
position: relative;
}
.checkbox, .checkbox,
label.checkbox-inline { label.checkbox-inline {
@ -21,19 +26,23 @@ label.checkbox-inline {
width: 0; width: 0;
height: 0; height: 0;
overflow: hidden; overflow: hidden;
left: 0; //left: 0;
@include left(0);
pointer-events: none; pointer-events: none;
} }
.checkbox-material { .checkbox-material {
vertical-align: middle; vertical-align: middle;
position: relative;
top: 3px; top: 3px;
position: absolute;
//right: 0;
@include left(0);
&:before { // FIXME: document why this is necessary (doesn't seem to be on chrome) &:before { // FIXME: document why this is necessary (doesn't seem to be on chrome)
display: block; display: block;
position: absolute; position: absolute;
top:-5px; top: -5px;
left: 0; //left: 0;
@include left(0);
content: ""; content: "";
background-color: rgba(0, 0, 0, .84); background-color: rgba(0, 0, 0, .84);
height: $mdb-checkbox-size; height: $mdb-checkbox-size;
@ -46,6 +55,7 @@ label.checkbox-inline {
} }
.check { .check {
direction: ltr;
position: relative; position: relative;
display: inline-block; display: inline-block;
width: $mdb-checkbox-size; width: $mdb-checkbox-size;
@ -56,6 +66,8 @@ label.checkbox-inline {
z-index: 1; z-index: 1;
} }
.check:before { .check:before {
top: 0;
left: 0;
position: absolute; position: absolute;
content: ""; content: "";
transform: rotate(45deg); transform: rotate(45deg);
@ -64,14 +76,13 @@ label.checkbox-inline {
margin-left: 6px; margin-left: 6px;
width: 0; width: 0;
height: 0; height: 0;
box-shadow: box-shadow: 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0 inset;
0 0 0 0 inset;
} }
} }
@ -81,9 +92,9 @@ label.checkbox-inline {
opacity: 0.2; opacity: 0.2;
} }
&:focus{ &:focus {
&:checked{ &:checked {
& + .checkbox-material:before { & + .checkbox-material:before {
animation: rippleOn 500ms; animation: rippleOn 500ms;
} }
@ -109,7 +120,6 @@ label.checkbox-inline {
} }
&:checked { &:checked {
// FIXME: once working - combine further to reduce code // FIXME: once working - combine further to reduce code
@ -120,13 +130,12 @@ label.checkbox-inline {
& + .checkbox-material .check:before { & + .checkbox-material .check:before {
color: $mdb-checkbox-checked-color; color: $mdb-checkbox-checked-color;
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 20px -12px 0 11px;
20px -12px 0 11px;
} }
& + .checkbox-material .check:after { & + .checkbox-material .check:after {
@ -151,99 +160,94 @@ label.checkbox-inline {
@keyframes checkbox-on { @keyframes checkbox-on {
0% { 0% {
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 15px 2px 0 11px;
15px 2px 0 11px;
} }
50% { 50% {
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 20px 2px 0 11px;
20px 2px 0 11px;
} }
100% { 100% {
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 20px -12px 0 11px;
20px -12px 0 11px;
} }
} }
@keyframes checkbox-off { @keyframes checkbox-off {
0% { 0% {
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 20px -12px 0 11px,
20px -12px 0 11px, 0 0 0 0 inset;
0 0 0 0 inset;
} }
25% { 25% {
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 20px -12px 0 11px,
20px -12px 0 11px, 0 0 0 0 inset;
0 0 0 0 inset;
} }
50% { 50% {
transform: rotate(45deg); transform: rotate(45deg);
margin-top: -4px; margin-top: -4px;
margin-left: 6px; //margin-left: 6px;
@include margin-left(6px);
width: 0; width: 0;
height: 0; height: 0;
box-shadow: box-shadow: 0 0 0 10px,
0 0 0 10px, 10px -10px 0 10px,
10px -10px 0 10px, 32px 0 0 20px,
32px 0 0 20px, 0px 32px 0 20px,
0px 32px 0 20px, -5px 5px 0 10px,
-5px 5px 0 10px, 15px 2px 0 11px,
15px 2px 0 11px, 0 0 0 0 inset;
0 0 0 0 inset;
} }
51% { 51% {
transform: rotate(0deg); transform: rotate(0deg);
margin-top: -2px; margin-top: -2px;
margin-left: -2px; //margin-left: -2px;
@include margin-left(-2px);
width: 20px; width: 20px;
height: 20px; height: 20px;
box-shadow: box-shadow: 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0px 0 0 10px inset;
0px 0 0 10px inset;
} }
100% { 100% {
transform: rotate(0deg); transform: rotate(0deg);
margin-top: -2px; margin-top: -2px;
margin-left: -2px; //margin-left: -2px;
@include margin-left(-2px);
width: 20px; width: 20px;
height: 20px; height: 20px;
box-shadow: box-shadow: 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0 0 0 0,
0 0 0 0, 0px 0 0 0 inset;
0px 0 0 0 inset;
} }
} }

3
sass/_dialogs.scss
View File

@ -38,7 +38,8 @@
padding-left: 5px; padding-left: 5px;
padding-right: 5px; padding-right: 5px;
position: relative; position: relative;
left: -5px; //left: -5px;
@include left(-5px);
} }
} }
button+button { button+button {

3
sass/_form.scss
View File

@ -33,7 +33,8 @@
} }
label { label {
text-align: right; //text-align: right;
@include text-align(right);
} }
label.control-label { label.control-label {

3
sass/_inputs.scss
View File

@ -13,7 +13,8 @@
@mixin label-static($label-top, $static-font-size, $static-line-height){ @mixin label-static($label-top, $static-font-size, $static-line-height){
label.control-label { label.control-label {
top: $label-top; top: $label-top;
left: 0; //left: 0;
@include left(0);
// must repeat because the selector above is more specific than the general label sizing // must repeat because the selector above is more specific than the general label sizing
font-size: $static-font-size; font-size: $static-font-size;
line-height: $static-line-height; line-height: $static-line-height;

21
sass/_lists.scss
View File

@ -17,7 +17,8 @@
.row-picture, .row-action-primary { .row-picture, .row-action-primary {
//float: left; WARNING: float can't be used with display: inline-block. Certain properties shouldn't be used with certain display property values. (display-property-grouping) Browsers: All //float: left; WARNING: float can't be used with display: inline-block. Certain properties shouldn't be used with certain display property values. (display-property-grouping) Browsers: All
display: inline-block; display: inline-block;
padding-right: 16px; //padding-right: 16px;
@include padding-right(16px);
img, i, label { img, i, label {
display: block; display: block;
width: 56px; width: 56px;
@ -39,12 +40,15 @@
color: white; color: white;
} }
label { label {
margin-left: 7px; //margin-left: 7px;
margin-right: -7px; @include margin-left(7px);
//margin-right: -7px;
@include margin-right(-7px);
margin-top: 5px; margin-top: 5px;
margin-bottom: -5px; margin-bottom: -5px;
.checkbox-material { .checkbox-material {
left: -10px; //left: -10px;
@include left(-10px);
} }
} }
} }
@ -54,7 +58,8 @@
min-height: 66px; min-height: 66px;
.action-secondary { .action-secondary {
position: absolute; position: absolute;
right: 16px; //right: 16px;
@include right(16px);
top: 16px; top: 16px;
i { i {
font-size: 20px; font-size: 20px;
@ -67,7 +72,8 @@
} }
.least-content { .least-content {
position: absolute; position: absolute;
right: 16px; //right: 16px;
@include right(16px);
top: 0; top: 0;
color: rgba(0,0,0,0.54); color: rgba(0,0,0,0.54);
font-size: 14px; font-size: 14px;
@ -98,7 +104,8 @@
content: ""; content: "";
width: unquote("calc(100% - 90px)"); width: unquote("calc(100% - 90px)");
border-bottom: 1px solid rgba(0,0,0,0.1); border-bottom: 1px solid rgba(0,0,0,0.1);
float: right; //float: right;
@include float(right);
} }
} }
} }

8
sass/_radios.scss
View File

@ -17,7 +17,8 @@
.radio label, label.radio-inline { .radio label, label.radio-inline {
cursor: pointer; cursor: pointer;
padding-left: 45px; //padding-left: 45px;
@include padding-left(45px);
position: relative; position: relative;
color: $mdb-radio-label-color; color: $mdb-radio-label-color;
@include mdb-label-color-toggle-focus(); @include mdb-label-color-toggle-focus();
@ -27,7 +28,7 @@
span { span {
display: block; display: block;
position: absolute; position: absolute;
left: 10px; @include left(10px);
top: 2px; top: 2px;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
@ -49,7 +50,8 @@
position: absolute; position: absolute;
content: ""; content: "";
background-color: $mdb-text-color-primary; background-color: $mdb-text-color-primary;
left: -18px; //left: -18px;
@include left(-18px);
top: -18px; top: -18px;
height: 50px; height: 50px;
width: 50px; width: 50px;

9
sass/_togglebutton.scss
View File

@ -29,7 +29,8 @@
height: 15px; height: 15px;
background-color: rgba(80, 80, 80, 0.7); background-color: rgba(80, 80, 80, 0.7);
border-radius: 15px; border-radius: 15px;
margin-right: 15px; //margin-right: 15px;
@include margin-right(15px);
transition: background 0.3s ease; transition: background 0.3s ease;
vertical-align: middle; vertical-align: middle;
} }
@ -43,7 +44,8 @@
border-radius: 20px; border-radius: 20px;
position: relative; position: relative;
box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4); box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
left: -5px; //left: -5px;
@include left(-5px);
top: -2px; top: -2px;
transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease; transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
} }
@ -63,7 +65,8 @@
// Ripple off and disabled // Ripple off and disabled
&:checked + .toggle:after { &:checked + .toggle:after {
left: 15px; //left: 15px;
@include left(15px);
} }
} }

3
sass/plugins/_plugin-dropdownjs.scss
View File

@ -1,7 +1,8 @@
// This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten. // This file has been autogenerated by grunt task lessToSass. Any changes will be overwritten.
.dropdownjs::after { .dropdownjs::after {
right: 5px; //right: 5px;
@include right(5px);
top: 3px; top: 3px;
font-size: 25px; font-size: 25px;
position: absolute; position: absolute;

9
sass/plugins/_plugin-nouislider.scss
View File

@ -43,7 +43,8 @@
box-sizing: border-box; box-sizing: border-box;
width: 12px; width: 12px;
height: 12px; height: 12px;
left: -10px; //left: -10px;
@include left(-10px);
top: -5px; top: -5px;
cursor: ew-resize; cursor: ew-resize;
border-radius: 100%; border-radius: 100%;
@ -51,14 +52,16 @@
border: 1px solid; border: 1px solid;
} }
.noUi-vertical .noUi-handle { .noUi-vertical .noUi-handle {
margin-left: 5px; //margin-left: 5px;
@include margin-left(5px);
cursor: ns-resize; cursor: ns-resize;
} }
.noUi-horizontal.noUi-extended { .noUi-horizontal.noUi-extended {
padding: 0 15px; padding: 0 15px;
} }
.noUi-horizontal.noUi-extended .noUi-origin { .noUi-horizontal.noUi-extended .noUi-origin {
right: -15px; //right: -15px;
@include right(-15px);
} }
.noUi-background { .noUi-background {
height: 2px; height: 2px;

6
sass/plugins/_plugin-selectize.scss
View File

@ -19,7 +19,8 @@
padding: 0; padding: 0;
} }
&:after { &:after {
right: 5px; //right: 5px;
@include right(5px);
position: absolute; position: absolute;
font-size: 25px; font-size: 25px;
content: "\e5c5"; content: "\e5c5";
@ -44,7 +45,8 @@
} }
> div, > .item { > div, > .item {
display: inline-block; display: inline-block;
margin: 0 8px 3px 0; //margin: 0 8px 3px 0;
@include margin(0,8px,3px,0);
padding: 0; padding: 0;
background: transparent; background: transparent;
border: 0; border: 0;

6
sass/ripples.scss
View File

@ -6,7 +6,8 @@
.ripple-container { .ripple-container {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; //left: 0;
@include left(0);
z-index: 1; z-index: 1;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -18,7 +19,8 @@
position: absolute; position: absolute;
width: 20px; width: 20px;
height: 20px; height: 20px;
margin-left: -10px; //margin-left: -10px;
@include margin-left(-10px);
margin-top: -10px; margin-top: -10px;
border-radius: 100%; border-radius: 100%;
background-color: #000; // fallback color background-color: #000; // fallback color