Skip to content

Commit

Permalink
Fontbox view - #23
Browse files Browse the repository at this point in the history
  • Loading branch information
@lpsandaruwan
lpsandaruwan committed Jan 31, 2017
1 parent cc523f8 commit 047b814
Show file tree
Hide file tree
Showing 4 changed files with 115 additions and 132 deletions.
4 changes: 2 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

######Version: 0.1.0-SNAPSHOT

Fontman GUI using electron, angularjs and angular material.
Fontman desktop using electron, angularjs and angular material.
<br>

#####Requirements
Expand All @@ -16,7 +16,7 @@ bower install angular-inline-text-editor

#####Run application

Make sure [fms](https://github.com/fontman/fms) is running, otherwise it will only load the frames.
Make sure [fontman-desktop-core](https://github.com/fontman/fontman-desktop-core) is running, otherwise it will only load the frames.

```bash
npm start
Expand Down
105 changes: 80 additions & 25 deletions app/css/custom.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
}

#pagination span.page-selected {
background-color: red;
background-color: orangered;
color: white;
}

Expand Down Expand Up @@ -55,18 +55,18 @@ canvas.item {
pre:not(.contour) { margin: 0; }
pre.contour { margin: 0 0 1em 2em; border-bottom: solid 1px #a0a0a0; }
span.oncurve { color: blue; }
span.offcurve { color: red; }
span.offcurve { color: orangered; }



#red-slider .md-thumb:after, #red-slider .md-track-fill{
background-color: red !important;
border-color: red !important;
#orangered-slider .md-thumb:after, #orangered-slider .md-track-fill{
background-color: orangered !important;
border-color: orangered !important;
padding-top: 1px !important;
}

#red-slider .md-focus-thumb, #red-slider .md-focus-ring{
background-color: red;
#orangered-slider .md-focus-thumb, #orangered-slider .md-focus-ring{
background-color: orangered;
}

.auth-dialog {
Expand All @@ -75,19 +75,19 @@ span.offcurve { color: red; }
}

.bucket-button {
color: red !important;
color: orangered !important;
cursor: pointer;
}

.bucket-card {
.bucket-box {
cursor: pointer;
float: left;
height: 100px;
padding-left: 20px;
width: 100px;
}

.bucket-card .bucketed-text {
.bucket-box .bucketed-text {
bottom: 5px;
text-align: center;
}
Expand All @@ -100,7 +100,7 @@ span.offcurve { color: red; }
}

.bucketed-text {
color: red;
color: orangered;
}

.close-dialog-icon {
Expand All @@ -111,7 +111,7 @@ span.offcurve { color: red; }
padding:40px 40px 40px 40px;
}

.collection-card {
.collection-box {
float: left;
height: 180px;
width: 300px;
Expand Down Expand Up @@ -159,6 +159,43 @@ span.offcurve { color: red; }
color: #132c00;
}

/* Style The Dropdown Button */
.dropbtn {
font-size: 12px;
border: none;
cursor: pointer;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
position: relative;
display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
display: none;
font-size: 12px;
position: absolute;
background-color: #f9f9f9;
min-width: 100px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
color: black;
padding: 2px 4px;
text-decoration: none;
display: block;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
display: block;
}

.editable-box {
padding: 20px 20px 20px 20px;
}
Expand All @@ -168,7 +205,7 @@ span.offcurve { color: red; }
}

.error-response {
color: red;
color: orangered;
font-size: 14px;
padding-bottom: 10px;
}
Expand All @@ -179,33 +216,45 @@ span.offcurve { color: red; }
text-align: center;
}

.font-card {
.font-box {
float: left;
height: 180px;
min-height: 200px;
min-width: 200px;
padding: 5px 5px 5px 5px;
text-align: center;
width: 300px;
}

.font-card .card-button {
.font-box .box-button {
width: 50%;
margin: 0 auto;
font-size: 12px;
padding: 5px 5px 5px 5px;
}

.font-box .box-button:hover {
color: orangered;
cursor: pointer;
}

.font-card .div {
.font-box .div {
height: 60px;
padding-bottom: 10px;
}

.font-card .input-container {
.font-box .input-container {
font-size: 12px;
padding-right: 30px;
}

.font-card .slider {
.font-box .slider {
font-size: 12px;
padding-right: 30px;
}

.font-box .dropdown {

}

.font-form {
background-color: white;
padding-left: 20px;
Expand Down Expand Up @@ -247,7 +296,7 @@ span.offcurve { color: red; }
}

.md-accent {
color: red;
color: orangered;
}

.md-toolbar-tools {
Expand All @@ -256,7 +305,7 @@ span.offcurve { color: red; }
}

.nav-selected {
color: red;
color: orangered;
}

.search-area {
Expand Down Expand Up @@ -301,7 +350,7 @@ span.offcurve { color: red; }
background-color: white;
}

.white-colored {
.white-coloorangered {
color: white !important;
}

Expand Down Expand Up @@ -330,21 +379,27 @@ md-input-container > md-select:not([disabled]):focus .md-select-label {
}

md-select:not([disabled]):focus .md-select-value {
border-bottom-color: red;
border-bottom-color: orangered;
font-size: 12px !important;
}

md-select .md-select-value {
font-size: 12px !important;
}

md-option:focus {
color: orangered;
font-size: 12px !important;
}


md-tabs.md-default-theme md-ink-bar, md-tabs md-ink-bar {
color: #464646 !important;
background-color: #464646 !important;
}

md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]).md-active, md-tabs > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]).md-active md-icon, md-tabs.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]).md-active md-icon, md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]).md-focused, md-tabs.md-default-theme.md-accent > md-tabs-wrapper > md-tabs-canvas > md-pagination-wrapper > md-tab-item:not([disabled]).md-focused md-icon {
color: red !important;
color: orangered !important;
}

ul {
Expand Down
60 changes: 0 additions & 60 deletions app/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,66 +20,6 @@

<div class="sideBar" layout="column" ng-controller="mainController">

<span class="sideBar-space-padding-empty">
<md-input-container>
</md-input-container>
</span>

<md-sidemenu locked="true">

<md-sidemenu-group>

<md-sidemenu-button href="#/" ng-class="{'nav-selected':selectedNavIndex==0}" ng-click="setSelectedNavIndex(0)">
FONTS
</md-sidemenu-button>

<md-sidemenu-button href="#/collections" ng-class="{'nav-selected':selectedNavIndex==1}" ng-click="setSelectedNavIndex(1)">
COLLECTIONS
</md-sidemenu-button>

<md-sidemenu-button href="#/comparison" ng-class="{'nav-selected':selectedNavIndex==2}" ng-click="setSelectedNavIndex(2)">
TEST/COMPARE
</md-sidemenu-button>

</md-sidemenu-group>

<div class="sideBar-space-padding"></div>

<md-sidemenu-group>

<md-sidemenu-button ng-if="authStatus===false || authStatus.includes('undefined')" ng-click="loginDialog($event)">
SIGN IN
</md-sidemenu-button>

<md-sidemenu-button ng-if="authStatus.includes('undefined')" ng-click="createProfileDialog($event)">
SIGN UP
</md-sidemenu-button>

<md-sidemenu-content md-heading="{{fontmanUser}}" md-arrow="true" ng-if="authStatus===true">

<md-sidemenu-button ng-click="logout($event, fontmanUserId)">
LOGOUT
</md-sidemenu-button>

</md-sidemenu-content>

</md-sidemenu-group>

<div class="sideBar-space-padding"></div>

<md-sidemenu-group>

<md-sidemenu-button href="#/typecases" ng-if="authStatus===true">
MY TYPECASE
</md-sidemenu-button>

<md-sidemenu-button href="http://fontman.io/fund" target="_blank">
FUND
</md-sidemenu-button>

</md-sidemenu-group>

</md-sidemenu>

</div>

Expand Down
Loading

0 comments on commit 047b814

Please sign in to comment.