deblan-mirror/papercss
1
0
Fork 0
mirror of https://github.com/papercss/papercss synced 2024-06-28 02:10:02 +02:00
Code Issues Projects Releases Wiki Activity
591 commits 15 branches 25 tags 8.5 MiB
Commit graph

591 commits

This branch
This branch
All branches
Author SHA1 Message Date
Jan Bajena 5ee5960e84
Support multiple tab components 
Hi, first of all thank you for your cool framework. I really have fun working with it :)

I'm building an app for building flashcard sets in which I decided to use tabs component for switching between different languages. However I've noticed that current version assumes that there'll only be a single tab component on the page.

I overcame it in my project by changing `=` (attribute equals) selector to `$=` (attribute ends with) selector. 
This allows me to generate different tab IDs for different flashcards, like this:
```ruby
<% tab_name = "tabs_#{word.id}" %>
<% tab1_id = "#{tab_name}_tab1" %>
<% tab2_id = "#{tab_name}_tab2" %>

<div class="xs-12 sm-6 md-4 lg-3 col align-top flashcard-column">
  <div class="card">
    <div class="card-body">
      <div class="row tabs">
        <input id="<%= tab1_id %>" type="radio" name="<%= tab_name %>" checked>
        <label for="<%= tab1_id %>">Question</label>

        <input id="<%= tab2_id %>" type="radio" name="<%= tab_name %>">
        <label for="<%= tab2_id %>">Answer</label>

        <div id="<%= tab_name %>_content1" class="content">
          <h4 class="card-title flashcard-title"><%= word.question %></h4>
          <% if word.question_example %>
            <p class="card-text flashcard-example"><%= word.question_example %></p>
          <% end %>
        </div>
        <div id="<%= tab_name %>_content2" class="content">
          <h4 class="card-title flashcard-title"><%= word.answer %></h4>
          <% if word.answer_example %>
            <p class="card-text flashcard-example"><%= word.answer_example %></p>
          <% end %>
        </div>
      </div>
    </div>
  </div>
</div>
```

Here's a video to present how it works after the change:
https://www.loom.com/share/6de1e443314f44f49c7b91e9b5875c93

Hope someone finds it useful
 2020-07-30 21:43:39 +02:00
Kevin Koester fc4ede380a
Fixes #202 
Fixes Bug where the content would be aligned right next to the tabs on larger screens.

See: https://github.com/papercss/papercss/issues/202
 2020-07-10 11:44:26 +02:00
= 1ee089b924 chore: add comments for theme colors 2020-06-01 23:17:18 +02:00
= a7e099055c feat: add dark mode 2020-06-01 23:03:46 +02:00
= 36fcab8371 chore: (editorconfig) add quote_type 2020-06-01 22:55:06 +02:00
Renato Byrro fc54f0cf7f Fix link to License in About page 2019-08-23 15:21:43 -03:00
rhyneav cbbdce4d9e Update broken url 2019-08-18 13:09:58 -04:00
Rhyne 2d94af7997
Merge pull request #189 from fulldecent/patch-1 
Fix styling of word GitHub
 2019-08-18 13:03:23 -04:00
Rhyne 53d8c34a2c
Merge pull request #188 from impressivewebs/patch-1 
Fixed markup for nested lists
 2019-08-18 13:03:00 -04:00
William Entriken c6da9aee81
Fix styling of word GitHub 2019-07-30 13:05:53 -04:00
Louis Lazaris 012d8825aa
Fixed markup for nested lists 
It's a common mistake, but HTML lists should be nested so that a list is in between the opening and closing tags for a given list item. I've corrected it in these examples. Most browsers handle it fine but it's best to use correct HTML, just in case there's a browser or platform that doesn't parse it correctly.
 2019-05-23 00:27:57 -04:00
Rhyne e0b7a74c0e
Merge pull request #184 from Phreshhh/feature-breadcrumb 
Feature Breadcrumb
 2019-05-05 16:25:09 -04:00
Rhyne 84dde0dbad
Merge pull request #179 from Phreshhh/feature-navbar-fix-in-firefox 
Navbar fix for FireFox
 2019-05-05 16:23:18 -04:00
Phreshhh 95c7de0f27 Feature Breadcrumb 2019-02-14 12:53:16 +01:00
Phreshhh e9351b60af Feature Breadcrumb 2019-02-14 12:40:25 +01:00
Phreshhh 12af59b98a button fix for backward compatibility 2019-02-11 09:36:27 +01:00
Rhyne 2bf563c3f2
Merge pull request #181 from Phreshhh/feture-switch-component 
Switch components
 2019-02-08 18:21:18 -05:00
Rhyne de9fd41c6a
Merge pull request #180 from Phreshhh/feature-outline-buttons 
Outline buttons
 2019-02-08 18:15:40 -05:00
Phreshhh f9001e741b bg and shadow color changed to variable colors 2019-02-01 18:12:38 +01:00
Phreshhh 9f6be35b1b outline colormap removed 2019-02-01 17:36:54 +01:00
Phreshhh 923133c489 Switch components - stylelint fix 8 :) - realy last XD 2019-01-31 21:09:18 +01:00
Phreshhh aab82aa3c4 Switch components - stylelint fix 7 :) - last 2019-01-31 21:05:37 +01:00
Phreshhh 2e22ed491e Switch components - stylelint fix 6 :) 2019-01-31 21:00:20 +01:00
Phreshhh c0d9eb11a7 Switch components - stylelint fix 5 :) I installed stylelint to my editor.. next time will less commits. 2019-01-31 20:53:47 +01:00
Phreshhh 78a677b1b9 Switch components - stylelint fix 4 :) OMG alphabetical.. - Why?! lol 2019-01-31 20:44:57 +01:00
Phreshhh 608b93f7a9 Switch components - stylelint fix 3 :) 2019-01-31 20:32:01 +01:00
Phreshhh 8be95f87ba Switch components - stylelint fix 2 :) 2019-01-31 20:17:45 +01:00
Phreshhh df8e6b64d3 Switch components - stylelint fix 1 :) 2019-01-31 19:44:16 +01:00
Phreshhh 44f413b696 Switch components 2019-01-31 19:07:06 +01:00
Phreshhh a03b8dbc6d 'paper-btn' class added to linkbutton example. Sorry I left it 1st time. 2019-01-30 15:49:57 +01:00
Phreshhh 01f267fb8c Outline buttons - stylelint fix 2019-01-30 12:49:36 +01:00
Phreshhh 70b2a1422f Outline buttons 2019-01-30 12:36:11 +01:00
Phreshhh fad66597ce burger borderfix 2019-01-29 16:21:23 +01:00
Phreshhh 72ac948f70 margin-top removed 2019-01-29 15:39:08 +01:00
Phreshhh 6bc209efd8 margin-top stylelint fix 2019-01-29 15:10:44 +01:00
Phreshhh c9ea3a86c2 Navbar fix for FireFox 2019-01-29 14:58:36 +01:00
rhyneav 780c304f98 Merge branch 'release-1.6.1' 2019-01-25 07:20:02 -05:00
rhyneav 564c01b153 1.6.1 2019-01-25 07:18:37 -05:00
rhyneav 02b5d372bc Merge branch 'develop' into release-1.6.1 2019-01-25 07:11:48 -05:00
Rhyne 6695244c30
Merge pull request #177 from sarramegnag/fix-anchor-transition 
Fix hover transition on .paper-btn anchors
 2019-01-25 07:08:02 -05:00
Rhyne b5f837ca50
Merge pull request #176 from sarramegnag/fix-progress-bar 
Fix percentage calculation in progress bar for loop
 2019-01-25 07:07:51 -05:00
Rhyne 3a77420aaf
Merge pull request #175 from sarramegnag/fix-documentation 
Fix yarn install command documentation
 2019-01-25 07:07:39 -05:00
Guillaume Sarramegna a0c77badbd Fix hover transition on .paper-btn anchors 2018-12-28 01:08:19 +01:00
Guillaume Sarramegna 8af69f367c Fix percentage calculation in progress bar for loop 2018-12-27 23:35:42 +01:00
Guillaume Sarramegna 4c1eb37c68 Fix yarn install command documentation 2018-12-27 23:34:14 +01:00
Rhyne 03df3ea607
Merge pull request #171 from nelsonmestevao/patch-1 
Fix typo
 2018-12-07 19:42:59 -05:00
Nelson Estevão 9c3a9ddb7e
Fix typo 2018-12-04 23:31:39 +00:00
Rhyne dc474ed8c3
Merge pull request #170 from vanillaSlice/keyboard-control-on-radio-buttons-bug-fix 
Keyboard control on radio buttons bug fix
 2018-11-18 17:06:19 -05:00
vanillaSlice 0d51e714b6 Keyboard control on radio buttons bug fix 2018-11-17 17:46:37 +00:00
Thomas Cazade 6c20a60053
Merge pull request #165 from papercss/deps-audit 
Update deps to reduce the vulnerabilities, migrate to Gulp 4
 2018-11-05 15:18:26 +01:00